ℹ️ This feature doesn’t have a corresponding React component yet.

Rouge will parse and apply highlight styles via CSS classes to fenced code blocks that have a language specified.

For example:

```ruby
def what?
  42
end
```

would yield:

def what?
  42
end

Highlight provides custom color schemes for the Ruby-based Rouge code syntax highlighter.

It supports colors for both light and dark themes.

Use <pre> and <code> to wrap code blocks.

Give context to code blocks using headings and short descriptive paragraphs, eg. specify the language, encoding, or file associated with the code block as relevant.

This feature does not use the DS’ .bc- class prefix for its .highlight and .language-$lang classes because Rouge does/did not provide a means to set custom wrapping classes.

• Body (Foundations)
• Markdown (Containers)