Prism.js syntax highlighting for code blocks

— Updated

Syntax highlighting is done using Prism.js with the default nord theme. You can customise to whichever theme you want from the plenty available prism themes.

const multiply = (a, b) => a * b
multiply(2, 2) // 4

HTML Code Block​

An example HTML code block.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Example HTML5 Document</title>
  </head>
  <body>
    <p>Test</p>
  </body>
</html>

JSX Code Block​

An example jsx code block.

const Greet = () => {
  const message = `Hello World!`
  return <div>{message}</div>
}

CSS Code Block​

An example css code block.

.layout {
  display: grid;
  grid-template-columns: 5rem minmax(0, 1fr) 4rem;
}

…and many more. Explore all the languages supported by Prism.js.