mirror of https://github.com/gohugoio/hugo
36 lines
1.0 KiB
Markdown
36 lines
1.0 KiB
Markdown
---
|
|
title: Syntax highlighting styles
|
|
description: Highlight code examples using one of these styles.
|
|
categories: []
|
|
keywords: [highlight]
|
|
---
|
|
|
|
## Overview
|
|
|
|
Hugo provides several methods to add syntax highlighting to code examples:
|
|
|
|
- Use the [`transform.Highlight`] function within your templates
|
|
- Use the [`highlight`] shortcode with any [content format](g)
|
|
- Use fenced code blocks with the Markdown content format
|
|
|
|
Regardless of method, use any of the syntax highlighting styles below.
|
|
|
|
Set the default syntax highlighting style in your site configuration:
|
|
|
|
{{< code-toggle file=hugo >}}
|
|
[markup.highlight]
|
|
style = 'monokai'
|
|
{{< /code-toggle >}}
|
|
|
|
See [configure Markup](/configuration/markup/#highlight).
|
|
|
|
[`transform.Highlight`]: /functions/transform/highlight/
|
|
[`highlight`]: /shortcodes/highlight/
|
|
[fenced code blocks]: /content-management/syntax-highlighting/#fenced-code-blocks
|
|
|
|
## Styles
|
|
|
|
This gallery demonstrates the application of each syntax highlighting style with code examples written in different programming languages.
|
|
|
|
{{% syntax-highlighting-styles %}}
|