perfectowebWeb design & programming studio
Material Design Colors
Google’s Material UI colors palette comprises primary and accent colors that can be used for illustration or to develop your brand colors.
They’ve been designed to work harmoniously with each other.

Material Design Colors

About Material UI Colors

Google’s material ui colors palette comprises primary and accent colors that can be used for illustration or to develop your brand colors. They’ve been designed to work harmoniously with each other. The color palette starts with primary colors and fills in the spectrum to create a complete and usable palette for Android, Web, and iOS. Google suggests using the 500 colors as the primary colors in your app and the other colors as accents colors. Google challenged themselves to create a visual language for users that synthesizes the classic principles of good design with the innovation and possibility of technology and science. This is material design.

Red: #f44336Pink: #E91E63Purple: #9C27B0Deep Purple: #673AB7Indigo: #3F51B5Blue: #2196F3Light Blue: #03A9F4Cyan: #00BCD4Teal: #009688Green: #4CAF50Light Green: #8BC34ALime: #CDDC39Yellow: #FFEB3BAmber: #FFC107Orange: #FF9800Deep Orange: #FF5722Brown: #795548Grey: #9E9E9EBlue Grey: #607D8B
50: #ffebee50: #FCE4EC50: #F3E5F550: #EDE7F650: #E8EAF650: #E3F2FD50: #E1F5FE50: #E0F7FA50: #E0F2F150: #E8F5E950: #F1F8E950: #F9FBE750: #FFFDE750: #FFF8E150: #FFF3E050: #FBE9E750: #EFEBE950: #FAFAFA50: #ECEFF1
100: #ffcdd2100: #F8BBD0100: #E1BEE7100: #D1C4E9100: #C5CAE9100: #BBDEFB100: #B3E5FC100: #B2EBF2100: #B2DFDB100: #C8E6C9100: #DCEDC8100: #F0F4C3100: #FFF9C4100: #FFECB3100: #FFE0B2100: #FFCCBC100: #D7CCC8100: #F5F5F5100: #CFD8DC
200: #ef9a9a200: #F48FB1200: #CE93D8200: #B39DDB200: #9FA8DA200: #90CAF9200: #81D4FA200: #80DEEA200: #80CBC4200: #A5D6A7200: #C5E1A5200: #E6EE9C200: #FFF59D200: #FFE082200: #FFCC80200: #FFAB91200: #BCAAA4200: #EEEEEE200: #B0BEC5
300: #e57373300: #F06292300: #BA68C8300: #9575CD300: #7986CB300: #64B5F6300: #4FC3F7300: #4DD0E1300: #4DB6AC300: #81C784300: #AED581300: #DCE775300: #FFF176300: #FFD54F300: #FFB74D300: #FF8A65300: #A1887F300: #E0E0E0300: #90A4AE
400: #ef5350400: #EC407A400: #AB47BC400: #7E57C2400: #5C6BC0400: #42A5F5400: #29B6F6400: #26C6DA400: #26A69A400: #66BB6A400: #9CCC65400: #D4E157400: #FFEE58400: #FFCA28400: #FFA726400: #FF7043400: #8D6E63400: #BDBDBD400: #78909C
500: #f44336500: #E91E63500: #9C27B0500: #673AB7500: #3F51B5500: #2196F3500: #03A9F4500: #00BCD4500: #009688500: #4CAF50500: #8BC34A500: #CDDC39500: #FFEB3B500: #FFC107500: #FF9800500: #FF5722500: #795548500: #9E9E9E500: #607D8B
600: #e53935600: #D81B60600: #8E24AA600: #5E35B1600: #3949AB600: #1E88E5600: #039BE5600: #00ACC1600: #00897B600: #43A047600: #7CB342600: #C0CA33600: #FDD835600: #FFB300600: #FB8C00600: #F4511E600: #6D4C41600: #757575600: #546E7A
700: #d32f2f700: #C2185B700: #7B1FA2700: #512DA8700: #303F9F700: #1976D2700: #0288D1700: #0097A7700: #00796B700: #388E3C700: #689F38700: #AFB42B700: #FBC02D700: #FFA000700: #F57C00700: #E64A19700: #5D4037700: #616161700: #455A64
800: #c62828800: #AD1457800: #6A1B9A800: #4527A0800: #283593800: #1565C0800: #0277BD800: #00838F800: #00695C800: #2E7D32800: #558B2F800: #9E9D24800: #F9A825800: #FF8F00800: #EF6C00800: #D84315800: #4E342E800: #424242800: #37474F
900: #b71c1c900: #880E4F900: #4A148C900: #311B92900: #1A237E900: #0D47A1900: #01579B900: #006064900: #004D40900: #1B5E20900: #33691E900: #827717900: #F57F17900: #FF6F00900: #E65100900: #BF360C900: #3E2723900: #212121900: #263238
A100: #ff8a80A100: #FF80ABA100: #EA80FCA100: #B388FFA100: #8C9EFFA100: #82B1FFA100: #80D8FFA100: #84FFFFA100: #A7FFEBA100: #B9F6CAA100: #CCFF90A100: #F4FF81A100: #FFFF8DA100: #FFE57FA100: #FFD180A100: #FF9E80
A200: #ff5252A200: #FF4081A200: #E040FBA200: #7C4DFFA200: #536DFEA200: #448AFFA200: #40C4FFA200: #18FFFFA200: #64FFDAA200: #69F0AEA200: #B2FF59A200: #EEFF41A200: #FFFF00A200: #FFD740A200: #FFAB40A200: #FF6E40
A400: #ff1744A400: #F50057A400: #D500F9A400: #651FFFA400: #3D5AFEA400: #2979FFA400: #00B0FFA400: #00E5FFA400: #1DE9B6A400: #00E676A400: #76FF03A400: #C6FF00A400: #FFEA00A400: #FFC400A400: #FF9100A400: #FF3D00
A700: #d50000A700: #C51162A700: #AA00FFA700: #6200EAA700: #304FFEA700: #2962FFA700: #0091EAA700: #00B8D4A700: #00BFA5A700: #00C853A700: #64DD17A700: #AEEA00A700: #FFD600A700: #FFAB00A700: #FF6D00A700: #DD2C00

Choose language