Skip to main content Svelte Highlight v7.6.0

Styles

248 styles from highlight.js v11.9.0.

Import method
Name
Import
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import _3024 from "svelte-highlight/styles/3024";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html _3024}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import a11yDark from "svelte-highlight/styles/a11y-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html a11yDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import a11yLight from "svelte-highlight/styles/a11y-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html a11yLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import agate from "svelte-highlight/styles/agate";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html agate}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import anOldHope from "svelte-highlight/styles/an-old-hope";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html anOldHope}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import androidstudio from "svelte-highlight/styles/androidstudio";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html androidstudio}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import apathy from "svelte-highlight/styles/apathy";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html apathy}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import apprentice from "svelte-highlight/styles/apprentice";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html apprentice}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import arduinoLight from "svelte-highlight/styles/arduino-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html arduinoLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import arta from "svelte-highlight/styles/arta";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html arta}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import ascetic from "svelte-highlight/styles/ascetic";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html ascetic}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import ashes from "svelte-highlight/styles/ashes";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html ashes}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierCave from "svelte-highlight/styles/atelier-cave";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierCave}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierCaveLight from "svelte-highlight/styles/atelier-cave-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierCaveLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierDune from "svelte-highlight/styles/atelier-dune";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierDune}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierDuneLight from "svelte-highlight/styles/atelier-dune-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierDuneLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierEstuary from "svelte-highlight/styles/atelier-estuary";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierEstuary}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierEstuaryLight from "svelte-highlight/styles/atelier-estuary-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierEstuaryLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierForest from "svelte-highlight/styles/atelier-forest";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierForest}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierForestLight from "svelte-highlight/styles/atelier-forest-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierForestLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierHeath from "svelte-highlight/styles/atelier-heath";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierHeath}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierHeathLight from "svelte-highlight/styles/atelier-heath-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierHeathLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierLakeside from "svelte-highlight/styles/atelier-lakeside";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierLakeside}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierLakesideLight from "svelte-highlight/styles/atelier-lakeside-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierLakesideLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierPlateau from "svelte-highlight/styles/atelier-plateau";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierPlateau}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierPlateauLight from "svelte-highlight/styles/atelier-plateau-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierPlateauLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierSavanna from "svelte-highlight/styles/atelier-savanna";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierSavanna}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierSavannaLight from "svelte-highlight/styles/atelier-savanna-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierSavannaLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierSeaside from "svelte-highlight/styles/atelier-seaside";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierSeaside}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierSeasideLight from "svelte-highlight/styles/atelier-seaside-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierSeasideLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierSulphurpool from "svelte-highlight/styles/atelier-sulphurpool";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierSulphurpool}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atelierSulphurpoolLight from "svelte-highlight/styles/atelier-sulphurpool-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atelierSulphurpoolLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atlas from "svelte-highlight/styles/atlas";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atlas}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atomOneDark from "svelte-highlight/styles/atom-one-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atomOneDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atomOneDarkReasonable from "svelte-highlight/styles/atom-one-dark-reasonable";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atomOneDarkReasonable}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import atomOneLight from "svelte-highlight/styles/atom-one-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html atomOneLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import base16Github from "svelte-highlight/styles/base16-github";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html base16Github}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import base16IrBlack from "svelte-highlight/styles/base16-ir-black";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html base16IrBlack}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import base16Monokai from "svelte-highlight/styles/base16-monokai";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html base16Monokai}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import base16Nord from "svelte-highlight/styles/base16-nord";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html base16Nord}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import bespin from "svelte-highlight/styles/bespin";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html bespin}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import blackMetal from "svelte-highlight/styles/black-metal";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html blackMetal}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import blackMetalBathory from "svelte-highlight/styles/black-metal-bathory";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html blackMetalBathory}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import blackMetalBurzum from "svelte-highlight/styles/black-metal-burzum";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html blackMetalBurzum}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import blackMetalDarkFuneral from "svelte-highlight/styles/black-metal-dark-funeral";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html blackMetalDarkFuneral}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import blackMetalGorgoroth from "svelte-highlight/styles/black-metal-gorgoroth";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html blackMetalGorgoroth}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import blackMetalImmortal from "svelte-highlight/styles/black-metal-immortal";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html blackMetalImmortal}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import blackMetalKhold from "svelte-highlight/styles/black-metal-khold";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html blackMetalKhold}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import blackMetalMarduk from "svelte-highlight/styles/black-metal-marduk";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html blackMetalMarduk}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import blackMetalMayhem from "svelte-highlight/styles/black-metal-mayhem";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html blackMetalMayhem}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import blackMetalNile from "svelte-highlight/styles/black-metal-nile";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html blackMetalNile}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import blackMetalVenom from "svelte-highlight/styles/black-metal-venom";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html blackMetalVenom}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import brewer from "svelte-highlight/styles/brewer";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html brewer}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import bright from "svelte-highlight/styles/bright";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html bright}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import brogrammer from "svelte-highlight/styles/brogrammer";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html brogrammer}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import brownPaper from "svelte-highlight/styles/brown-paper";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html brownPaper}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import brushTrees from "svelte-highlight/styles/brush-trees";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html brushTrees}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import brushTreesDark from "svelte-highlight/styles/brush-trees-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html brushTreesDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import chalk from "svelte-highlight/styles/chalk";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html chalk}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import circus from "svelte-highlight/styles/circus";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html circus}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import classicDark from "svelte-highlight/styles/classic-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html classicDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import classicLight from "svelte-highlight/styles/classic-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html classicLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import codepenEmbed from "svelte-highlight/styles/codepen-embed";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html codepenEmbed}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import codeschool from "svelte-highlight/styles/codeschool";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html codeschool}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import colorBrewer from "svelte-highlight/styles/color-brewer";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html colorBrewer}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import colors from "svelte-highlight/styles/colors";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html colors}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import cupcake from "svelte-highlight/styles/cupcake";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html cupcake}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import cupertino from "svelte-highlight/styles/cupertino";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html cupertino}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import danqing from "svelte-highlight/styles/danqing";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html danqing}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import darcula from "svelte-highlight/styles/darcula";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html darcula}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import dark from "svelte-highlight/styles/dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html dark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import darkViolet from "svelte-highlight/styles/dark-violet";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html darkViolet}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import darkmoss from "svelte-highlight/styles/darkmoss";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html darkmoss}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import darktooth from "svelte-highlight/styles/darktooth";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html darktooth}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import decaf from "svelte-highlight/styles/decaf";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html decaf}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import _default from "svelte-highlight/styles/default";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html _default}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import defaultDark from "svelte-highlight/styles/default-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html defaultDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import defaultLight from "svelte-highlight/styles/default-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html defaultLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import devibeans from "svelte-highlight/styles/devibeans";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html devibeans}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import dirtysea from "svelte-highlight/styles/dirtysea";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html dirtysea}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import docco from "svelte-highlight/styles/docco";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html docco}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import dracula from "svelte-highlight/styles/dracula";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html dracula}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import edgeDark from "svelte-highlight/styles/edge-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html edgeDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import edgeLight from "svelte-highlight/styles/edge-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html edgeLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import eighties from "svelte-highlight/styles/eighties";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html eighties}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import embers from "svelte-highlight/styles/embers";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html embers}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import equilibriumDark from "svelte-highlight/styles/equilibrium-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html equilibriumDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import equilibriumGrayDark from "svelte-highlight/styles/equilibrium-gray-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html equilibriumGrayDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import equilibriumGrayLight from "svelte-highlight/styles/equilibrium-gray-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html equilibriumGrayLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import equilibriumLight from "svelte-highlight/styles/equilibrium-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html equilibriumLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import espresso from "svelte-highlight/styles/espresso";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html espresso}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import eva from "svelte-highlight/styles/eva";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html eva}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import evaDim from "svelte-highlight/styles/eva-dim";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html evaDim}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import far from "svelte-highlight/styles/far";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html far}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import felipec from "svelte-highlight/styles/felipec";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html felipec}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import flat from "svelte-highlight/styles/flat";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html flat}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import foundation from "svelte-highlight/styles/foundation";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html foundation}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import framer from "svelte-highlight/styles/framer";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html framer}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import fruitSoda from "svelte-highlight/styles/fruit-soda";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html fruitSoda}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import gigavolt from "svelte-highlight/styles/gigavolt";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html gigavolt}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import github from "svelte-highlight/styles/github";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html github}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import githubDark from "svelte-highlight/styles/github-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html githubDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import githubDarkDimmed from "svelte-highlight/styles/github-dark-dimmed";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html githubDarkDimmed}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import gml from "svelte-highlight/styles/gml";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html gml}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import googleDark from "svelte-highlight/styles/google-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html googleDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import googleLight from "svelte-highlight/styles/google-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html googleLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import googlecode from "svelte-highlight/styles/googlecode";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html googlecode}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import gradientDark from "svelte-highlight/styles/gradient-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html gradientDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import gradientLight from "svelte-highlight/styles/gradient-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html gradientLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import grayscale from "svelte-highlight/styles/grayscale";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html grayscale}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import grayscaleDark from "svelte-highlight/styles/grayscale-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html grayscaleDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import grayscaleLight from "svelte-highlight/styles/grayscale-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html grayscaleLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import greenScreen from "svelte-highlight/styles/green-screen";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html greenScreen}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import gruvboxDarkHard from "svelte-highlight/styles/gruvbox-dark-hard";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html gruvboxDarkHard}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import gruvboxDarkMedium from "svelte-highlight/styles/gruvbox-dark-medium";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html gruvboxDarkMedium}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import gruvboxDarkPale from "svelte-highlight/styles/gruvbox-dark-pale";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html gruvboxDarkPale}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import gruvboxDarkSoft from "svelte-highlight/styles/gruvbox-dark-soft";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html gruvboxDarkSoft}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import gruvboxLightHard from "svelte-highlight/styles/gruvbox-light-hard";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html gruvboxLightHard}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import gruvboxLightMedium from "svelte-highlight/styles/gruvbox-light-medium";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html gruvboxLightMedium}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import gruvboxLightSoft from "svelte-highlight/styles/gruvbox-light-soft";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html gruvboxLightSoft}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import hardcore from "svelte-highlight/styles/hardcore";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html hardcore}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import harmonic16Dark from "svelte-highlight/styles/harmonic16-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html harmonic16Dark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import harmonic16Light from "svelte-highlight/styles/harmonic16-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html harmonic16Light}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import heetchDark from "svelte-highlight/styles/heetch-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html heetchDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import heetchLight from "svelte-highlight/styles/heetch-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html heetchLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import helios from "svelte-highlight/styles/helios";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html helios}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import hopscotch from "svelte-highlight/styles/hopscotch";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html hopscotch}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import horizonDark from "svelte-highlight/styles/horizon-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html horizonDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import horizonLight from "svelte-highlight/styles/horizon-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html horizonLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import humanoidDark from "svelte-highlight/styles/humanoid-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html humanoidDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import humanoidLight from "svelte-highlight/styles/humanoid-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html humanoidLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import hybrid from "svelte-highlight/styles/hybrid";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html hybrid}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import iaDark from "svelte-highlight/styles/ia-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html iaDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import iaLight from "svelte-highlight/styles/ia-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html iaLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import icyDark from "svelte-highlight/styles/icy-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html icyDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import idea from "svelte-highlight/styles/idea";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html idea}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import intellijLight from "svelte-highlight/styles/intellij-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html intellijLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import irBlack from "svelte-highlight/styles/ir-black";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html irBlack}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import isblEditorDark from "svelte-highlight/styles/isbl-editor-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html isblEditorDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import isblEditorLight from "svelte-highlight/styles/isbl-editor-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html isblEditorLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import isotope from "svelte-highlight/styles/isotope";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html isotope}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import kimber from "svelte-highlight/styles/kimber";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html kimber}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import kimbieDark from "svelte-highlight/styles/kimbie-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html kimbieDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import kimbieLight from "svelte-highlight/styles/kimbie-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html kimbieLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import lightfair from "svelte-highlight/styles/lightfair";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html lightfair}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import lioshi from "svelte-highlight/styles/lioshi";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html lioshi}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import londonTube from "svelte-highlight/styles/london-tube";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html londonTube}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import macintosh from "svelte-highlight/styles/macintosh";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html macintosh}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import magula from "svelte-highlight/styles/magula";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html magula}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import marrakesh from "svelte-highlight/styles/marrakesh";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html marrakesh}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import materia from "svelte-highlight/styles/materia";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html materia}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import material from "svelte-highlight/styles/material";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html material}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import materialDarker from "svelte-highlight/styles/material-darker";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html materialDarker}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import materialLighter from "svelte-highlight/styles/material-lighter";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html materialLighter}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import materialPalenight from "svelte-highlight/styles/material-palenight";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html materialPalenight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import materialVivid from "svelte-highlight/styles/material-vivid";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html materialVivid}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import mellowPurple from "svelte-highlight/styles/mellow-purple";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html mellowPurple}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import mexicoLight from "svelte-highlight/styles/mexico-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html mexicoLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import mocha from "svelte-highlight/styles/mocha";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html mocha}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import monoBlue from "svelte-highlight/styles/mono-blue";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html monoBlue}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import monokai from "svelte-highlight/styles/monokai";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html monokai}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import monokaiSublime from "svelte-highlight/styles/monokai-sublime";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html monokaiSublime}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import nebula from "svelte-highlight/styles/nebula";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html nebula}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import nightOwl from "svelte-highlight/styles/night-owl";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html nightOwl}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import nnfxDark from "svelte-highlight/styles/nnfx-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html nnfxDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import nnfxLight from "svelte-highlight/styles/nnfx-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html nnfxLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import nord from "svelte-highlight/styles/nord";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html nord}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import nova from "svelte-highlight/styles/nova";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html nova}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import obsidian from "svelte-highlight/styles/obsidian";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html obsidian}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import ocean from "svelte-highlight/styles/ocean";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html ocean}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import oceanicnext from "svelte-highlight/styles/oceanicnext";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html oceanicnext}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import oneLight from "svelte-highlight/styles/one-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html oneLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import onedark from "svelte-highlight/styles/onedark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html onedark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import outrunDark from "svelte-highlight/styles/outrun-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html outrunDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import pandaSyntaxDark from "svelte-highlight/styles/panda-syntax-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html pandaSyntaxDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import pandaSyntaxLight from "svelte-highlight/styles/panda-syntax-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html pandaSyntaxLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import papercolorDark from "svelte-highlight/styles/papercolor-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html papercolorDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import papercolorLight from "svelte-highlight/styles/papercolor-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html papercolorLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import paraiso from "svelte-highlight/styles/paraiso";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html paraiso}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import paraisoDark from "svelte-highlight/styles/paraiso-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html paraisoDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import paraisoLight from "svelte-highlight/styles/paraiso-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html paraisoLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import pasque from "svelte-highlight/styles/pasque";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html pasque}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import phd from "svelte-highlight/styles/phd";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html phd}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import pico from "svelte-highlight/styles/pico";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html pico}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import pojoaque from "svelte-highlight/styles/pojoaque";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html pojoaque}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import pop from "svelte-highlight/styles/pop";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html pop}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import porple from "svelte-highlight/styles/porple";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html porple}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import purebasic from "svelte-highlight/styles/purebasic";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html purebasic}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import qtcreatorDark from "svelte-highlight/styles/qtcreator-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html qtcreatorDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import qtcreatorLight from "svelte-highlight/styles/qtcreator-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html qtcreatorLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import qualia from "svelte-highlight/styles/qualia";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html qualia}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import railscasts from "svelte-highlight/styles/railscasts";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html railscasts}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import rainbow from "svelte-highlight/styles/rainbow";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html rainbow}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import rebecca from "svelte-highlight/styles/rebecca";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html rebecca}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import rosPine from "svelte-highlight/styles/ros-pine";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html rosPine}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import rosPineDawn from "svelte-highlight/styles/ros-pine-dawn";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html rosPineDawn}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import rosPineMoon from "svelte-highlight/styles/ros-pine-moon";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html rosPineMoon}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import routeros from "svelte-highlight/styles/routeros";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html routeros}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import sagelight from "svelte-highlight/styles/sagelight";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html sagelight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import sandcastle from "svelte-highlight/styles/sandcastle";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html sandcastle}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import schoolBook from "svelte-highlight/styles/school-book";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html schoolBook}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import setiUi from "svelte-highlight/styles/seti-ui";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html setiUi}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import shadesOfPurple from "svelte-highlight/styles/shades-of-purple";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html shadesOfPurple}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import shapeshifter from "svelte-highlight/styles/shapeshifter";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html shapeshifter}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import silkDark from "svelte-highlight/styles/silk-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html silkDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import silkLight from "svelte-highlight/styles/silk-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html silkLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import snazzy from "svelte-highlight/styles/snazzy";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html snazzy}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import solarFlare from "svelte-highlight/styles/solar-flare";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html solarFlare}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import solarFlareLight from "svelte-highlight/styles/solar-flare-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html solarFlareLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import solarizedDark from "svelte-highlight/styles/solarized-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html solarizedDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import solarizedLight from "svelte-highlight/styles/solarized-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html solarizedLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import spacemacs from "svelte-highlight/styles/spacemacs";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html spacemacs}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import srcery from "svelte-highlight/styles/srcery";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html srcery}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import stackoverflowDark from "svelte-highlight/styles/stackoverflow-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html stackoverflowDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import stackoverflowLight from "svelte-highlight/styles/stackoverflow-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html stackoverflowLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import summercamp from "svelte-highlight/styles/summercamp";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html summercamp}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import summerfruitDark from "svelte-highlight/styles/summerfruit-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html summerfruitDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import summerfruitLight from "svelte-highlight/styles/summerfruit-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html summerfruitLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import sunburst from "svelte-highlight/styles/sunburst";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html sunburst}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import synthMidnightTerminalDark from "svelte-highlight/styles/synth-midnight-terminal-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html synthMidnightTerminalDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import synthMidnightTerminalLight from "svelte-highlight/styles/synth-midnight-terminal-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html synthMidnightTerminalLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import tango from "svelte-highlight/styles/tango";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html tango}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import tender from "svelte-highlight/styles/tender";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html tender}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import tokyoNightDark from "svelte-highlight/styles/tokyo-night-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html tokyoNightDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import tokyoNightLight from "svelte-highlight/styles/tokyo-night-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html tokyoNightLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import tomorrow from "svelte-highlight/styles/tomorrow";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html tomorrow}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import tomorrowNight from "svelte-highlight/styles/tomorrow-night";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html tomorrowNight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import tomorrowNightBlue from "svelte-highlight/styles/tomorrow-night-blue";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html tomorrowNightBlue}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import tomorrowNightBright from "svelte-highlight/styles/tomorrow-night-bright";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html tomorrowNightBright}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import twilight from "svelte-highlight/styles/twilight";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html twilight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import unikittyDark from "svelte-highlight/styles/unikitty-dark";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html unikittyDark}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import unikittyLight from "svelte-highlight/styles/unikitty-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html unikittyLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import vs from "svelte-highlight/styles/vs";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html vs}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import vs2015 from "svelte-highlight/styles/vs2015";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html vs2015}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import vulcan from "svelte-highlight/styles/vulcan";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html vulcan}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import windows10 from "svelte-highlight/styles/windows-10";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html windows10}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import windows10Light from "svelte-highlight/styles/windows-10-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html windows10Light}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import windows95 from "svelte-highlight/styles/windows-95";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html windows95}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import windows95Light from "svelte-highlight/styles/windows-95-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html windows95Light}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import windowsHighContrast from "svelte-highlight/styles/windows-high-contrast";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html windowsHighContrast}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import windowsHighContrastLight from "svelte-highlight/styles/windows-high-contrast-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html windowsHighContrastLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import windowsNt from "svelte-highlight/styles/windows-nt";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html windowsNt}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import windowsNtLight from "svelte-highlight/styles/windows-nt-light";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html windowsNtLight}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import woodland from "svelte-highlight/styles/woodland";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html woodland}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import xcode from "svelte-highlight/styles/xcode";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html xcode}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import xcodeDusk from "svelte-highlight/styles/xcode-dusk";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html xcodeDusk}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import xt256 from "svelte-highlight/styles/xt256";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html xt256}
</svelte:head>

<Highlight language={typescript} {code} />
Style name
Module name
<script>
  import Highlight from "svelte-highlight";
  import typescript from "svelte-highlight/languages/typescript";
  import zenburn from "svelte-highlight/styles/zenburn";

  const code = "const add = (a: number, b: number) => a + b;";
</script>

<svelte:head>
  {@html zenburn}
</svelte:head>

<Highlight language={typescript} {code} />