Skip to content

Instantly share code, notes, and snippets.

@jhacksworth
Last active January 31, 2018 21:56
Show Gist options
  • Save jhacksworth/e7efbe1a5cfe53abfe7619a3cdbf0f07 to your computer and use it in GitHub Desktop.
Save jhacksworth/e7efbe1a5cfe53abfe7619a3cdbf0f07 to your computer and use it in GitHub Desktop.

Revisions

  1. jhacksworth revised this gist Jan 31, 2018. No changes.
  2. jhacksworth created this gist Jan 31, 2018.
    107 changes: 107 additions & 0 deletions atom-one-dark-to-emacs.css
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,107 @@
    /**************************************************************************************************************
    MAPPING
    - First CSS class name is the name of the Emacs atom-one-dark theme color
    variable
    - Second CSS class name is either:
    - the name of the Atom One Dark source variable OR
    - a comment about how the value is obtained
    .<emacs>,
    .<atom> {
    color: value
    }
    **************************************************************************************************************/
    .atom-one-dark-accent,
    .syntax-accent {
    color: #528bff;
    }
    .atom-one-dark-fg,
    .syntax-fg {
    color: #abb2bf;
    }
    .atom-one-dark-bg,
    .syntax-bg {
    color: #282c34;
    }
    /* Unknown origin */
    .atom-one-dark-bg-1,
    .unknown {
    color: #121417;
    }
    /* @syntax-cursor-line is defined with .04, i.e. 4%, opacity: hsla(@syntax-hue, 100%, 80%, .04) */
    /* Simulate opacity blending using the `mix` function from LESS */
    /* Current value of atom-one-dark-bg-hl doesn't match: #2F343D */
    .atom-one-dark-bg-hl,
    .simulate-opacity-blend {
    color: #2c323c;
    }
    /* atom-one-dark-gutter takes opacity into account for line-number */
    /* For .line-number, @syntax-gutter-text-color will be blended with the background color */
    /* We can simulate opacity blending using the `mix` function from LESS */
    /* .line-number is defined with 0.6, i.e. 60%, opacity */
    .atom-one-dark-gutter,
    .simulate-opacity-blend {
    color: #4b5363;
    }
    .atom-one-dark-mono-1,
    .mono-1 {
    color: #abb2bf;
    }
    .atom-one-dark-mono-2,
    .mono-2 {
    color: #828997;
    }
    .atom-one-dark-mono-3,
    .mono-3 {
    color: #5c6370;
    }
    .atom-one-dark-cyan,
    .hue-1 {
    color: #56b6c2;
    }
    .atom-one-dark-blue,
    .hue-2 {
    color: #61afef;
    }
    .atom-one-dark-purple,
    .hue-3 {
    color: #c678dd;
    }
    .atom-one-dark-green,
    .hue-4 {
    color: #98c379;
    }
    .atom-one-dark-red-1,
    .hue-5 {
    color: #e06c75;
    }
    .atom-one-dark-red-2,
    .hue-5-2 {
    color: #be5046;
    }
    .atom-one-dark-orange-1,
    .hue-6 {
    color: #d19a66;
    }
    .atom-one-dark-orange-2,
    .hue-6-2 {
    color: #e5c07b;
    }
    .atom-one-dark-gray,
    .syntax-selection-color {
    color: #3e4451;
    }
    .atom-one-dark-silver,
    .ui-fg {
    color: #9da5b4;
    }
    .atom-one-dark-black,
    .ui-level-3-color {
    color: #21252b;
    }
    .atom-one-dark-border,
    .ui-border {
    color: #181a1f;
    }