Instantly share code, notes, and snippets.

Embed
What would you like to do?
Android Material Design Colours
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- google's material design colours from
http://www.google.com/design/spec/style/color.html#color-ui-color-palette -->
<!--reds-->
<color name="md_red_50">#FFEBEE</color>
<color name="md_red_100">#FFCDD2</color>
<color name="md_red_200">#EF9A9A</color>
<color name="md_red_300">#E57373</color>
<color name="md_red_400">#EF5350</color>
<color name="md_red_500">#F44336</color>
<color name="md_red_600">#E53935</color>
<color name="md_red_700">#D32F2F</color>
<color name="md_red_800">#C62828</color>
<color name="md_red_900">#B71C1C</color>
<color name="md_red_A100">#FF8A80</color>
<color name="md_red_A200">#FF5252</color>
<color name="md_red_A400">#FF1744</color>
<color name="md_red_A700">#D50000</color>
<!-- pinks -->
<color name="md_pink_50">#FCE4EC</color>
<color name="md_pink_100">#F8BBD0</color>
<color name="md_pink_200">#F48FB1</color>
<color name="md_pink_300">#F06292</color>
<color name="md_pink_400">#EC407A</color>
<color name="md_pink_500">#E91E63</color>
<color name="md_pink_600">#D81B60</color>
<color name="md_pink_700">#C2185B</color>
<color name="md_pink_800">#AD1457</color>
<color name="md_pink_900">#880E4F</color>
<color name="md_pink_A100">#FF80AB</color>
<color name="md_pink_A200">#FF4081</color>
<color name="md_pink_A400">#F50057</color>
<color name="md_pink_A700">#C51162</color>
<!-- purples -->
<color name="md_purple_50">#F3E5F5</color>
<color name="md_purple_100">#E1BEE7</color>
<color name="md_purple_200">#CE93D8</color>
<color name="md_purple_300">#BA68C8</color>
<color name="md_purple_400">#AB47BC</color>
<color name="md_purple_500">#9C27B0</color>
<color name="md_purple_600">#8E24AA</color>
<color name="md_purple_700">#7B1FA2</color>
<color name="md_purple_800">#6A1B9A</color>
<color name="md_purple_900">#4A148C</color>
<color name="md_purple_A100">#EA80FC</color>
<color name="md_purple_A200">#E040FB</color>
<color name="md_purple_A400">#D500F9</color>
<color name="md_purple_A700">#AA00FF</color>
<!-- deep purples -->
<color name="md_deep_purple_50">#EDE7F6</color>
<color name="md_deep_purple_100">#D1C4E9</color>
<color name="md_deep_purple_200">#B39DDB</color>
<color name="md_deep_purple_300">#9575CD</color>
<color name="md_deep_purple_400">#7E57C2</color>
<color name="md_deep_purple_500">#673AB7</color>
<color name="md_deep_purple_600">#5E35B1</color>
<color name="md_deep_purple_700">#512DA8</color>
<color name="md_deep_purple_800">#4527A0</color>
<color name="md_deep_purple_900">#311B92</color>
<color name="md_deep_purple_A100">#B388FF</color>
<color name="md_deep_purple_A200">#7C4DFF</color>
<color name="md_deep_purple_A400">#651FFF</color>
<color name="md_deep_purple_A700">#6200EA</color>
<!-- indigo -->
<color name="md_indigo_50">#E8EAF6</color>
<color name="md_indigo_100">#C5CAE9</color>
<color name="md_indigo_200">#9FA8DA</color>
<color name="md_indigo_300">#7986CB</color>
<color name="md_indigo_400">#5C6BC0</color>
<color name="md_indigo_500">#3F51B5</color>
<color name="md_indigo_600">#3949AB</color>
<color name="md_indigo_700">#303F9F</color>
<color name="md_indigo_800">#283593</color>
<color name="md_indigo_900">#1A237E</color>
<color name="md_indigo_A100">#8C9EFF</color>
<color name="md_indigo_A200">#536DFE</color>
<color name="md_indigo_A400">#3D5AFE</color>
<color name="md_indigo_A700">#304FFE</color>
<!--blue-->
<color name="md_blue_50">#E3F2FD</color>
<color name="md_blue_100">#BBDEFB</color>
<color name="md_blue_200">#90CAF9</color>
<color name="md_blue_300">#64B5F6</color>
<color name="md_blue_400">#42A5F5</color>
<color name="md_blue_500">#2196F3</color>
<color name="md_blue_600">#1E88E5</color>
<color name="md_blue_700">#1976D2</color>
<color name="md_blue_800">#1565C0</color>
<color name="md_blue_900">#0D47A1</color>
<color name="md_blue_A100">#82B1FF</color>
<color name="md_blue_A200">#448AFF</color>
<color name="md_blue_A400">#2979FF</color>
<color name="md_blue_A700">#2962FF</color>
<!-- light blue-->
<color name="md_light_blue_50">#E1F5FE</color>
<color name="md_light_blue_100">#B3E5FC</color>
<color name="md_light_blue_200">#81D4fA</color>
<color name="md_light_blue_300">#4fC3F7</color>
<color name="md_light_blue_400">#29B6FC</color>
<color name="md_light_blue_500">#03A9F4</color>
<color name="md_light_blue_600">#039BE5</color>
<color name="md_light_blue_700">#0288D1</color>
<color name="md_light_blue_800">#0277BD</color>
<color name="md_light_blue_900">#01579B</color>
<color name="md_light_blue_A100">#80D8FF</color>
<color name="md_light_blue_A200">#40C4FF</color>
<color name="md_light_blue_A400">#00B0FF</color>
<color name="md_light_blue_A700">#0091EA</color>
<!-- cyan -->
<color name="md_cyan_50">#E0F7FA</color>
<color name="md_cyan_100">#B2EBF2</color>
<color name="md_cyan_200">#80DEEA</color>
<color name="md_cyan_300">#4DD0E1</color>
<color name="md_cyan_400">#26C6DA</color>
<color name="md_cyan_500">#00BCD4</color>
<color name="md_cyan_600">#00ACC1</color>
<color name="md_cyan_700">#0097A7</color>
<color name="md_cyan_800">#00838F</color>
<color name="md_cyan_900">#006064</color>
<color name="md_cyan_A100">#84FFFF</color>
<color name="md_cyan_A200">#18FFFF</color>
<color name="md_cyan_A400">#00E5FF</color>
<color name="md_cyan_A700">#00B8D4</color>
<!-- teal -->
<color name="md_teal_50">#E0F2F1</color>
<color name="md_teal_100">#B2DFDB</color>
<color name="md_teal_200">#80CBC4</color>
<color name="md_teal_300">#4DB6AC</color>
<color name="md_teal_400">#26A69A</color>
<color name="md_teal_500">#009688</color>
<color name="md_teal_600">#00897B</color>
<color name="md_teal_700">#00796B</color>
<color name="md_teal_800">#00695C</color>
<color name="md_teal_900">#004D40</color>
<color name="md_teal_A100">#A7FFEB</color>
<color name="md_teal_A200">#64FFDA</color>
<color name="md_teal_A400">#1DE9B6</color>
<color name="md_teal_A700">#00BFA5</color>
<!-- green -->
<color name="md_green_50">#E8F5E9</color>
<color name="md_green_100">#C8E6C9</color>
<color name="md_green_200">#A5D6A7</color>
<color name="md_green_300">#81C784</color>
<color name="md_green_400">#66BB6A</color>
<color name="md_green_500">#4CAF50</color>
<color name="md_green_600">#43A047</color>
<color name="md_green_700">#388E3C</color>
<color name="md_green_800">#2E7D32</color>
<color name="md_green_900">#1B5E20</color>
<color name="md_green_A100">#B9F6CA</color>
<color name="md_green_A200">#69F0AE</color>
<color name="md_green_A400">#00E676</color>
<color name="md_green_A700">#00C853</color>
<!--light green-->
<color name="md_light_green_50">#F1F8E9</color>
<color name="md_light_green_100">#DCEDC8</color>
<color name="md_light_green_200">#C5E1A5</color>
<color name="md_light_green_300">#AED581</color>
<color name="md_light_green_400">#9CCC65</color>
<color name="md_light_green_500">#8BC34A</color>
<color name="md_light_green_600">#7CB342</color>
<color name="md_light_green_700">#689F38</color>
<color name="md_light_green_800">#558B2F</color>
<color name="md_light_green_900">#33691E</color>
<color name="md_light_green_A100">#CCFF90</color>
<color name="md_light_green_A200">#B2FF59</color>
<color name="md_light_green_A400">#76FF03</color>
<color name="md_light_green_A700">#64DD17</color>
<!-- lime-->
<color name="md_lime_50">#F9FBE7</color>
<color name="md_lime_100">#F0F4C3</color>
<color name="md_lime_200">#E6EE9C</color>
<color name="md_lime_300">#DCE775</color>
<color name="md_lime_400">#D4E157</color>
<color name="md_lime_500">#CDDC39</color>
<color name="md_lime_600">#C0CA33</color>
<color name="md_lime_700">#A4B42B</color>
<color name="md_lime_800">#9E9D24</color>
<color name="md_lime_900">#827717</color>
<color name="md_lime_A100">#F4FF81</color>
<color name="md_lime_A200">#EEFF41</color>
<color name="md_lime_A400">#C6FF00</color>
<color name="md_lime_A700">#AEEA00</color>
<!--yellow -->
<color name="md_yellow_50">#FFFDE7</color>
<color name="md_yellow_100">#FFF9C4</color>
<color name="md_yellow_200">#FFF590</color>
<color name="md_yellow_300">#FFF176</color>
<color name="md_yellow_400">#FFEE58</color>
<color name="md_yellow_500">#FFEB3B</color>
<color name="md_yellow_600">#FDD835</color>
<color name="md_yellow_700">#FBC02D</color>
<color name="md_yellow_800">#F9A825</color>
<color name="md_yellow_900">#F57F17</color>
<color name="md_yellow_A100">#FFFF82</color>
<color name="md_yellow_A200">#FFFF00</color>
<color name="md_yellow_A400">#FFEA00</color>
<color name="md_yellow_A700">#FFD600</color>
<!--amber-->
<color name="md_amber_50">#FFF8E1</color>
<color name="md_amber_100">#FFECB3</color>
<color name="md_amber_200">#FFE082</color>
<color name="md_amber_300">#FFD54F</color>
<color name="md_amber_400">#FFCA28</color>
<color name="md_amber_500">#FFC107</color>
<color name="md_amber_600">#FFB300</color>
<color name="md_amber_700">#FFA000</color>
<color name="md_amber_800">#FF8F00</color>
<color name="md_amber_900">#FF6F00</color>
<color name="md_amber_A100">#FFE57F</color>
<color name="md_amber_A200">#FFD740</color>
<color name="md_amber_A400">#FFC400</color>
<color name="md_amber_A700">#FFAB00</color>
<!--orange-->
<color name="md_orange_50">#FFF3E0</color>
<color name="md_orange_100">#FFE0B2</color>
<color name="md_orange_200">#FFCC80</color>
<color name="md_orange_300">#FFB74D</color>
<color name="md_orange_400">#FFA726</color>
<color name="md_orange_500">#FF9800</color>
<color name="md_orange_600">#FB8C00</color>
<color name="md_orange_700">#F57C00</color>
<color name="md_orange_800">#EF6C00</color>
<color name="md_orange_900">#E65100</color>
<color name="md_orange_A100">#FFD180</color>
<color name="md_orange_A200">#FFAB40</color>
<color name="md_orange_A400">#FF9100</color>
<color name="md_orange_A700">#FF6D00</color>
<!--deep orange-->
<color name="md_deep_orange_50">#FBE9A7</color>
<color name="md_deep_orange_100">#FFCCBC</color>
<color name="md_deep_orange_200">#FFAB91</color>
<color name="md_deep_orange_300">#FF8A65</color>
<color name="md_deep_orange_400">#FF7043</color>
<color name="md_deep_orange_500">#FF5722</color>
<color name="md_deep_orange_600">#F4511E</color>
<color name="md_deep_orange_700">#E64A19</color>
<color name="md_deep_orange_800">#D84315</color>
<color name="md_deep_orange_900">#BF360C</color>
<color name="md_deep_orange_A100">#FF9E80</color>
<color name="md_deep_orange_A200">#FF6E40</color>
<color name="md_deep_orange_A400">#FF3D00</color>
<color name="md_deep_orange_A700">#DD2600</color>
<!--brown -->
<color name="md_brown_50">#EFEBE9</color>
<color name="md_brown_100">#D7CCC8</color>
<color name="md_brown_200">#BCAAA4</color>
<color name="md_brown_300">#A1887F</color>
<color name="md_brown_400">#8D6E63</color>
<color name="md_brown_500">#795548</color>
<color name="md_brown_600">#6D4C41</color>
<color name="md_brown_700">#5D4037</color>
<color name="md_brown_800">#4E342E</color>
<color name="md_brown_900">#3E2723</color>
<!--grey-->
<color name="md_grey_50">#FAFAFA</color>
<color name="md_grey_100">#F5F5F5</color>
<color name="md_grey_200">#EEEEEE</color>
<color name="md_grey_300">#E0E0E0</color>
<color name="md_grey_400">#BDBDBD</color>
<color name="md_grey_500">#9E9E9E</color>
<color name="md_grey_600">#757575</color>
<color name="md_grey_700">#616161</color>
<color name="md_grey_800">#424242</color>
<color name="md_grey_900">#212121</color>
<color name="md_black_1000">#000000</color>
<color name="md_white_1000">#ffffff</color>
<!--blue grey-->
<color name="md_blue_grey_50">#ECEFF1</color>
<color name="md_blue_grey_100">#CFD8DC</color>
<color name="md_blue_grey_200">#B0BBC5</color>
<color name="md_blue_grey_300">#90A4AE</color>
<color name="md_blue_grey_400">#78909C</color>
<color name="md_blue_grey_500">#607D8B</color>
<color name="md_blue_grey_600">#546E7A</color>
<color name="md_blue_grey_700">#455A64</color>
<color name="md_blue_grey_800">#37474F</color>
<color name="md_blue_grey_900">#263238</color>
</resources>
@kabindra

