- Forum-Beiträge: 434
30.10.2014, 19:39:10 via Website
30.10.2014 19:39:10 via Website
Hallo,
da ich keine Quelle gefunden habe, wo man die neuen Farbwerte in einem File bekommt, habe ich mir selbst die Mühe gemacht und die Werte mal zusammengetragen.
Zu den Namen.. "L" steht (bei mir^^) für light und "S" für solid (dementsprechend einen kräftigeren Farbton).
Google empfiehlt bei "normalen Texten" für dunklere Werte (also alles was kräftiger, als die Standardfarbe ist) eine helle / weiße Schrift zu verwenden. Für Hinweise oder ausgegraute UI-Elementen, etc. gilt das nicht.
<!-- MATERIAL DESIGN COLORS -->
<!-- Primär-Farbe ist der Wert ohne Zusatz
weitere Infos unter http://www.google.com/design/spec/style/color.html# -->
<!-- "Deep Orange" -->
<color name="DeepOrangeL5">#fbe9e7</color>
<color name="DeepOrangeL4">#ffccbc</color>
<color name="DeepOrangeL3">#ffab91</color>
<color name="DeepOrangeL2">#ff8a65</color>
<color name="DeepOrangeL1">#ff7043</color>
<color name="DeepOrange">#ff5722</color>
<color name="DeepOrangeS1">#f4511e</color>
<color name="DeepOrangeS2">#e64a19</color>
<color name="DeepOrangeS3">#d84315</color>
<color name="DeepOrangeS4">#bf360c</color>
<color name="DeepOrangeA1">#ff9e80</color>
<color name="DeepOrangeA2">#ff6e40</color>
<color name="DeepOrangeA3">#ff3d00</color>
<color name="DeepOrangeA4">#dd2c00</color>
<!-- Grey -->
<color name="GreyL5">#fafafa</color>
<color name="GreyL4">#f5f5f5</color>
<color name="GreyL3">#eeeeee</color>
<color name="GreyL2">#e0e0e0</color>
<color name="GreyL1">#bdbdbd</color>
<color name="Grey">#9e9e9e</color>
<color name="GreyS1">#757575</color>
<color name="GreyS2">#616161</color>
<color name="GreyS3">#424242</color>
<color name="GreyS4">#212121</color>
<color name="GreyS5">#000000</color>
<!-- Yellow -->
<color name="YellowL5">#fffde7</color>
<color name="YellowL4">#fff9c4</color>
<color name="YellowL3">#fff59d</color>
<color name="YellowL2">#fff176</color>
<color name="YellowL1">#ffee58</color>
<color name="Yellow">#ffeb3b</color>
<color name="YellowS1">#fdd835</color>
<color name="YellowS2">#fbc02d</color>
<color name="YellowS3">#f9a825</color>
<color name="YellowS4">#f57f17</color>
<color name="YellowS5">#f57f17</color>
<color name="YellowA1">#ffff8d</color>
<color name="YellowA2">#ffff00</color>
<color name="YellowA3">#ffea00</color>
<color name="YellowA4">#ffd600</color>
<!-- Amber -->
<color name="AmberL5">#fff8e1</color>
<color name="AmberL4">#ffecb3</color>
<color name="AmberL3">#ffe082</color>
<color name="AmberL2">#ffd54f</color>
<color name="AmberL1">#ffca28</color>
<color name="Amber">#ffc107</color>
<color name="AmberS1">#ffb300</color>
<color name="AmberS2">#ffa000</color>
<color name="AmberS3">#ff8f00</color>
<color name="AmberS4">#ff6f00</color>
<color name="AmberA1">#ffe57f</color>
<color name="AmberA2">#ffd740</color>
<color name="AmberA3">#ffc400</color>
<color name="AmberA4">#ffab00</color>
<!-- Orange -->
<color name="OrangeL5">#fff3e0</color>
<color name="OrangeL4">#ffe0b2</color>
<color name="OrangeL3">#ffcc80</color>
<color name="OrangeL2">#ffb74d</color>
<color name="OrangeL1">#ffa726</color>
<color name="Orange">#ff9800</color>
<color name="OrangeS1">#fb8c00</color>
<color name="OrangeS2">#f57c00</color>
<color name="OrangeS3">#ef6c00</color>
<color name="OrangeS4">#e65100</color>
<color name="OrangeA1">#ffd180</color>
<color name="OrangeA2">#ffab40</color>
<color name="OrangeA3">#ff9100</color>
<color name="OrangeA4">#ff6d00</color>
<!-- Green -->
<color name="GreenL5">#d0f8ce</color>
<color name="GreenL4">#a3e9a4</color>
<color name="GreenL3">#72d572</color>
<color name="GreenL2">#42bd41</color>
<color name="GreenL1">#2baf2b</color>
<color name="Green">#259b24</color>
<color name="GreenS1">#0a8f08</color>
<color name="GreenS2">#0a7e07</color>
<color name="GreenS3">#056f00</color>
<color name="GreenS4">#0d5302</color>
<color name="GreenA1">#a2f78d</color>
<color name="GreenA2">#5af158</color>
<color name="GreenA3">#14e715</color>
<color name="GreenA4">#12c700</color>
<!-- LightGreen -->
<color name="LightGreenL5">#f1f8e9</color>
<color name="LightGreenL4">#dcedc8</color>
<color name="LightGreenL3">#c5e1a5</color>
<color name="LightGreenL2">#aed581</color>
<color name="LightGreenL1">#9ccc65</color>
<color name="LightGreen">#8bc34a</color>
<color name="LightGreenS1">#7cb342</color>
<color name="LightGreenS2">#689f38</color>
<color name="LightGreenS3">#558b2f</color>
<color name="LightGreenS4">#33691e</color>
<color name="LightGreenA1">#ccff90</color>
<color name="LightGreenA2">#b2ff59</color>
<color name="LightGreenA3">#76ff03</color>
<color name="LightGreenA4">#64dd17</color>
<!-- Lime -->
<color name="LimeL5">#f9fbe7</color>
<color name="LimeL4">#f0f4c3</color>
<color name="LimeL3">#e6ee9c</color>
<color name="LimeL2">#dce775</color>
<color name="LimeL1">#d4e157</color>
<color name="Lime">#cddc39</color>
<color name="LimeS1">#c0ca33</color>
<color name="LimeS2">#afb42b</color>
<color name="LimeS3">#9e9d24</color>
<color name="LimeS4">#827717</color>
<color name="LimeA1">#f4ff81</color>
<color name="LimeA2">#eeff41</color>
<color name="LimeA3">#c6ff00</color>
<color name="LimeA4">#aeea00</color>
<!-- Blue -->
<color name="BlueL5">#e7e9fd</color>
<color name="BlueL4">#d0d9ff</color>
<color name="BlueL3">#afbfff</color>
<color name="BlueL2">#91a7ff</color>
<color name="BlueL1">#738ffe</color>
<color name="Blue">#5677fc</color>
<color name="BlueS1">#4e6cef</color>
<color name="BlueS2">#455ede</color>
<color name="BlueS3">#3b50ce</color>
<color name="BlueS4">#2a36b1</color>
<color name="BlueA1">#a6baff</color>
<color name="BlueA2">#6889ff</color>
<color name="BlueA3">#4d73ff</color>
<color name="BlueA4">#4d69ff</color>
<!-- Cyan -->
<color name="CyanL5">#e0f7fa</color>
<color name="CyanL4">#b2ebf2</color>
<color name="CyanL3">#80deea</color>
<color name="CyanL2">#4dd0e1</color>
<color name="CyanL1">#26c6da</color>
<color name="Cyan">#00bcd4</color>
<color name="CyanS1">#00acc1</color>
<color name="CyanS2">#0097a7</color>
<color name="CyanS3">#00838f</color>
<color name="CyanS4">#006064</color>
<color name="CyanA1">#84ffff</color>
<color name="CyanA2">#18ffff</color>
<color name="CyanA3">#00e5ff</color>
<color name="CyanA4">#00b8d4</color>
<!-- DeepPurple -->
<color name="DeepPurpleL5">#ede7f6</color>
<color name="DeepPurpleL4">#d1c4e9</color>
<color name="DeepPurpleL3">#b39ddb</color>
<color name="DeepPurpleL2">#9575cd</color>
<color name="DeepPurpleL1">#7e57c2</color>
<color name="DeepPurple">#673ab7</color>
<color name="DeepPurpleS1">#5e35b1</color>
<color name="DeepPurpleS2">#512da8</color>
<color name="DeepPurpleS3">#4527a0</color>
<color name="DeepPurpleS4">#311b92</color>
<color name="DeepPurpleA1">#b388ff</color>
<color name="DeepPurpleA2">#7c4dff</color>
<color name="DeepPurpleA3">#651fff</color>
<color name="DeepPurpleA4">#6200ea</color>
<!-- Indigo -->
<color name="IndigoL5">#e8eaf6</color>
<color name="IndigoL4">#c5cae9</color>
<color name="IndigoL3">#9fa8da</color>
<color name="IndigoL2">#7986cb</color>
<color name="IndigoL1">#5c6bc0</color>
<color name="Indigo">#3f51b5</color>
<color name="IndigoS1">#3949ab</color>
<color name="IndigoS2">#303f9f</color>
<color name="IndigoS3">#283593</color>
<color name="IndigoS4">#1a237e</color>
<color name="IndigoA1">#8c9eff</color>
<color name="IndigoA2">#536dfe</color>
<color name="IndigoA3">#3d5afe</color>
<color name="IndigoA4">#304ffe</color>
<!-- Red -->
<color name="RedL5">#fde0dc</color>
<color name="RedL4">#f9bdbb</color>
<color name="RedL3">#f69988</color>
<color name="RedL2">#f36c60</color>
<color name="RedL1">#e84e40</color>
<color name="Red">#e51c23</color>
<color name="RedS1">#dd191d</color>
<color name="RedS2">#d01716</color>
<color name="RedS3">#c41411</color>
<color name="RedS4">#b0120a</color>
<color name="RedA1">#ff7997</color>
<color name="RedA2">#ff5177</color>
<color name="RedA3">#ff2d6f</color>
<color name="RedA4">#e00032</color>
<!-- Pink -->
<color name="PinkL5">#fce4ec</color>
<color name="PinkL4">#f8bbd0</color>
<color name="PinkL3">#f48fb1</color>
<color name="PinkL2">#f06292</color>
<color name="PinkL1">#ec407a</color>
<color name="Pink">#e91e63</color>
<color name="PinkS1">#d81b60</color>
<color name="PinkS2">#c2185b</color>
<color name="PinkS3">#ad1457</color>
<color name="PinkS4">#880e4f</color>
<color name="PinkA1">#ff80ab</color>
<color name="PinkA2">#ff4081</color>
<color name="PinkA3">#f50057</color>
<color name="PinkA4">#c51162</color>
<!-- Purple -->
<color name="PurpleL5">#f3e5f5</color>
<color name="PurpleL4">#e1bee7</color>
<color name="PurpleL3">#ce93d8</color>
<color name="PurpleL2">#ba68c8</color>
<color name="PurpleL1">#ab47bc</color>
<color name="Purple">#9c27b0</color>
<color name="PurpleS1">#8e24aa</color>
<color name="PurpleS2">#7b1fa2</color>
<color name="PurpleS3">#6a1b9a</color>
<color name="PurpleS4">#4a148c</color>
<color name="PurpleA1">#ea80fc</color>
<color name="PurpleA2">#e040fb</color>
<color name="PurpleA3">#d500f9</color>
<color name="PurpleA4">#aa00ff</color>
<!-- LightBlue -->
<color name="LightBlueL5">#e1f5fe</color>
<color name="LightBlueL4">#b3e5fc</color>
<color name="LightBlueL3">#81d4fa</color>
<color name="LightBlueL2">#4fc3f7</color>
<color name="LightBlueL1">#29b6f6</color>
<color name="LightBlue">#03a9f4</color>
<color name="LightBlueS1">#039be5</color>
<color name="LightBlueS2">#0288d1</color>
<color name="LightBlueS3">#0277bd</color>
<color name="LightBlueS4">#01579b</color>
<color name="LightBlueA1">#80d8ff</color>
<color name="LightBlueA2">#40c4ff</color>
<color name="LightBlueA3">#00b0ff</color>
<color name="LightBlueA4">#0091ea</color>
<!-- Teal -->
<color name="TealL5">#e0f2f1</color>
<color name="TealL4">#b2dfdb</color>
<color name="TealL3">#80cbc4</color>
<color name="TealL2">#4db6ac</color>
<color name="TealL1">#26a69a</color>
<color name="Teal">#009688</color>
<color name="TealS1">#00897b</color>
<color name="TealS2">#00796b</color>
<color name="TealS3">#00695c</color>
<color name="TealS4">#004d40</color>
<color name="TealA1">#a7ffeb</color>
<color name="TealA2">#64ffda</color>
<color name="TealA3">#1de9b6</color>
<color name="TealA4">#00bfa5</color>
<!-- Blue Gray -->
<color name="BlueGreyL5">#eceff1</color>
<color name="BlueGreyL4">#cfd8dc</color>
<color name="BlueGreyL3">#b0bec5</color>
<color name="BlueGreyL2">#90a4ae</color>
<color name="BlueGreyL1">#78909c</color>
<color name="BlueGrey">#607d8b</color>
<color name="BlueGreyS1">#607d8b</color>
<color name="BlueGreyS2">#546e7a</color>
<color name="BlueGreyS3">#455a64</color>
<color name="BlueGreyS4">#37474f</color>
<color name="BlueGreyS5">#263238</color>
<!-- Brown -->
<color name="BrownL5">#efebe9</color>
<color name="BrownL4">#d7ccc8</color>
<color name="BrownL3">#bcaaa4</color>
<color name="BrownL2">#a1887f</color>
<color name="BrownL1">#8d6e63</color>
<color name="Brown">#795548</color>
<color name="BrownS1">#6d4c41</color>
<color name="BrownS2">#5d4037</color>
<color name="BrownS3">#4e342e</color>
<color name="BrownS4">#3e2723</color>
... oder hier in einer Datei
Beste Grüße
Martin
— geändert am 30.10.2014, 19:41:10
Open Source
Empfohlener redaktioneller Inhalt
Mit Deiner Zustimmung wird hier ein externer Inhalt geladen.
Mit Klick auf den oben stehenden Button erklärst Du Dich damit einverstanden, dass Dir externe Inhalte angezeigt werden dürfen. Dabei können personenbezogene Daten an Drittanbieter übermittelt werden. Mehr Infos dazu findest Du in unserer Datenschutzerklärung.