Interactive code block with tabs to toggle languages

Below is a screenshot of the wireframe that I would like to build. I would like to create tabs that contain code blocks of different languages. I’m trying to not only figure out how to style my tabs accordingly, but how to style a code block as well.


Here is my site Read-Only: Webflow - Pieces Rebuild

hi @Nicole_Wallace for syntax highlighting you can look https://prismjs.com I thing there are a few videos on practice how to use it. It should work fine in standard dev, my only concern will be you can hit limit with 10.000 characters on embed and maybe expect to have issues with this vintage code editor WF offer as 2022 tool to go. :sweat_smile:

You may use WF tabs but if you hit some wall of predefined WF restrictions here another link that may help you with creating something useful from scratch.

Finally you can use eg. embed from https://codesandbox.io but this is another level that you may not need. But there are many other useful modern tools to use.

example

Great, thank you @Stan! I will try these solutions out!