Last active
August 10, 2019 15:53
-
-
Save z-------------/295f47dbd9b50eff4fd1 to your computer and use it in GitHub Desktop.
A big ol' list of Sass/SCSS variables containing every color in the Material Design color spec (https://www.google.com/design/spec/style/color.html). No, I did not hand copy these.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| $black: #000000; | |
| $white: #FFFFFF; | |
| $red50: #FFEBEE; | |
| $red100: #FFCDD2; | |
| $red200: #EF9A9A; | |
| $red300: #E57373; | |
| $red400: #EF5350; | |
| $red500: #F44336; | |
| $red600: #E53935; | |
| $red700: #D32F2F; | |
| $red800: #C62828; | |
| $red900: #B71C1C; | |
| $redA100: #FF8A80; | |
| $redA200: #FF5252; | |
| $redA400: #FF1744; | |
| $redA700: #D50000; | |
| $pink50: #FCE4EC; | |
| $pink100: #F8BBD0; | |
| $pink200: #F48FB1; | |
| $pink300: #F06292; | |
| $pink400: #EC407A; | |
| $pink500: #E91E63; | |
| $pink600: #D81B60; | |
| $pink700: #C2185B; | |
| $pink800: #AD1457; | |
| $pink900: #880E4F; | |
| $pinkA100: #FF80AB; | |
| $pinkA200: #FF4081; | |
| $pinkA400: #F50057; | |
| $pinkA700: #C51162; | |
| $purple50: #F3E5F5; | |
| $purple100: #E1BEE7; | |
| $purple200: #CE93D8; | |
| $purple300: #BA68C8; | |
| $purple400: #AB47BC; | |
| $purple500: #9C27B0; | |
| $purple600: #8E24AA; | |
| $purple700: #7B1FA2; | |
| $purple800: #6A1B9A; | |
| $purple900: #4A148C; | |
| $purpleA100: #EA80FC; | |
| $purpleA200: #E040FB; | |
| $purpleA400: #D500F9; | |
| $purpleA700: #AA00FF; | |
| $deeppurple50: #EDE7F6; | |
| $deeppurple100: #D1C4E9; | |
| $deeppurple200: #B39DDB; | |
| $deeppurple300: #9575CD; | |
| $deeppurple400: #7E57C2; | |
| $deeppurple500: #673AB7; | |
| $deeppurple600: #5E35B1; | |
| $deeppurple700: #512DA8; | |
| $deeppurple800: #4527A0; | |
| $deeppurple900: #311B92; | |
| $deeppurpleA100: #B388FF; | |
| $deeppurpleA200: #7C4DFF; | |
| $deeppurpleA400: #651FFF; | |
| $deeppurpleA700: #6200EA; | |
| $indigo50: #E8EAF6; | |
| $indigo100: #C5CAE9; | |
| $indigo200: #9FA8DA; | |
| $indigo300: #7986CB; | |
| $indigo400: #5C6BC0; | |
| $indigo500: #3F51B5; | |
| $indigo600: #3949AB; | |
| $indigo700: #303F9F; | |
| $indigo800: #283593; | |
| $indigo900: #1A237E; | |
| $indigoA100: #8C9EFF; | |
| $indigoA200: #536DFE; | |
| $indigoA400: #3D5AFE; | |
| $indigoA700: #304FFE; | |
| $blue50: #E3F2FD; | |
| $blue100: #BBDEFB; | |
| $blue200: #90CAF9; | |
| $blue300: #64B5F6; | |
| $blue400: #42A5F5; | |
| $blue500: #2196F3; | |
| $blue600: #1E88E5; | |
| $blue700: #1976D2; | |
| $blue800: #1565C0; | |
| $blue900: #0D47A1; | |
| $blueA100: #82B1FF; | |
| $blueA200: #448AFF; | |
| $blueA400: #2979FF; | |
| $blueA700: #2962FF; | |
| $lightblue50: #E1F5FE; | |
| $lightblue100: #B3E5FC; | |
| $lightblue200: #81D4FA; | |
| $lightblue300: #4FC3F7; | |
| $lightblue400: #29B6F6; | |
| $lightblue500: #03A9F4; | |
| $lightblue600: #039BE5; | |
| $lightblue700: #0288D1; | |
| $lightblue800: #0277BD; | |
| $lightblue900: #01579B; | |
| $lightblueA100: #80D8FF; | |
| $lightblueA200: #40C4FF; | |
| $lightblueA400: #00B0FF; | |
| $lightblueA700: #0091EA; | |
| $cyan50: #E0F7FA; | |
| $cyan100: #B2EBF2; | |
| $cyan200: #80DEEA; | |
| $cyan300: #4DD0E1; | |
| $cyan400: #26C6DA; | |
| $cyan500: #00BCD4; | |
| $cyan600: #00ACC1; | |
| $cyan700: #0097A7; | |
| $cyan800: #00838F; | |
| $cyan900: #006064; | |
| $cyanA100: #84FFFF; | |
| $cyanA200: #18FFFF; | |
| $cyanA400: #00E5FF; | |
| $cyanA700: #00B8D4; | |
| $teal50: #E0F2F1; | |
| $teal100: #B2DFDB; | |
| $teal200: #80CBC4; | |
| $teal300: #4DB6AC; | |
| $teal400: #26A69A; | |
| $teal500: #009688; | |
| $teal600: #00897B; | |
| $teal700: #00796B; | |
| $teal800: #00695C; | |
| $teal900: #004D40; | |
| $tealA100: #A7FFEB; | |
| $tealA200: #64FFDA; | |
| $tealA400: #1DE9B6; | |
| $tealA700: #00BFA5; | |
| $green50: #E8F5E9; | |
| $green100: #C8E6C9; | |
| $green200: #A5D6A7; | |
| $green300: #81C784; | |
| $green400: #66BB6A; | |
| $green500: #4CAF50; | |
| $green600: #43A047; | |
| $green700: #388E3C; | |
| $green800: #2E7D32; | |
| $green900: #1B5E20; | |
| $greenA100: #B9F6CA; | |
| $greenA200: #69F0AE; | |
| $greenA400: #00E676; | |
| $greenA700: #00C853; | |
| $lightgreen50: #F1F8E9; | |
| $lightgreen100: #DCEDC8; | |
| $lightgreen200: #C5E1A5; | |
| $lightgreen300: #AED581; | |
| $lightgreen400: #9CCC65; | |
| $lightgreen500: #8BC34A; | |
| $lightgreen600: #7CB342; | |
| $lightgreen700: #689F38; | |
| $lightgreen800: #558B2F; | |
| $lightgreen900: #33691E; | |
| $lightgreenA100: #CCFF90; | |
| $lightgreenA200: #B2FF59; | |
| $lightgreenA400: #76FF03; | |
| $lightgreenA700: #64DD17; | |
| $lime50: #F9FBE7; | |
| $lime100: #F0F4C3; | |
| $lime200: #E6EE9C; | |
| $lime300: #DCE775; | |
| $lime400: #D4E157; | |
| $lime500: #CDDC39; | |
| $lime600: #C0CA33; | |
| $lime700: #AFB42B; | |
| $lime800: #9E9D24; | |
| $lime900: #827717; | |
| $limeA100: #F4FF81; | |
| $limeA200: #EEFF41; | |
| $limeA400: #C6FF00; | |
| $limeA700: #AEEA00; | |
| $yellow50: #FFFDE7; | |
| $yellow100: #FFF9C4; | |
| $yellow200: #FFF59D; | |
| $yellow300: #FFF176; | |
| $yellow400: #FFEE58; | |
| $yellow500: #FFEB3B; | |
| $yellow600: #FDD835; | |
| $yellow700: #FBC02D; | |
| $yellow800: #F9A825; | |
| $yellow900: #F57F17; | |
| $yellowA100: #FFFF8D; | |
| $yellowA200: #FFFF00; | |
| $yellowA400: #FFEA00; | |
| $yellowA700: #FFD600; | |
| $amber50: #FFF8E1; | |
| $amber100: #FFECB3; | |
| $amber200: #FFE082; | |
| $amber300: #FFD54F; | |
| $amber400: #FFCA28; | |
| $amber500: #FFC107; | |
| $amber600: #FFB300; | |
| $amber700: #FFA000; | |
| $amber800: #FF8F00; | |
| $amber900: #FF6F00; | |
| $amberA100: #FFE57F; | |
| $amberA200: #FFD740; | |
| $amberA400: #FFC400; | |
| $amberA700: #FFAB00; | |
| $orange50: #FFF3E0; | |
| $orange100: #FFE0B2; | |
| $orange200: #FFCC80; | |
| $orange300: #FFB74D; | |
| $orange400: #FFA726; | |
| $orange500: #FF9800; | |
| $orange600: #FB8C00; | |
| $orange700: #F57C00; | |
| $orange800: #EF6C00; | |
| $orange900: #E65100; | |
| $orangeA100: #FFD180; | |
| $orangeA200: #FFAB40; | |
| $orangeA400: #FF9100; | |
| $orangeA700: #FF6D00; | |
| $deeporange50: #FBE9E7; | |
| $deeporange100: #FFCCBC; | |
| $deeporange200: #FFAB91; | |
| $deeporange300: #FF8A65; | |
| $deeporange400: #FF7043; | |
| $deeporange500: #FF5722; | |
| $deeporange600: #F4511E; | |
| $deeporange700: #E64A19; | |
| $deeporange800: #D84315; | |
| $deeporange900: #BF360C; | |
| $deeporangeA100: #FF9E80; | |
| $deeporangeA200: #FF6E40; | |
| $deeporangeA400: #FF3D00; | |
| $deeporangeA700: #DD2C00; | |
| $brown50: #EFEBE9; | |
| $brown100: #D7CCC8; | |
| $brown200: #BCAAA4; | |
| $brown300: #A1887F; | |
| $brown400: #8D6E63; | |
| $brown500: #795548; | |
| $brown600: #6D4C41; | |
| $brown700: #5D4037; | |
| $brown800: #4E342E; | |
| $brown900: #3E2723; | |
| $grey50: #FAFAFA; | |
| $grey100: #F5F5F5; | |
| $grey200: #EEEEEE; | |
| $grey300: #E0E0E0; | |
| $grey400: #BDBDBD; | |
| $grey500: #9E9E9E; | |
| $grey600: #757575; | |
| $grey700: #616161; | |
| $grey800: #424242; | |
| $grey900: #212121; | |
| $bluegrey50: #ECEFF1; | |
| $bluegrey100: #CFD8DC; | |
| $bluegrey200: #B0BEC5; | |
| $bluegrey300: #90A4AE; | |
| $bluegrey400: #78909C; | |
| $bluegrey500: #607D8B; | |
| $bluegrey600: #546E7A; | |
| $bluegrey700: #455A64; | |
| $bluegrey800: #37474F; | |
| $bluegrey900: #263238; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment