Code blocks

When authoring markdown using the Carbon Gatsby theme, code blocks have some extra super powers you can take advantage of. We provide carbon-themed syntax highlighting as well as optional path and src features.

Examples

/directory/file.mdx
### Path and src

/directory/file.mdx
### Just path

### Just src

### No path or src

/directory/file.mdx
### Path and src w/ overflow
This example overflows to demonstrate the text fading out under the side bar. This example overflows to demonstrate the text fading out under the side bar.
This example overflows to demonstrate the text fading out under the side bar. This example overflows to demonstrate the text fading out under the side bar.

Code block

within a list item

/directory/file.mdx
### Path and src w/ overflow
This example overflows to demonstrate the text fading out under the side bar. This example overflows to demonstrate the text fading out under the side bar.
This example overflows to demonstrate the text fading out under the side bar. This example overflows to demonstrate the text fading out under the side bar.

Code

```markdown path=/directory/file.mdx src=https://gatsby-theme-carbon.now.sh
### Path and src
This code snippet provides both a `path` and a `src`.
```

Props

property	propType	description
language	string	Available languages.
src	string	The full url of a relevant link (source)
path	string	A string indicating the filename or path. Due to markdown limitations this can only be a single word

Edit this page on GitHub

Components: Caption

Components: DoDontExample