New code block element in Webflow

Today Webflow introduced long-awaited "Code Block" elements that allow you to add code snippets to your website with the right syntax for your programming language.

Code Block Settings

Once you add your code block to the canvas you will be able to choose:

• Over 50+ Programming Languages
• Dark or Light Theme
• Show the line number or not

Code Block Styling

Can you style your code block to match your brand guidelines?
Yes, you can style it as usual elements except you cannot change background color or text color.

When to use it?

Code block is designed for easier showcasing of the code snippets and coping it.

It's ideal for programming communities, tutorials, updates...

Learn more about the code block element on Webflow University.