Use the Code snippet web part

Use the Code snippet web part

When you add a modern page to a site, you add and customize web parts, which are the building blocks of your page. This article focuses on the Code snippet web part.

The Code snippet web part allows you to easily display code as text on your page for others to use or learn from. You can select the code language and a dark or light theme. The web part even auto-corrects syntax.

Note: Some functionality is introduced gradually to organizations that have opted in to the Targeted Release program. This means that you may not yet see this feature or it may look different than what is described in the help articles.

Add the Code snippet web part

  1. Go to the page where you want to add the Code snippet web part.

  2. If your page is not already in edit mode, click Edit at the top right of the page.

    Hover your mouse above or below an existing web part and you'll see a line with a circled +, like this:

    Plus sign for adding web parts to a page

  3. Click +, and then select Code snippet from the list of web parts.

  4. On the toolbar, select the language, whether you want numbered lines, and a light or dark theme.

    Code snippet web part in edit mode

  5. Click Edit web part Web part edit button on the left side to turn line wrapping on or off.

  6. When you're ready, click Publish at the top right of your page.

Expand your Office skills
Explore training
Get new features first
Join Office Insiders

Was this information helpful?

Thank you for your feedback!

Thank you for your feedback! It sounds like it might be helpful to connect you to one of our Office support agents.