Skip to content

Instantly share code, notes, and snippets.

@PauloFrancaLacerda
Last active March 12, 2016 12:26
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save PauloFrancaLacerda/5389f3dfdd8a096f7d63 to your computer and use it in GitHub Desktop.
Save PauloFrancaLacerda/5389f3dfdd8a096f7d63 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// Sass (v4.0.0.alpha.1)
// Compass (vundefined)
// ----
$theme-base-color: #c76bbf;
$theme-base-color-name: "Pink";
$c: $theme-base-color;
$c-l5: lighten($c,37.6%);
$c-l4: lighten($c,32%);
$c-l3: lighten($c,24%);
$c-l2: lighten($c,16%);
$c-l1: lighten($c, 8%);
$c-d1: darken($c, 5.5%);
$c-d2: darken($c,10.0%);
$c-d3: darken($c,15.0%);
$c-d4: darken($c,16.0%);
$c-d5: darken($c,17.0%);
$c-d6: darken($c,18.0%);
$c-d7: darken($c,22.0%);
$c-d8: darken($c,24.0%);
$c-d9: darken($c,26.0%);
$c-d10:darken($c,28.0%);
$c-d11:darken($c,30.0%);
$c-d12:darken($c,32.0%);
$c-d13:darken($c,34.0%);
$c-d14:darken($c,36.0%);
$c-d15:darken($c,38.0%);
$c-d16:darken($c,40.0%);
$c-d17:darken($c,41.0%);
$c-d18:darken($c,42.0%);
$c-d19:darken($c,43.0%);
$c-d20:darken($c,44.0%);
$c-darker: $c-d20;
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Styles
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.w3-theme {color:white !important; background-color:$c !important}
.w3-text-theme {color:$c !important}
.w3-theme-l5 {color:white !important; background-color:$c-l5 !important}
.w3-theme-l4 {color:white !important; background-color:$c-l4 !important}
.w3-theme-l3 {color:white !important; background-color:$c-l3 !important}
.w3-theme-l2 {color:white !important; background-color:$c-l2 !important}
.w3-theme-l1 {color:white !important; background-color:$c-l1 !important}
.w3-theme-d1 {color:white !important; background-color:$c-d1 !important}
.w3-theme-d2 {color:white !important; background-color:$c-d2 !important}
.w3-theme-d3 {color:white !important; background-color:$c-d3 !important}
.w3-theme-d4 {color:white !important; background-color:$c-d4 !important}
.w3-theme-d5 {color:white !important; background-color:$c-d5 !important}
.w3-theme-d6 {color:white !important; background-color:$c-d6 !important}
.w3-theme-d7 {color:white !important; background-color:$c-d7 !important}
.w3-theme-d8 {color:white !important; background-color:$c-d8 !important}
.w3-theme-d9 {color:white !important; background-color:$c-d9 !important}
.w3-theme-d10{color:white !important; background-color:$c-d10!important}
.w3-theme-d11{color:white !important; background-color:$c-d11!important}
.w3-theme-d12{color:white !important; background-color:$c-d12!important}
.w3-theme-d13{color:white !important; background-color:$c-d13!important}
.w3-theme-d14{color:white !important; background-color:$c-d14!important}
.w3-theme-d15{color:white !important; background-color:$c-d15!important}
.w3-theme-d16{color:white !important; background-color:$c-d16!important}
.w3-theme-d17{color:white !important; background-color:$c-d17!important}
.w3-theme-d18{color:white !important; background-color:$c-d18!important}
.w3-theme-d19{color:white !important; background-color:$c-d19!important}
.w3-theme-d20{color:white !important; background-color:$c-d20!important}
.w3-theme-light {color:black !important; background-color:$c-l1 !important}
.w3-theme-dark {color:white !important; background-color:$c-d15!important}
.w3-theme-darker {color:white !important; background-color:$c-darker!important}
.w3-theme-action {color:white !important; background-color:$c-d5 !important}
.w3-theme-4btns {color:white !important; background-color:$c-d11!important}
.w3-hover-d1:hover {color: white !important; background-color: $c-d1 !important;}
.w3-hover-d2:hover {color: white !important; background-color: $c-d2 !important;}
.w3-hover-d3:hover {color: white !important; background-color: $c-d3 !important;}
.w3-hover-d4:hover {color: white !important; background-color: $c-d4 !important;}
.w3-hover-d5:hover {color: white !important; background-color: $c-d5 !important;}
.w3-hover-d6:hover {color: white !important; background-color: $c-d6 !important;}
.w3-hover-d7:hover {color: white !important; background-color: $c-d7 !important;}
.w3-hover-d8:hover {color: white !important; background-color: $c-d8 !important;}
.w3-hover-d9:hover {color: white !important; background-color: $c-d9 !important;}
.w3-hover-d10:hover {color: white !important; background-color: $c-d10!important;}
.w3-hover-d11:hover {color: white !important; background-color: $c-d11!important;}
.w3-hover-d12:hover {color: white !important; background-color: $c-d12!important;}
.w3-hover-d13:hover {color: white !important; background-color: $c-d13!important;}
.w3-hover-d14:hover {color: white !important; background-color: $c-d14!important;}
.w3-hover-d15:hover {color: white !important; background-color: $c-d15!important;}
.w3-hover-d16:hover {color: white !important; background-color: $c-d16!important;}
.w3-hover-d17:hover {color: white !important; background-color: $c-d17!important;}
.w3-hover-d18:hover {color: white !important; background-color: $c-d18!important;}
.w3-hover-d14:hover {color: white !important; background-color: $c-d19!important;}
.w3-hover-d20:hover {color: white !important; background-color: $c-d20!important;}
.w3-hover-darker:hover {color: white !important; background-color: $c-darker!important;}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Theme Palette
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
$p-l5: $c-l5 + " ";
$p-l4: $c-l4 + " ";
$p-l3: $c-l3 + " ";
$p-l2: $c-l2 + " ";
$p-l1: $c-l1 + " ";
$p: $c + " ";
$p-d1: $c-d1 + " ";
$p-d2: $c-d2 + " ";
$p-d3: $c-d3 + " ";
$p-d4: $c-d4 + " ";
$p-d5: $c-d5 + " ";
$p-d6: $c-d6 + " ";
$p-d7: $c-d7 + " ";
$p-d8: $c-d8 + " ";
$p-d9: $c-d9 + " ";
$p-d10:$c-d10 + " ";
$p-d11:$c-d11 + " ";
$p-d12:$c-d12 + " ";
$p-d13:$c-d13 + " ";
$p-d14:$c-d14 + " ";
$p-d15:$c-d15 + " ";
$p-d16:$c-d16 + " ";
$p-d17:$c-d17 + " ";
$p-d18:$c-d18 + " ";
$p-d19:$c-d19 + " ";
$p-d20:$c-d20 + " ";
.theme-name:before {content:$theme-base-color-name + ' '}
.w3-theme-pal-l5:before {content:$p-l5}
.w3-theme-pal-l4:before {content:$p-l4}
.w3-theme-pal-l3:before {content:$p-l3}
.w3-theme-pal-l2:before {content:$p-l2}
.w3-theme-pal-l1:before {content:$p-l1}
.w3-theme-pal:before {content:$p}
.w3-theme-pal-d1:before {content:$p-d1}
.w3-theme-pal-d2:before {content:$p-d2}
.w3-theme-pal-d3:before {content:$p-d3}
.w3-theme-pal-d4:before {content:$p-d4}
.w3-theme-pal-d5:before {content:$p-d5}
.w3-theme-pal-d6:before {content:$p-d6}
.w3-theme-pal-d7:before {content:$p-d7}
.w3-theme-pal-d8:before {content:$p-d8}
.w3-theme-pal-d9:before {content:$p-d9}
.w3-theme-pal-d10:before {content:$p-d10}
.w3-theme-pal-d11:before {content:$p-d11}
.w3-theme-pal-d12:before {content:$p-d12}
.w3-theme-pal-d13:before {content:$p-d13}
.w3-theme-pal-d14:before {content:$p-d14}
.w3-theme-pal-d15:before {content:$p-d15}
.w3-theme-pal-d16:before {content:$p-d16}
.w3-theme-pal-d17:before {content:$p-d17}
.w3-theme-pal-d18:before {content:$p-d18}
.w3-theme-pal-d19:before {content:$p-d19}
.w3-theme-pal-d20:before {content:$p-d20}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Styles ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.w3-theme { color: white !important; background-color: #c76bbf !important; }
.w3-text-theme { color: #c76bbf !important; }
.w3-theme-l5 { color: white !important; background-color: #fcf6fb !important; }
.w3-theme-l4 { color: white !important; background-color: #f4e1f2 !important; }
.w3-theme-l3 { color: white !important; background-color: #e9c4e5 !important; }
.w3-theme-l2 { color: white !important; background-color: #dda6d9 !important; }
.w3-theme-l1 { color: white !important; background-color: #d289cc !important; }
.w3-theme-d1 { color: white !important; background-color: #bf57b6 !important; }
.w3-theme-d2 { color: white !important; background-color: #b946af !important; }
.w3-theme-d3 { color: white !important; background-color: #a73f9e !important; }
.w3-theme-d4 { color: white !important; background-color: #a33e9a !important; }
.w3-theme-d5 { color: white !important; background-color: #9f3c97 !important; }
.w3-theme-d6 { color: white !important; background-color: #9b3b93 !important; }
.w3-theme-d7 { color: white !important; background-color: #8d3585 !important; }
.w3-theme-d8 { color: white !important; background-color: #85327e !important; }
.w3-theme-d9 { color: white !important; background-color: #7e3077 !important; }
.w3-theme-d10 { color: white !important; background-color: #762d70 !important; }
.w3-theme-d11 { color: white !important; background-color: #6f2a69 !important; }
.w3-theme-d12 { color: white !important; background-color: #682762 !important; }
.w3-theme-d13 { color: white !important; background-color: #60245b !important; }
.w3-theme-d14 { color: white !important; background-color: #592254 !important; }
.w3-theme-d15 { color: white !important; background-color: #511f4d !important; }
.w3-theme-d16 { color: white !important; background-color: #4a1c46 !important; }
.w3-theme-d17 { color: white !important; background-color: #461b43 !important; }
.w3-theme-d18 { color: white !important; background-color: #43193f !important; }
.w3-theme-d19 { color: white !important; background-color: #3f183c !important; }
.w3-theme-d20 { color: white !important; background-color: #3b1638 !important; }
.w3-theme-light { color: black !important; background-color: #d289cc !important; }
.w3-theme-dark { color: white !important; background-color: #511f4d !important; }
.w3-theme-darker { color: white !important; background-color: #3b1638 !important; }
.w3-theme-action { color: white !important; background-color: #9f3c97 !important; }
.w3-theme-4btns { color: white !important; background-color: #6f2a69 !important; }
.w3-hover-d1:hover { color: white !important; background-color: #bf57b6 !important; }
.w3-hover-d2:hover { color: white !important; background-color: #b946af !important; }
.w3-hover-d3:hover { color: white !important; background-color: #a73f9e !important; }
.w3-hover-d4:hover { color: white !important; background-color: #a33e9a !important; }
.w3-hover-d5:hover { color: white !important; background-color: #9f3c97 !important; }
.w3-hover-d6:hover { color: white !important; background-color: #9b3b93 !important; }
.w3-hover-d7:hover { color: white !important; background-color: #8d3585 !important; }
.w3-hover-d8:hover { color: white !important; background-color: #85327e !important; }
.w3-hover-d9:hover { color: white !important; background-color: #7e3077 !important; }
.w3-hover-d10:hover { color: white !important; background-color: #762d70 !important; }
.w3-hover-d11:hover { color: white !important; background-color: #6f2a69 !important; }
.w3-hover-d12:hover { color: white !important; background-color: #682762 !important; }
.w3-hover-d13:hover { color: white !important; background-color: #60245b !important; }
.w3-hover-d14:hover { color: white !important; background-color: #592254 !important; }
.w3-hover-d15:hover { color: white !important; background-color: #511f4d !important; }
.w3-hover-d16:hover { color: white !important; background-color: #4a1c46 !important; }
.w3-hover-d17:hover { color: white !important; background-color: #461b43 !important; }
.w3-hover-d18:hover { color: white !important; background-color: #43193f !important; }
.w3-hover-d14:hover { color: white !important; background-color: #3f183c !important; }
.w3-hover-d20:hover { color: white !important; background-color: #3b1638 !important; }
.w3-hover-darker:hover { color: white !important; background-color: #3b1638 !important; }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Theme Palette ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.theme-name:before { content: "Pink "; }
.w3-theme-pal-l5:before { content: "#fcf6fb "; }
.w3-theme-pal-l4:before { content: "#f4e1f2 "; }
.w3-theme-pal-l3:before { content: "#e9c4e5 "; }
.w3-theme-pal-l2:before { content: "#dda6d9 "; }
.w3-theme-pal-l1:before { content: "#d289cc "; }
.w3-theme-pal:before { content: "#c76bbf "; }
.w3-theme-pal-d1:before { content: "#bf57b6 "; }
.w3-theme-pal-d2:before { content: "#b946af "; }
.w3-theme-pal-d3:before { content: "#a73f9e "; }
.w3-theme-pal-d4:before { content: "#a33e9a "; }
.w3-theme-pal-d5:before { content: "#9f3c97 "; }
.w3-theme-pal-d6:before { content: "#9b3b93 "; }
.w3-theme-pal-d7:before { content: "#8d3585 "; }
.w3-theme-pal-d8:before { content: "#85327e "; }
.w3-theme-pal-d9:before { content: "#7e3077 "; }
.w3-theme-pal-d10:before { content: "#762d70 "; }
.w3-theme-pal-d11:before { content: "#6f2a69 "; }
.w3-theme-pal-d12:before { content: "#682762 "; }
.w3-theme-pal-d13:before { content: "#60245b "; }
.w3-theme-pal-d14:before { content: "#592254 "; }
.w3-theme-pal-d15:before { content: "#511f4d "; }
.w3-theme-pal-d16:before { content: "#4a1c46 "; }
.w3-theme-pal-d17:before { content: "#461b43 "; }
.w3-theme-pal-d18:before { content: "#43193f "; }
.w3-theme-pal-d19:before { content: "#3f183c "; }
.w3-theme-pal-d20:before { content: "#3b1638 "; }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment