simurai / duotone-syntax Goto Github PK

View Code? Open in Web Editor NEW

117.0 3.0 30.0 597 KB

Master template for DuoTone syntax themes

License: MIT License

CSS 100.00%

duotone-syntax's Introduction

Note: This theme is deprecated. Take a look at tone-syntax that is somewhat similar.

DuoTone Syntax (master)

A double-hue syntax theme for Atom.

DuoTone themes use only 2 hues (8 shades in total). It tones down less important parts (like punctuation and brackets) and highlights only the important ones. This leads to a more calm color scheme, but still lets you find the stuff you're looking for.

Language support

DuoTone themes are optimized for many languages:

C, Clojure, CoffeeScript, C#, CSS, GF Markdown, Go, Haskell, HTML, Java, JavaScript, JSON, Less, Perl, PHP, Python, Ruby, SASS, SCSS, Stylus, XML, YAML...

See the list of all languages.

Variations

Here a list of all DuoTone themes. Or at least the ones that have the duotone keyword added. 😁

Create your own DuoTone theme

Follow the short guide how to create your own DuoTone version.

Clone this repo.
Rename it (folder, package.json, etc).
Change the colors in styles/colors.less.
Publish!

Optionally, also update the docs. It's a page with all colors and some sample code. It can be used as a GitHub Page, when the /docs folder is enabled in the repo settings.

Run docs/update.sh to update the theme colors.
Replace the xxx in docs/index.html with your own user and theme name.
Take a screenshot and replace (docs/screenshot.png) with your version.

For more help, feel free to open a new issue.

duotone-syntax's People

Contributors

Stargazers

Watchers

duotone-syntax's Issues

GF Markdown could use a little bump

GF Markdown sans (supported) language identifier seem a tad too dark at times?

JSX style is unreadable and too dark

Code in question

Different colors per language

Carried over from simurai/duotone-dark-sea-syntax#1

I had an idea: these themes are beautiful, and it would be great to be able to set a theme per language (customisable). Do you see this as something on your roadmap?

Could be neat. A problem is that the background color has to be the same so that it matches the tabs (in certain UI themes), but the syntax highlighting could be different for each language.

Maybe something like blue-ish background and then html = red, css = blue, js = yellow.

iTerm2 colors

<?xml version="1.0" encoding="UTF-8"?>
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
    <key>Ansi 0 Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.16862745583057404</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.12549020349979401</real>
        <key>Red Component</key>
        <real>0.13333334028720856</real>
    </dict>
    <key>Ansi 1 Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.5372549295425415</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.58039218187332153</real>
        <key>Red Component</key>
        <real>0.62745100259780884</real>
    </dict>
    <key>Ansi 10 Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.35294118523597717</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.38431373238563538</real>
        <key>Red Component</key>
        <real>0.4117647111415863</real>
    </dict>
    <key>Ansi 11 Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.22352941334247589</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.59607845544815063</real>
        <key>Red Component</key>
        <real>1</real>
    </dict>
    <key>Ansi 12 Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>1</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.64313727617263794</real>
        <key>Red Component</key>
        <real>0.71764707565307617</real>
    </dict>
    <key>Ansi 13 Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>1</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.45490196347236633</real>
        <key>Red Component</key>
        <real>0.56862747669219971</real>
    </dict>
    <key>Ansi 14 Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.44313725829124451</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.32156863808631897</real>
        <key>Red Component</key>
        <real>0.3490196168422699</real>
    </dict>
    <key>Ansi 15 Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>1</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.89803922176361084</real>
        <key>Red Component</key>
        <real>0.91764706373214722</real>
    </dict>
    <key>Ansi 2 Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.35294118523597717</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.38431373238563538</real>
        <key>Red Component</key>
        <real>0.4117647111415863</real>
    </dict>
    <key>Ansi 3 Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.22352941334247589</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.59607845544815063</real>
        <key>Red Component</key>
        <real>1</real>
    </dict>
    <key>Ansi 4 Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>1</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.63921570777893066</real>
        <key>Red Component</key>
        <real>0.71764707565307617</real>
    </dict>
    <key>Ansi 5 Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>1</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.45490196347236633</real>
        <key>Red Component</key>
        <real>0.56862747669219971</real>
    </dict>
    <key>Ansi 6 Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.44313725829124451</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.32156863808631897</real>
        <key>Red Component</key>
        <real>0.3490196168422699</real>
    </dict>
    <key>Ansi 7 Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>1</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.89803922176361084</real>
        <key>Red Component</key>
        <real>0.91764706373214722</real>
    </dict>
    <key>Ansi 8 Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.16862745583057404</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.12549020349979401</real>
        <key>Red Component</key>
        <real>0.13333334028720856</real>
    </dict>
    <key>Ansi 9 Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.5372549295425415</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.58431375026702881</real>
        <key>Red Component</key>
        <real>0.62745100259780884</real>
    </dict>
    <key>Background Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.14117647707462311</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.10980392247438431</real>
        <key>Red Component</key>
        <real>0.086274512112140656</real>
    </dict>
    <key>Badge Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.51372551918029785</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.40392157435417175</real>
        <key>Red Component</key>
        <real>0.42352941632270813</real>
    </dict>
    <key>Bold Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.25098040699958801</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.55294120311737061</real>
        <key>Red Component</key>
        <real>0.87058824300765991</real>
    </dict>
    <key>Cursor Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.32156863808631897</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.65882354974746704</real>
        <key>Red Component</key>
        <real>1</real>
    </dict>
    <key>Cursor Guide Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.18823529779911041</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.16862745583057404</real>
        <key>Red Component</key>
        <real>0.14901961386203766</real>
    </dict>
    <key>Cursor Text Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.19370138645172119</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.15575926005840302</real>
        <key>Red Component</key>
        <real>0.0</real>
    </dict>
    <key>Foreground Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.51764708757400513</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.7607843279838562</real>
        <key>Red Component</key>
        <real>1</real>
    </dict>
    <key>Link Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.32549020648002625</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.62352943420410156</real>
        <key>Red Component</key>
        <real>0.90196079015731812</real>
    </dict>
    <key>Selected Text Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.43137255311012268</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.45882353186607361</real>
        <key>Red Component</key>
        <real>0.48627451062202454</real>
    </dict>
    <key>Selection Color</key>
    <dict>
        <key>Alpha Component</key>
        <real>1</real>
        <key>Blue Component</key>
        <real>0.26666668057441711</real>
        <key>Color Space</key>
        <string>Calibrated</string>
        <key>Green Component</key>
        <real>0.20392157137393951</real>
        <key>Red Component</key>
        <real>0.15294118225574493</real>
    </dict>
</dict>
</plist>

Punctuation in JS is illegible

Notice how the brackets almost blend into the background perfectly. Here is the file in question.

Subduing comment tag tones?

Hi there. I really love this. Is there a way to subdue comment tags? They are presently showing with the same luminescence as keywords. The comment rule subdues plain text in comments, but being able to subdue comment tags more than keywords would give much better separation between heavy documentation and implementation code. I've read through, but the means has escaped me. Is this a feature that has already been implemented or am I missing something? I probably am as my CSS skills are close to none. Danke!

A way to not tone down punctuation and brackets using stylesheet?

Is there a way to override something styles.less to not tone down punctuation and brackets and less important things? Would like to use for coding so punctuation is still pretty important. Thanks!

Duotone is not viable for Javascript and many others

I love duotone but the problem is it is not viable for programming languages other than html/css

problem 1 :

the color priority of attributes are same as comment , it make them very hard to see.

problem 2 :
same goes for bracket and braces , since many langauges brackets and braces need high priority except python.

Italicize comments

Hi there! Love the work you've done on Duotone -- it looks awesome! I was just wondering what your thoughts are on italicizing code comments. (I personally prefer my syntax highlighting scheme to italicize code comments.) Thanks again :)

Meta scope shouldn't share same base colour as comments

I don't know how much this affects better-known languages, but I've noticed the meta scope is used by DuoTone to apply text colour (assuming when nothing more specific matches):

Generally, this isn't a very good idea, as the meta scope is typically used for identifying larger regions of a document (often for programmatic purposes, such as triggering a certain snippet or what-have-you). This should probably just inherit the default colour used for ordinary text.

[Question] Language support

Question: What languages should the DuoTone themes support? Here a couple options:

Only the ones that get bundled with Atom.
No limits... the more the merrier!
Bundles. Create different themes with different language support.. like a front-end optimized theme with HTML, JS, CSS etc. but not Java, C etc.

Javascript Support

Hi,

I love this theme, but i think the JS language support is a bit lacking. For objects the colors are all the same.

We could do something similar to SCSS with different color for the keys, and maybe differentiate between bool, integer and string

What do you guys think?

Sublime Text Support

These look beautiful. Any chance they'll be released for Sublime Text? Or do they work out of the box (I vaguely remember hearing that syntax themes are cross-compatible somewhere...) Thanks!

Can we merge all duotone themes?

Just a question (not sure if this question is correctly placed in here).

Can we merge all themes by @simurai into one package with a settings page?

If it's wanted and done, sometimes later we can simplify this theme package to something like a duotone generator. Define two colors, auto generate shades, apply the new theme. And we can help offering great duotone color combinations. Duotone should be the de facto syntax theme standard.

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web

Some thing interesting about web. New door for the world.
server

A server is a program made to process requests and deliver data to clients.
Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.