colorschemes

Prism colorschemes

Prism is a lightweight, robust, elegant syntax highlighting library. It is written in javascript, and the colorschemes are CSS stylesheets; so highly customisable.

HTML


<!-- main grid section -->
<div class="row">
 <div class="large-4 columns">
   <div class="panel">
     <h5>panel title</h5>
     <p>this is a three columns grid panel with an arbitrary height.</p>
   </div>
 </div>
 <div class="large-6 columns">
   <div class="panel">
     <h5>panel title</h5>
     <p>this is a six columns grid panel with an arbitrary height. bacon ipsum dolor sit amet salami ham hock biltong ball tip drumstick sirloin pancetta meatball short loin.</p>
   </div>
 </div>
 <div class="large-3  columns">
   <div class="panel">
                

CSS


/* comment */
@media only screen {
footer {
  overflow: hidden;
  text-align: center;
  text-transform: uppercase;
}
footer ul {
  list-style: none;
  padding-left: 0;
}
.cf:before,
.cf:after {
  content: "";
  display: table;
}
.cf:after { clear: both; }
                

Javascript


// comment
events : function () {
  var self = this;

  $(this.scope)
    .on('click.joyride', '.joyride-next-tip, .joyride-modal-bg', function (e) {
      e.preventDefault();

      if (this.settings.$li.next().length < 1) {
        this.end();
      } else if (this.settings.timer > 0) {
        clearTimeout(this.settings.automate);
        this.hide();
        this.show();
        this.startTimer();
      } else {
        this.hide();
                

SVG


<!-- http://www.w3.org/html/logo/downloads/HTML5_Badge.svg -->

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
  <title>HTML5 Logo Badge</title>
  <path fill="#E34F26" d="M71,460 L30,0 481,0 440,460 255,512"/>
  <path fill="#EF652A" d="M256,472 L405,431 440,37 256,37"/>
  <path fill="#EBEBEB" d="M256,208 L181,208 176,150 256,150 256,94 255,94 114,94 115,109 129,265 256,265zM256,355 L255,355 192,338 188,293 158,293 132,293 139,382 255,414 256,414z"/>
  <path fill="#FFF" d="M255,208 L255,265 325,265 318,338 255,355 255,414 371,382 372,372 385,223 387,208 371,208zM255,94 L255,129 255,150 255,150 392,150 392,150 392,150 393,138 396,109 397,94z"/>
</svg>

                

When clicking the style-switcher in the top right corner to quickly switch between colorschemes, you can get a feeling for how the different schemes look, and also explore how they behave in different language-code-syntax (, while clicking through the tabs in the different code examples …).

Prism comes with six colorschemes:

  1. Default Light
  2. Dark
  3. Funky
  4. Okaidia
  5. Twilight
  6. Tomorrow

One can download those directly from Github.

Customising

Except for the six that come with Prism, this repo contains more colorschemes, collected (stolen) from elsewhere and further adapted (tweaked).

When possible, backlinks to their origin, and information about their creators are included.

  1. Xonokai, original scheme by Maxime Thirouin, colorscheme on Github
  2. CB, original scheme by C. Bavota
  3. Pojoaque, original scheme by Jason Tate

Base16 Schemes

Colorschemes produced, and if not tributed to someone else, also made by Chris Kempson with base16 builder.

  1. Base16-3024, original scheme by Jan T. Sott
  2. Base16-Apathy, original scheme by Jannik Siebert
  3. Base16-Ashes, original scheme by Jannik Siebert
  4. Base16-Bespin, original scheme by Jan T. Sott
  5. Base16-Brewer, original scheme by Timothée Poisot
  6. Base16-Bright
  7. Base16-Chalk
  8. Base16-Colors, original scheme by Adam Morse
  9. Base16-Default
  10. Base16-Eighties
  11. Base16-Embers, original scheme by Jannik Siebert
  12. Base16-Flat
  13. Base16-Google, original scheme by Seth Wright
  14. Base16-Grayscale, original scheme by Alexandre Gavioli
  15. Base16-Greenscreen
  16. Base16-Harmonic16, original scheme by Jannik Siebert
  17. Base16-Hopscotch, original scheme by Jan T. Sott
  18. Base16-Isotope, original scheme by Jan T. Sott
  19. Base16-Marrakesh, original scheme by Alexandre Gavioli
  20. Base16-Mocha
  21. Base16-Monokai, original scheme by Wimer Hazenberg
  22. Base16-Ocean
  23. Base16-Paraiso, original scheme by Jan T. Sott
  24. Base16-Pop
  25. Base16-Railscasts, original scheme by Ryan Bates
  26. Base16-Shapeshifter, original scheme by Tyler Benziger
  27. Base16-Solarized-dark, original scheme by Ethan Schoonover
  28. Base16-Solarized-light, original scheme by Ethan Schoonover
  29. Base16-Summerfruit, original scheme by Christopher Corley
  30. Base16-Tomorrow
  31. Base16-London-Tube, original scheme by Jan T. Sott
  32. Base16-Twilight, original scheme by David Hart

Atelier Schemes

And then some more, made by me, Bram de Haan with base16 builder. You can find them in the prism folder, within the output folder of Atelier schemes.

  1. Forest Light
  2. Forest Dark
  3. Plateau Light
  4. Plateau Dark
  5. Heath Light
  6. Heath Dark
  7. Cave Light
  8. Cave Dark
  9. Sulphurpool Light
  10. Sulphurpool Dark
  11. Lakeside Light
  12. lakeside Dark
  13. Savanna Light
  14. Savanna Dark
  15. Seaside Light
  16. Seaside Dark
  17. Estuary Light
  18. Estuary Dark
  19. Dune Light
  20. Dune Dark

Lab

Go to Top