Created
August 16, 2019 18:43
-
-
Save Nereare/3f181f42056bff36045c700b387f6465 to your computer and use it in GitHub Desktop.
Color List from https://material.io/design/color/
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
| // Color List from https://material.io/design/color/ | |
| // ================================================= | |
| // If a color is followed by HC, it contrasts better | |
| // with a light color. | |
| // Reds | |
| $Red50 : #FFEBEE; | |
| $Red100 : #FFCDD2; | |
| $Red200 : #EF9A9A; | |
| $Red300 : #E57373; | |
| $Red400 : #EF5350; // HC | |
| $Red500 : #F44336; // HC | |
| $Red600 : #E53935; // HC | |
| $Red700 : #D32F2F; // HC | |
| $Red800 : #C62828; // HC | |
| $Red900 : #B71C1C; // HC | |
| $RedA100 : #FF8A80; | |
| $RedA200 : #FF5252; // HC | |
| $RedA400 : #FF1744; // HC | |
| $RedA700 : #D50000; // HC | |
| // Pinks | |
| $Pink50 : #FCE4EC; | |
| $Pink100 : #F8BBD0; | |
| $Pink200 : #F48FB1; | |
| $Pink300 : #F06292; | |
| $Pink400 : #EC407A; // HC | |
| $Pink500 : #E91E63; // HC | |
| $Pink600 : #D81B60; // HC | |
| $Pink700 : #C2185B; // HC | |
| $Pink800 : #AD1457; // HC | |
| $Pink900 : #880E4F; // HC | |
| $PinkA100 : #FF80AB; | |
| $PinkA200 : #FF4081; // HC | |
| $PinkA400 : #F50057; // HC | |
| $PinkA700 : #C51162; // HC | |
| // Purples | |
| $Purple50 : #F3E5F5; | |
| $Purple100 : #E1BEE7; | |
| $Purple200 : #CE93D8; | |
| $Purple300 : #BA68C8; // HC | |
| $Purple400 : #AB47BC; // HC | |
| $Purple500 : #9C27B0; // HC | |
| $Purple600 : #8E24AA; // HC | |
| $Purple700 : #7B1FA2; // HC | |
| $Purple800 : #6A1B9A; // HC | |
| $Purple900 : #4A148C; // HC | |
| $PurpleA100 : #EA80FC; | |
| $PurpleA200 : #E040FB; // HC | |
| $PurpleA400 : #D500F9; // HC | |
| $PurpleA700 : #AA00FF; // HC | |
| // Deep Purples | |
| $DPurple50 : #EDE7F6; | |
| $DPurple100 : #D1C4E9; | |
| $DPurple200 : #B39DDB; | |
| $DPurple300 : #9575CD; // HC | |
| $DPurple400 : #7E57C2; // HC | |
| $DPurple500 : #673AB7; // HC | |
| $DPurple600 : #5E35B1; // HC | |
| $DPurple700 : #512DA8; // HC | |
| $DPurple800 : #4527A0; // HC | |
| $DPurple900 : #311B92; // HC | |
| $DPurpleA100 : #B388FF; | |
| $DPurpleA200 : #7C4DFF; // HC | |
| $DPurpleA400 : #651FFF; // HC | |
| $DPurpleA700 : #6200EA; // HC | |
| // Indigos | |
| $Indigo50 : #E8EAF6; | |
| $Indigo100 : #C5CAE9; | |
| $Indigo200 : #9FA8DA; | |
| $Indigo300 : #7986CB; // HC | |
| $Indigo400 : #5C6BC0; // HC | |
| $Indigo500 : #3F51B5; // HC | |
| $Indigo600 : #3949AB; // HC | |
| $Indigo700 : #303F9F; // HC | |
| $Indigo800 : #283593; // HC | |
| $Indigo900 : #1A237E; // HC | |
| $IndigoA100 : #8C9EFF; | |
| $IndigoA200 : #536DFE; // HC | |
| $IndigoA400 : #3D5AFE; // HC | |
| $IndigoA700 : #304FFE; // HC | |
| // Blues | |
| $Blue50 : #E3F2FD; | |
| $Blue100 : #BBDEFB; | |
| $Blue200 : #90CAF9; | |
| $Blue300 : #64B5F6; | |
| $Blue400 : #42A5F5; | |
| $Blue500 : #2196F3; | |
| $Blue600 : #1E88E5; // HC | |
| $Blue700 : #1976D2; // HC | |
| $Blue800 : #1565C0; // HC | |
| $Blue900 : #0D47A1; // HC | |
| $BlueA100 : #82B1FF; | |
| $BlueA200 : #448AFF; // HC | |
| $BlueA400 : #2979FF; // HC | |
| $BlueA700 : #2962FF; // HC | |
| // Light Blues | |
| $LBlue50 : #E1F5FE; | |
| $LBlue100 : #B3E5FC; | |
| $LBlue200 : #81D4FA; | |
| $LBlue300 : #4FC3F7; | |
| $LBlue400 : #29B6F6; | |
| $LBlue500 : #03A9F4; | |
| $LBlue600 : #039BE5; | |
| $LBlue700 : #0288D1; // HC | |
| $LBlue800 : #0277BD; // HC | |
| $LBlue900 : #01579B; // HC | |
| $LBlueA100 : #80D8FF; | |
| $LBlueA200 : #40C4FF; | |
| $LBlueA400 : #00B0FF; | |
| $LBlueA700 : #0091EA; // HC | |
| // Cyans | |
| $Cyan50 : #E0F7FA; | |
| $Cyan100 : #B2EBF2; | |
| $Cyan200 : #80DEEA; | |
| $Cyan300 : #4DD0E1; | |
| $Cyan400 : #26C6DA; | |
| $Cyan500 : #00BCD4; | |
| $Cyan600 : #00ACC1; | |
| $Cyan700 : #0097A7; // HC | |
| $Cyan800 : #00838F; // HC | |
| $Cyan900 : #006064; // HC | |
| $CyanA100 : #84FFFF; | |
| $CyanA200 : #18FFFF; | |
| $CyanA400 : #00E5FF; | |
| $CyanA700 : #00B8D4; | |
| // Teals | |
| $Teal50 : #E0F2F1; | |
| $Teal100 : #B2DFDB; | |
| $Teal200 : #80CBC4; | |
| $Teal300 : #4DB6AC; | |
| $Teal400 : #26A69A; | |
| $Teal500 : #009688; // HC | |
| $Teal600 : #00897B; // HC | |
| $Teal700 : #00796B; // HC | |
| $Teal800 : #00695C; // HC | |
| $Teal900 : #004D40; // HC | |
| $TealA100 : #A7FFEB; | |
| $TealA200 : #64FFDA; | |
| $TealA400 : #1DE9B6; | |
| $TealA700 : #00BFA5; | |
| // Greens | |
| $Green50 : #E8F5E9; | |
| $Green100 : #C8E6C9; | |
| $Green200 : #A5D6A7; | |
| $Green300 : #81C784; | |
| $Green400 : #66BB6A; | |
| $Green500 : #4CAF50; | |
| $Green600 : #43A047; // HC | |
| $Green700 : #388E3C; // HC | |
| $Green800 : #2E7D32; // HC | |
| $Green900 : #1B5E20; // HC | |
| $GreenA100 : #B9F6CA; | |
| $GreenA200 : #69F0AE; | |
| $GreenA400 : #00E676; | |
| $GreenA700 : #00C853; | |
| // Light Greens | |
| $LGreen50 : #F1F8E9; | |
| $LGreen100 : #DCEDC8; | |
| $LGreen200 : #C5E1A5; | |
| $LGreen300 : #AED581; | |
| $LGreen400 : #9CCC65; | |
| $LGreen500 : #8BC34A; | |
| $LGreen600 : #7CB342; | |
| $LGreen700 : #689F38; | |
| $LGreen800 : #558B2F; // HC | |
| $LGreen900 : #33691E; // HC | |
| $LGreenA100 : #CCFF90; | |
| $LGreenA200 : #B2FF59; | |
| $LGreenA400 : #76FF03; | |
| $LGreenA700 : #64DD17; | |
| // Limes | |
| $Lime50 : #F9FBE7; | |
| $Lime100 : #F0F4C3; | |
| $Lime200 : #E6EE9C; | |
| $Lime300 : #DCE775; | |
| $Lime400 : #D4E157; | |
| $Lime500 : #CDDC39; | |
| $Lime600 : #C0CA33; | |
| $Lime700 : #AFB42B; | |
| $Lime800 : #9E9D24; | |
| $Lime900 : #827717; // HC | |
| $LimeA100 : #F4FF81; | |
| $LimeA200 : #EEFF41; | |
| $LimeA400 : #C6FF00; | |
| $LimeA700 : #AEEA00; | |
| // Yellows | |
| $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; | |
| // Ambers | |
| $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; | |
| // Oranges | |
| $Orange50 : #FFF3E0; | |
| $Orange100 : #FFE0B2; | |
| $Orange200 : #FFCC80; | |
| $Orange300 : #FFB74D; | |
| $Orange400 : #FFA726; | |
| $Orange500 : #FF9800; | |
| $Orange600 : #FB8C00; | |
| $Orange700 : #F57C00; | |
| $Orange800 : #EF6C00; | |
| $Orange900 : #E65100; // HC | |
| $OrangeA100 : #FFD180; | |
| $OrangeA200 : #FFAB40; | |
| $OrangeA400 : #FF9100; | |
| $OrangeA700 : #FF6D00; | |
| // Deep Oranges | |
| $DOrange50 : #FBE9E7; | |
| $DOrange100 : #FFCCBC; | |
| $DOrange200 : #FFAB91; | |
| $DOrange300 : #FF8A65; | |
| $DOrange400 : #FF7043; | |
| $DOrange500 : #FF5722; | |
| $DOrange600 : #F4511E; // HC | |
| $DOrange700 : #E64A19; // HC | |
| $DOrange800 : #D84315; // HC | |
| $DOrange900 : #BF360C; // HC | |
| $DOrangeA100 : #FF9E80; | |
| $DOrangeA200 : #FF6E40; | |
| $DOrangeA400 : #FF3D00; // HC | |
| $DOrangeA700 : #DD2C00; // HC | |
| // Browns | |
| $Brown50 : #EFEBE9; | |
| $Brown100 : #D7CCC8; | |
| $Brown200 : #BCAAA4; | |
| $Brown300 : #A1887F; // HC | |
| $Brown400 : #8D6E63; // HC | |
| $Brown500 : #795548; // HC | |
| $Brown600 : #6D4C41; // HC | |
| $Brown700 : #5D4037; // HC | |
| $Brown800 : #4E342E; // HC | |
| $Brown900 : #3E2723; // HC | |
| // Grays | |
| $Gray50 : #FAFAFA; | |
| $Gray100 : #F5F5F5; | |
| $Gray200 : #EEEEEE; | |
| $Gray300 : #E0E0E0; | |
| $Gray400 : #BDBDBD; | |
| $Gray500 : #9E9E9E; | |
| $Gray600 : #757575; // HC | |
| $Gray700 : #616161; // HC | |
| $Gray800 : #424242; // HC | |
| $Gray900 : #212121; // HC | |
| // Blue Grays | |
| $BGray50 : #ECEFF1; | |
| $BGray100 : #CFD8DC; | |
| $BGray200 : #B0BEC5; | |
| $BGray300 : #90A4AE; | |
| $BGray400 : #78909C; // HC | |
| $BGray500 : #607D8B; // HC | |
| $BGray600 : #546E7A; // HC | |
| $BGray700 : #455A64; // HC | |
| $BGray800 : #37474F; // HC | |
| $BGray900 : #263238; // HC | |
| // B&W | |
| $Black : #000000; // HC | |
| $White : #FFFFFF; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment