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