syntax-highlighting

<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>Dune Colorscheme - Syntax highlighting</title> <link href="../../assets/css/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> <link href="../../assets/css/app.css" media="screen, projection" rel="stylesheet" type="text/css" /> <link href="../../assets/css/dune.css" media="screen, projection" rel="stylesheet" type="text/css" /> <meta name="viewport" content="width=device-width"> <meta name="author" content="Bram de Haan"> <meta name="robots" content="index, follow"> <meta name="description" content="Colection of colorschemes for Code Syntax highlighting"/> <link rel="author" href="https://plus.google.com/111567145811003203990/posts"> </head> <body> <header id="header" class="row header"> <div class="large-4 columns"> <h1 class="repo-title"><a href="http://atelierbram.github.io/syntax-highlighting/">Syntax Highlighting colorschemes</a></h1> </div> <nav class="large-8 columns"> <ul class="inline-list right"> <li><a href="../../chrome-devtools/">Chrome Devtools</a></li> <li><a href="../../lab">Lab</a></li> <li><a href="../../prism/">Prism</a></li> <li><a href="../../atelier-schemes/" data-dropdown="drop-atelierschemes" class="button dropdown dropdown-atelier">Atelier Schemes</a> <ul id="drop-atelierschemes" class="f-dropdown small" data-dropdown-content> <li><a href="../">index - overview</a></li> <li><a href="../forest">Forest</a></li> <li><a href="../plateau">Plateau</a></li> <li><a href="../heath">Heath</a></li> <li><a href="../cave">Cave</a></li> <li><a href="../sulphurpool">Sulphurpool</a></li> <li><a href="../lakeside">Lakeside</a></li> <li><a href="../savanna">Savanna</a></li> <li><a href="../seaside">Seaside</a></li> <li><a href="../estuary">Estuary</a></li> <li><a href="#" class="is-selected">Dune</a></li> <li><a href="../output">Output</a></li> </ul> </li> </ul> </nav> </header> <div class="row outer-wrap"> <article class="article article--demo"> <div id="wrap" class="inner-wrap" > <h2>Atelier colorscheme</h2> <h3 id="about-dune">Dune</h3> Base color for Dune is yellow, and then warm yellowish brown greyed colors for the background. A welcoming, soothing friendly but also bright, colorscheme. <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1200 1200"> <style type="text/css"> <![CDATA[ .base00-dune-bg {fill:#20201d} .base01-dune-bg {fill:#292824} .base02-dune-bg {fill:#6e6b5e} .base03-dune-bg {fill:#7d7a68} .base04-dune-bg {fill:#999580} .base05-dune-bg {fill:#a6a28c} .base06-dune-bg {fill:#e8e4cf} .base07-dune-bg {fill:#fefbec} .base08-dune-bg, .red-dune-bg {fill:#d73737} .base09-dune-bg, .orange-dune-bg {fill:#b65611} .base0A-dune-bg, .yellow-dune-bg {fill:#ae9513} .base0B-dune-bg, .green-dune-bg {fill:#60ac39} .base0C-dune-bg, .cyan-dune-bg {fill:#1fad83} .base0D-dune-bg, .blue-dune-bg {fill:#6684e1} .base0E-dune-bg, .violet-dune-bg {fill:#b854d4} .base0F-dune-bg, .magenta-dune-bg {fill:#d43552} text{font-size:2em}]]></style> <g> <rect x="0" y="0" width="300" height="300" class="base00-dune-bg" /> <rect x="300" y="0" width="300" height="300" class="base01-dune-bg" /> <rect x="600" y="0" width="300" height="300" class="base02-dune-bg" /> <rect x="900" y="0" width="300" height="300" class="base03-dune-bg" /> <rect x="0" y="300" width="300" height="300" class="base04-dune-bg" /> <rect x="300" y="300" width="300" height="300" class="base05-dune-bg" /> <rect x="600" y="300" width="300" height="300" class="base06-dune-bg" /> <rect x="900" y="300" width="300" height="300" class="base07-dune-bg" /> <rect x="0" y="600" width="300" height="300" class="yellow-dune-bg" /> <rect x="300" y="600" width="300" height="300" class="orange-dune-bg" /> <rect x="600" y="600" width="300" height="300" class="red-dune-bg" /> <rect x="900" y="600" width="300" height="300" class="magenta-dune-bg" /> <rect x="0" y="900" width="300" height="300" class="violet-dune-bg" /> <rect x="300" y="900" width="300" height="300" class="blue-dune-bg" /> <rect x="600" y="900" width="300" height="300" class="cyan-dune-bg" /> <rect x="900" y="900" width="300" height="300" class="green-dune-bg" /> </g> <g> <text x="0" y="158" class="base07-dune-bg"> <tspan dx="100" dy="0">base00</tspan> <tspan dx="190" dy="0">base01</tspan> <tspan dx="200" dy="0">base02</tspan> <tspan dx="195" dy="0">base03</tspan> </text> <text x="0" y="465" class="base00-dune-bg"> <tspan dx="100" dy="0">base04</tspan> <tspan dx="190" dy="0">base05</tspan> <tspan dx="200" dy="0">base06</tspan> <tspan dx="195" dy="0">base07</tspan> </text> <text x="0" y="760" class="base00-dune-bg"> <tspan dx="100" dy="0">yellow</tspan> <tspan dx="210" dy="0">orange</tspan> <tspan dx="220" dy="0" class="base07-dune-bg">red</tspan> <tspan dx="210" dy="0" class="base07-dune-bg">magenta</tspan> </text> <text x="0" y="1060" class="base00-dune-bg"> <tspan dx="100" dy="0">violet</tspan> <tspan dx="230" dy="0">blue</tspan> <tspan dx="235" dy="0">cyan</tspan> <tspan dx="225" dy="0">green</tspan> </text> </g> </svg> <h3 id="color-code" class="mtm no-border">Colors in code Scss variables</h3> <pre class="base00-background language-scss"><code class="language-scss sh-c-light"> $base00: hsl(50, 5%, 12%); /* #20201d */ $base01: hsl(50, 6%, 15%); /* #292824 */ $base02: hsl(50, 8%, 40%); /* #6e6b5e */ $base03: hsl(50, 9%, 45%); /* #7d7a68 */ $base04: hsl(50, 11%, 55%); /* #999580 */ $base05: hsl(50, 13%, 60%); /* #a6a28c */ $base06: hsl(50, 35%, 86%); /* #e8e4cf */ $base07: hsl(50, 87%, 96%); /* #fefbec */ $base08: hsl(0, 67%, 53%); /* #d73737 */ $base09: hsl(25, 83%, 39%); /* #b65611 */ $base0a: hsl(50, 80%, 38%); /* #ae9513 */ $base0b: hsl(100, 50%, 45%); /* #60ac39 */ $base0c: hsl(162, 70%, 40%); /* #1fad83 */ $base0d: hsl(225, 67%, 64%); /* #6684e1 */ $base0e: hsl(287, 60%, 58%); /* #b854d4 */ $base0f: hsl(349, 65%, 52%); /* #d43552 */ $red: $base08; $orange: $base09; $yellow: $base0a; $green: $base0b; $cyan: $base0c; $blue: $base0d; $violet: $base0e; $magenta: $base0f; </code></pre> <pre class="base00-background base05"> require "gem" string = "base16" symbol = :base16 fixnum = 0 float = 0.00 array = Array.new array = ['chris', 85] hash = {"test" => "test"} regexp = /[abc]/ # This is a comment class Person attr_accessor :name def initialize(attributes = {}) @name = attributes[:name] end def self.greet "hello" end end person1 = Person.new(:name => "Chris") print Person::greet, " ", person1.name, "\n" puts "another #{Person::greet} #{person1.name}" </pre> <pre class="base07-background base02"> require "rubygems" string = "tomorrow" symbol = :tomorrow fixnum = 0 float = 0.00 array = Array.new array = ['chris', 85] hash = {"test" => "test"} regexp = /[abc]/ # This is a comment class Person attr_accessor :name def initialize(attributes = {}) @name = attributes[:name] end def self.greet "hello" end end person1 = Person.new(:name => "Chris") print Person::greet, " ", person1.name, "\n" puts "another #{Person::greet} #{person1.name}" </pre> <h3 id="downloads" class="mtm">Downloads</h3> All downloads can be found in the <a href="https://github.com/atelierbram/syntax-highlighting/tree/master/atelier-schemes/output">output</a> folder. Note: For Sublime Text, go to <a href="https://github.com/atelierbram/syntax-highlighting/tree/master/atelier-schemes/output/textmate">Textmate folder</a>, or <a href="https://atelierbram.github.io/syntax-highlighting/atelier-schemes/output/textmate/textmate.zip">download the zip-file directly</a>.For <a href="https://github.com/tpope/vim-pathogen">Vim with Pathogen</a> you can clone <a href="https://github.com/atelierbram/vim-colors_atelier-schemes">the dedicated repo for this purpose</a> in the <code>~/.vim/bundle</code> directory like so: <pre class="language-bash" style="background:#ebf8ff;color:#516d7b;padding:1em;border:1px solid #d6eefb"><code class="language-bash" style="background:#ebf8ff;color:#516d7b"> cd ~/.vim/bundle git clone https://github.com/atelierbram/vim-colors_atelier-schemes.git </code></pre> <h3 id="credits" class="mtm">Credits</h3> <ul class="inline-block-list"> <li>Credits to <a href="http://ethanschoonover.com/solarized">Ethan Schoonover</a> whose <a href="http://github.com/altercation/solarized">Solarized colorscheme</a> was a model for these colorschemes</li> <li>And credits to <a href="http://chriskempson.com/">Chris Kempson</a>, whose <a href="https://github.com/chriskempson/base16-builder">Base16 Builder</a> was used for conversion to the different output formats.</li> </ul> <a href="#header" class="go-to-top sh-button"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="50px" height="50px" viewBox="0 0 50 50" enable-background="new 0 0 50 50" xml:space="preserve"> <g id="outline-black"> <path opacity="0.5" d="M25,3L3,34l12-1v13h20V33l12,1L25,3z"/> </g> <g id="inner-white"> <polygon fill="#FFFFFF" points="42,31 25,7 8,31 18,30 18,44 32,44 32,30 "/> </g> </svg>⬆ Go to Top</a> </div> </article> <footer class="page-footer"> <div class="large-12 columns"> <div class="row"> <div class="large-8 columns"> © 2013 <a href="http://atelierbramdehaan.nl" class="underline">Atelier Bram de Haan</a>, Releases under <a href="http://atelierbram.mit-license.org" class="underline">MIT License</a> </div> <div class="large-4 columns"> <a href="https://github.com/atelierbram/syntax-highlighting" class="sh-button">This repo on Github</a> </div> </div> </div> </footer> </div> <script> document.write('<script src=' + ('__proto__' in {} ? '../../assets/js/vendor/zepto.min' : '../../assets/js/vendor/jquery') + '.js><\/script>') </script> <script src="../../assets/js/foundation/foundation.min.js"></script> <script src="../../assets/js/foundation/foundation.dropdown.min.js"></script> <script> $(document).foundation(); </script> <script src="../../assets/js/vendor/custom.modernizr.js"></script> <script>function insertTopborder() { $('<div class="rainbow-border"></div>').insertBefore('#wrap'); } insertTopborder();</script></body> </html>