---
sidebar_position: 100
sidebar_label: Code blocks
title: Code blocks
description: Understanding what is possible with EventCatalog code blocks
---

EventCatalog is powered by markdown files, this allows you to add custom code blocks.

EventCatalog is using [expressive-code](https://expressive-code.com/) which provides a range of additional features for your code blocks.

**Features include:**

- [Editor & Terminal Frames](https://expressive-code.com/key-features/frames/)
- [Text & Line Markers](https://expressive-code.com/key-features/text-markers/)
  - [Adding labels to line markers](https://expressive-code.com/key-features/text-markers/#adding-labels-to-line-markers) - Great way to give context to your example code.
  - [Using diff-like syntax](https://expressive-code.com/key-features/text-markers/#using-diff-like-syntax) - Add diffs to your examples (e.g Schemas)
  - [Marking individual text inside lines](https://expressive-code.com/key-features/text-markers/#marking-individual-text-inside-lines)
- [Word wrapping](https://expressive-code.com/key-features/word-wrap/)
- [And more...](https://expressive-code.com/)

## Examples of code blocks

### Diff code blocks
Highlight diffs with your code, could be useful for your Schemas or any changes you want to show to your teams.

![Example](/img/code-blocks/diff.png)
![Example](/img/code-blocks/diff2.png)

See https://expressive-code.com/key-features/text-markers/#using-diff-like-syntax

### Word highlighting
If you want to highlight words in your code blocks you can use this feature.

![Example](/img/code-blocks/word-highlight.png)
![Example](/img/code-blocks/word-highlight2.png)

See https://expressive-code.com/key-features/text-markers/#marking-individual-text-inside-lines

### Labels to line markers
Great way to give context to changes in your code. For example if your Schema has changed, then maybe use this to give context with additional labels.

![Example](/img/code-blocks/context-diff.png)

See https://expressive-code.com/key-features/text-markers/#adding-labels-to-line-markers

### Frames

Nice UI for your code blocks.

![Example](/img/code-blocks/title-blocks.png)

See https://expressive-code.com/key-features/frames/