This comment has been minimized.

Copy link

kabindra commented Jan 7, 2015

Color codes are not matching please verify yourself

@shkschneider

This comment has been minimized.

Copy link

shkschneider commented Feb 12, 2015

The colors changed since indeed.
For example I also had in my code (from Google's site) red500 as fde0dc but it is now f44336.

@tyzero

This comment has been minimized.

Copy link

tyzero commented Mar 15, 2015

Awesome!

@daniellevass

This comment has been minimized.

Copy link
Owner Author

daniellevass commented Mar 21, 2015

@kabindra and @shkschneider updated all the values :-)

@joshkopecek

This comment has been minimized.

Copy link

joshkopecek commented Mar 30, 2015

Superb. Saved me a lot of time :-)

@Sahariar

This comment has been minimized.

Copy link

Sahariar commented Apr 12, 2015

Great Man. Saves a lot lot of time ☺️

@charles2588

This comment has been minimized.

Copy link

charles2588 commented Apr 23, 2015

Appericiate your work .,..saved us all lot of time!!!!!!!!!!!!!

@FADHLISE

This comment has been minimized.

Copy link

FADHLISE commented May 7, 2015

Thank You

@daniellevass

This comment has been minimized.

Copy link
Owner Author

daniellevass commented May 16, 2015

For those that might appreciate it - I've built a library which incorporates all the material design colours into buttons and resources you can use. As well as including the material design and font awesome font sets for ease of use :-) https://github.com/android-awesome/Awesome-Material

@Sagarwal610

This comment has been minimized.

Copy link

Sagarwal610 commented Jun 5, 2015

Thank you , you saved a lot of time

@Assassinss

This comment has been minimized.

Copy link

Assassinss commented Jun 30, 2015

Thank you

@kaolick

This comment has been minimized.

Copy link

kaolick commented Jul 5, 2015

Absolutely awesome!!! Thank you! Was just about to do it myself...

@hoooolo

This comment has been minimized.

Copy link

hoooolo commented Jul 7, 2015

Thank you

@dylanCleary

This comment has been minimized.

Copy link

dylanCleary commented Jul 14, 2015

Thanks this is super helpful.

@raphaelgmelo

This comment has been minimized.

Copy link

raphaelgmelo commented Jul 24, 2015

Thanks!

@IgorMedved

This comment has been minimized.

Copy link

IgorMedved commented Aug 23, 2015

Thanks!

@asrin475

This comment has been minimized.

Copy link

asrin475 commented Aug 27, 2015

Thanks dude!

@KavelCortex

This comment has been minimized.

Copy link

KavelCortex commented Aug 30, 2015

AWESOME THANK YOU!

@adityanaique

This comment has been minimized.

Copy link

adityanaique commented Nov 24, 2015

Wow, thank you! Thanks A LOT!! 👍

@vieck

This comment has been minimized.

Copy link

vieck commented Dec 1, 2015

I owe you one!

@sfatdisk

This comment has been minimized.

Copy link

sfatdisk commented Dec 26, 2015

Awesome! Thumbs up!

@gasparkf

This comment has been minimized.

Copy link

gasparkf commented Jan 10, 2016

Thank you, well done!

@vdavid

This comment has been minimized.

Copy link

vdavid commented Jan 18, 2016

Thanks a lot! :)

@lupsaa

This comment has been minimized.

Copy link

lupsaa commented Mar 9, 2016

I got halfway through writing my own colours until I stumbled upon this. Thank you so much!

@lookub

This comment has been minimized.

Copy link

lookub commented Mar 28, 2016

this will simplify my works :) thank you

@krupalshah

This comment has been minimized.

Copy link

krupalshah commented Apr 2, 2016

thank you 👍

@thitoo

This comment has been minimized.

Copy link

thitoo commented Apr 7, 2016

It is really useful for me. Thanks you :-D

@iiredalert

This comment has been minimized.

Copy link

iiredalert commented Apr 30, 2016

I've added the primary, secondary and disabled text constants here:

https://gist.github.com/iiredalert/0114986716d017bfa754635e65aea2ce

@kiratheone

This comment has been minimized.

Copy link

kiratheone commented Jun 14, 2016

Wow, its very useful

Many Thanks (y)

@klauskpm

This comment has been minimized.

Copy link

klauskpm commented Jul 1, 2016

Thank you 👍

@gotoark

This comment has been minimized.

Copy link

gotoark commented Jul 7, 2016

Thank You.!!!!!

@Prawesome

This comment has been minimized.

Copy link

Prawesome commented Jul 14, 2016

Thats amazing, thank you very much

@imshenyz

This comment has been minimized.

Copy link

imshenyz commented Sep 27, 2016

Thanks for saved my times!

@rohithramachandran

This comment has been minimized.

Copy link

rohithramachandran commented Oct 6, 2016

Thanks dude....Saved hell of a time.... 👍

@HE-SOFT

This comment has been minimized.

Copy link

HE-SOFT commented Oct 16, 2016

Thanks

@gurleensethi

This comment has been minimized.

Copy link

gurleensethi commented Nov 11, 2016

Dam bro!

@markfarber

This comment has been minimized.

Copy link

markfarber commented Jan 16, 2017

thanks!

@jkpark

This comment has been minimized.

Copy link

jkpark commented Feb 8, 2017

thanks

@MmtBkn

This comment has been minimized.

Copy link

MmtBkn commented Apr 18, 2017

thanks!

@mdavalos1993

This comment has been minimized.

Copy link

mdavalos1993 commented Apr 27, 2017

Thanks bro!

@hugocastelani

This comment has been minimized.

Copy link

hugocastelani commented Jun 19, 2017

Thank you!

@arifullahjan

This comment has been minimized.

Copy link

arifullahjan commented Jul 1, 2017

thanks

@jesster2k10

This comment has been minimized.

Copy link

jesster2k10 commented Jul 1, 2017

amazing

@jackz314

This comment has been minimized.

Copy link

jackz314 commented Sep 19, 2017

Thanks a lot my friend!

@fburel

This comment has been minimized.

Copy link

fburel commented Oct 23, 2017

Amazing! Thks a lot!

@theapache64

This comment has been minimized.

Copy link

theapache64 commented Nov 25, 2017

All in one line
compile 'com.theah64.materialcolors:materialcolors:1.0.0 ! enjoy!

@YassinAJDI

This comment has been minimized.

Copy link

YassinAJDI commented Feb 5, 2018

thanks

@bennythejudge

This comment has been minimized.

Copy link

bennythejudge commented Apr 3, 2018

thanks!!

@rohitratanpara

This comment has been minimized.

Copy link

rohitratanpara commented May 14, 2018

thank you so much

@eldafito

This comment has been minimized.

Copy link

eldafito commented Aug 2, 2018

I <3 U

@fbtw

This comment has been minimized.

Copy link

fbtw commented Nov 21, 2018

NICE

@tutaf

This comment has been minimized.

Copy link

tutaf commented Dec 31, 2018

Thanks :)

@lerobosys

This comment has been minimized.

Copy link

lerobosys commented Jan 21, 2019

Awesome, thanks

@iRYO400

This comment has been minimized.

Copy link

iRYO400 commented Jan 30, 2019

GJ! Thanks!

@basshelal

This comment has been minimized.

Copy link

basshelal commented Feb 16, 2019

Legend! Thank you :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment