Skip to content

Instantly share code, notes, and snippets.

@ghuger

ghuger/SassMeister-input-HTML.html

Last active October 29, 2015 19:19
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save ghuger/4c35e038d767e319339f to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save ghuger/4c35e038d767e319339f to your computer and use it in GitHub Desktop.
Download ZIP
Generated by SassMeister.com.
Raw
SassMeister-input-HTML.html
<div id="x"><span id="y">Y</span>Hi</div>
<div id="a"><span id="b">Y</span>Hi</div>
Raw
SassMeister-input.scss
// ----
// libsass (v3.2.5)
// ----
$start: #d1404a;
$dark: desaturate(darken($start, 23), 20);
$TITLE_LIGHT: $start;
$TITLE_DARK: $dark;
$BEFORE_LIGHT: darken($start, 5);
$BEFORE_DARK: mix($dark, mix($start, black, 10));
#b, #y {
display: inline-block;
width: 100px;
height: 100px;
}
#x { background-color: $TITLE_LIGHT; }
#y { background-color: darken($start, 5); }
$dark: desaturate(darken($start, 23), 20);
#a { background-color: $dark; }
#b { background-color: mix($dark, mix($start, black, 10)); }
Raw
SassMeister-output.css
#b, #y {
display: inline-block;
width: 100px;
height: 100px;
}
#x {
background-color: #d1404a;
}
#y {
background-color: #c7303a;
}
#a {
background-color: #6e2e32;
}
#b {
background-color: #411a1d;
}
Raw
SassMeister-rendered.html
<div id="x"><span id="y">Y</span>Hi</div>
<div id="a"><span id="b">Y</span>Hi</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment