Farbe
Aus RMG-Wiki
Die Vorlage Farbe gibt dir eine Farbe aus dem ZUM-Farbschema zurück. Bitte verwende wenn möglich Farben mit Bedeutung, da sie leichter zu pflegen sind.
Es gibt sowohl Farbnamen mit Bedeutung als auch das vollständige Farbschema. Die Vorlage verwendet bis zu 2 Parameter. Der erste Parameter ist der Farbname, der zweite kann verwendet werden um hellere oder dunklere Töne zu erhalten.
Farben mit Bedeutung sollten, wenn möglich, nicht mit Helligkeitsangaben modifiziert werden.
- Farbnamen mit Bedeutung
- Hervorhebung1, Frage, Lernpfad, Hervorhebung2, Merksatz, Üben, Arbeitsmethode, Unterrichtsidee, Experimentieren, Arbeitsmethode, Unterrichtsidee, Experimentieren, Meinung, Lösung, Download, Kurzinfo, Zitat
- Farbnamen aus dem Farbschema
- primär, sekundär-1, sekundär-2, komplementär, orange, grün, grau
- Helligkeitsangaben
- heller, hell, dunkel, dunkler
Beispiele
Farbtabellen
Farben mit Bedeutung
Hervorhebung1 | Vorlage:Farbe/Beispiel | Frage | Vorlage:Farbe/Beispiel |
---|---|---|---|
Lernpfad | Vorlage:Farbe/Beispiel | Hervorhebung2 | Vorlage:Farbe/Beispiel |
Merksatz | Vorlage:Farbe/Beispiel | Üben | Vorlage:Farbe/Beispiel |
Arbeitsmethode | Vorlage:Farbe/Beispiel | Unterrichtsidee | Vorlage:Farbe/Beispiel |
Experimentieren | Vorlage:Farbe/Beispiel | Meinung | Vorlage:Farbe/Beispiel |
Lösung | Vorlage:Farbe/Beispiel | Download | Vorlage:Farbe/Beispiel |
Kurzinfo | Vorlage:Farbe/Beispiel | Zitat | Vorlage:Farbe/Beispiel |
Farbschema
CSS Code for Common.css
/* Bedeutungsfarben */ .zum-farbe-Hervorhebung1 { color:#F1D850; } .zum-farbe-Frage { color:#F1D850; } .zum-farbe-Lernpfad { color:#F19D50; } .zum-farbe-Hervorhebung2 { color:#C64285; } .zum-farbe-Merksatz { color:#C64285; } .zum-farbe-Üben, .zum-farbe-Ueben { color:#338894; } .zum-farbe-Arbeitsmethode { color:#5E43A5; } .zum-farbe-Unterrichtsidee { color:#A8DF4A; } .zum-farbe-Experimentieren { color:#A8DF4A; } .zum-farbe-Arbeitsmethode { color:#5E43A5; } .zum-farbe-Unterrichtsidee { color:#A8DF4A; } .zum-farbe-Experimentieren { color:#A8DF4A; } .zum-farbe-Meinung { color:#DBDBDB; } .zum-farbe-Lösung, .zum-farbe-Loesung { color:#DBDBDB; } .zum-farbe-Download { color:#DBDBDB; } .zum-farbe-Kurzinfo { color:#DBDBDB; } .zum-farbe-Zitat { color:#a0a0a0; } .zum-hintergrund-Hervorhebung1 { background-color:#F1D850; } .zum-hintergrund-Frage { background-color:#F1D850; } .zum-hintergrund-Lernpfad { background-color:#F19D50; } .zum-hintergrund-Hervorhebung2 { background-color:#C64285; } .zum-hintergrund-Merksatz { background-color:#C64285; } .zum-hintergrund-Üben, .zum-hintergrund-Ueben { background-color:#338894; } .zum-hintergrund-Arbeitsmethode { background-color:#5E43A5; } .zum-hintergrund-Unterrichtsidee { background-color:#A8DF4A; } .zum-hintergrund-Experimentieren { background-color:#A8DF4A; } .zum-hintergrund-Arbeitsmethode { background-color:#5E43A5; } .zum-hintergrund-Unterrichtsidee { background-color:#A8DF4A; } .zum-hintergrund-Experimentieren { background-color:#A8DF4A; } .zum-hintergrund-Meinung { background-color:#DBDBDB; } .zum-hintergrund-Lösung, .zum-hintergrund-Loesung { background-color:#DBDBDB; } .zum-hintergrund-Download { background-color:#DBDBDB; } .zum-hintergrund-Kurzinfo { background-color:#DBDBDB; } .zum-hintergrund-Zitat { background-color:#a0a0a0; } /* komplettes Farbschema */ .zum-farbe-primär { color: #F1D850; } .zum-farbe-primär.zum-farbe-xx-heller { color: #fffcf0; } .zum-farbe-primär.zum-farbe-x-heller { color: #fff6cc; } .zum-farbe-primär.zum-farbe-heller { color: #FFF0A2; } .zum-farbe-primär.zum-farbe-hell { color: #FFEA77; } .zum-farbe-primär.zum-farbe-dunkel { color: #DEC229; } .zum-farbe-primär.zum-farbe-dunkler { color: #AF9612; } .zum-farbe-sekundär-1 { color: #C64285; } .zum-farbe-sekundär-1.zum-farbe-xx-heller { color: #f7d9e8; } .zum-farbe-sekundär-1.zum-farbe-x-heller { color: #f1bbd6; } .zum-farbe-sekundär-1.zum-farbe-heller { color: #E994BF; } .zum-farbe-sekundär-1.zum-farbe-hell { color: #D965A0; } .zum-farbe-sekundär-1.zum-farbe-dunkel { color: #B6226D; } .zum-farbe-sekundär-1.zum-farbe-dunkler { color: #900F50; } .zum-farbe-sekundär-2 { color: #338894; } .zum-farbe-sekundär-2.zum-farbe-xx-heller { color: #c4e3e8; } .zum-farbe-sekundär-2.zum-farbe-x-heller { color: #a7d6dd; } .zum-farbe-sekundär-2.zum-farbe-heller { color: #85C5CF; } .zum-farbe-sekundär-2.zum-farbe-hell { color: #52A1AD; } .zum-farbe-sekundär-2.zum-farbe-dunkel { color: #1B7A88; } .zum-farbe-sekundär-2.zum-farbe-dunkler { color: #0D5F6B; } .zum-farbe-komplementär { color: #5E43A5; } .zum-farbe-komplementär.zum-farbe-xx-heller { color: #dad2ee; } .zum-farbe-komplementär.zum-farbe-x-heller { color: #c2b5e3; } .zum-farbe-komplementär.zum-farbe-heller { color: #A592D7; } .zum-farbe-komplementär.zum-farbe-hell { color: #7B63BC; } .zum-farbe-komplementär.zum-farbe-dunkel { color: #482998; } .zum-farbe-komplementär.zum-farbe-dunkler { color: #331878; } .zum-farbe-orange { color: #F19D50; } .zum-farbe-orange.zum-farbe-xx-heller { color: #fffcfa; } .zum-farbe-orange.zum-farbe-x-heller { color: #ffe7d1; } .zum-farbe-orange.zum-farbe-heller { color: #FFCEA2; } .zum-farbe-orange.zum-farbe-hell { color: #FFB877; } .zum-farbe-orange.zum-farbe-dunkel { color: #DD7F28; } .zum-farbe-orange.zum-farbe-dunkler { color: #AE5D12; } .zum-farbe-grün { color: #A8DF4A; } .zum-farbe-grün.zum-farbe-xx-heller { color: #f7fdec; } .zum-farbe-grün.zum-farbe-x-heller { color: #e6fac7; } .zum-farbe-grün.zum-farbe-heller { color: #D4F69C; } .zum-farbe-grün.zum-farbe-hell { color: #C0EF6F; } .zum-farbe-grün.zum-farbe-dunkel { color: #8FCD25; } .zum-farbe-grün.zum-farbe-dunkler { color: #6CA111; } .zum-farbe-grau { color: #DBDBDB; } .zum-farbe-grau.zum-farbe-xx-heller { color: #fcfcfc; } .zum-farbe-grau.zum-farbe-x-heller { color: #f7f7f7; } .zum-farbe-grau.zum-farbe-heller { color: #F1F1F1; } .zum-farbe-grau.zum-farbe-heller { color: #F1F1F1; } .zum-farbe-grau.zum-farbe-heller { color: #F1F1F1; } .zum-farbe-grau.zum-farbe-hell { color: #ececec; } .zum-farbe-grau.zum-farbe-dunkel { color: #C8C8C8; } .zum-farbe-grau.zum-farbe-dunkler { color: #a0a0a0; } .zum-farbe-links { color: #0077dd; } .zum-farbe-links.zum-farbe-xx-heller { color: #f5faff; } .zum-farbe-links.zum-farbe-x-heller { color: #cce7ff; } .zum-farbe-links.zum-farbe-heller { color: #47a9ff; } .zum-farbe-links.zum-farbe-heller { color: #47a9ff; } .zum-farbe-links.zum-farbe-heller { color: #47a9ff; } .zum-farbe-links.zum-farbe-hell { color: #1492ff; } .zum-farbe-links.zum-farbe-dunkel { color: #0068bd; } .zum-farbe-links.zum-farbe-dunkler { color: #005599; } . .zum-hintergrund-primär { background-color: #F1D850; } .zum-hintergrund-primär.zum-farbe-xx-heller { background-color: #fffcf0; } .zum-hintergrund-primär.zum-farbe-x-heller { background-color: #fff6cc; } .zum-hintergrund-primär.zum-farbe-heller { background-color: #FFF0A2; } .zum-hintergrund-primär.zum-farbe-hell { background-color: #FFEA77; } .zum-hintergrund-primär.zum-farbe-dunkel { background-color: #DEC229; } .zum-hintergrund-primär.zum-farbe-dunkler { background-color: #AF9612; } .zum-hintergrund-sekundär-1 { background-color: #C64285; } .zum-hintergrund-sekundär-1.zum-farbe-xx-heller { background-color: #f7d9e8; } .zum-hintergrund-sekundär-1.zum-farbe-x-heller { background-color: #f1bbd6; } .zum-hintergrund-sekundär-1.zum-farbe-heller { background-color: #E994BF; } .zum-hintergrund-sekundär-1.zum-farbe-hell { background-color: #D965A0; } .zum-hintergrund-sekundär-1.zum-farbe-dunkel { background-color: #B6226D; } .zum-hintergrund-sekundär-1.zum-farbe-dunkler { background-color: #900F50; } .zum-hintergrund-sekundär-2 { background-color: #338894; } .zum-hintergrund-sekundär-2.zum-farbe-xx-heller { background-color: #c4e3e8; } .zum-hintergrund-sekundär-2.zum-farbe-x-heller { background-color: #a7d6dd; } .zum-hintergrund-sekundär-2.zum-farbe-heller { background-color: #85C5CF; } .zum-hintergrund-sekundär-2.zum-farbe-hell { background-color: #52A1AD; } .zum-hintergrund-sekundär-2.zum-farbe-dunkel { background-color: #1B7A88; } .zum-hintergrund-sekundär-2.zum-farbe-dunkler { background-color: #0D5F6B; } .zum-hintergrund-komplementär { background-color: #5E43A5; } .zum-hintergrund-komplementär.zum-farbe-xx-heller { background-color: #dad2ee; } .zum-hintergrund-komplementär.zum-farbe-x-heller { background-color: #c2b5e3; } .zum-hintergrund-komplementär.zum-farbe-heller { background-color: #A592D7; } .zum-hintergrund-komplementär.zum-farbe-hell { background-color: #7B63BC; } .zum-hintergrund-komplementär.zum-farbe-dunkel { background-color: #482998; } .zum-hintergrund-komplementär.zum-farbe-dunkler { background-color: #331878; } .zum-hintergrund-orange { background-color: #F19D50; } .zum-hintergrund-orange.zum-farbe-xx-heller { background-color: #fffcfa; } .zum-hintergrund-orange.zum-farbe-x-heller { background-color: #ffe7d1; } .zum-hintergrund-orange.zum-farbe-heller { background-color: #FFCEA2; } .zum-hintergrund-orange.zum-farbe-hell { background-color: #FFB877; } .zum-hintergrund-orange.zum-farbe-dunkel { background-color: #DD7F28; } .zum-hintergrund-orange.zum-farbe-dunkler { background-color: #AE5D12; } .zum-hintergrund-grün { background-color: #A8DF4A; } .zum-hintergrund-grün.zum-farbe-xx-heller { background-color: #f7fdec; } .zum-hintergrund-grün.zum-farbe-x-heller { background-color: #e6fac7; } .zum-hintergrund-grün.zum-farbe-heller { background-color: #D4F69C; } .zum-hintergrund-grün.zum-farbe-hell { background-color: #C0EF6F; } .zum-hintergrund-grün.zum-farbe-dunkel { background-color: #8FCD25; } .zum-hintergrund-grün.zum-farbe-dunkler { background-color: #6CA111; } .zum-hintergrund-grau { background-color: #DBDBDB; } .zum-hintergrund-grau.zum-farbe-xx-heller { background-color: #fcfcfc; } .zum-hintergrund-grau.zum-farbe-x-heller { background-color: #f7f7f7; } .zum-hintergrund-grau.zum-farbe-heller { background-color: #F1F1F1; } .zum-hintergrund-grau.zum-farbe-hell { background-color: #ececec; } .zum-hintergrund-grau.zum-farbe-dunkel { background-color: #C8C8C8; } .zum-hintergrund-grau.zum-farbe-dunkler { background-color: #a0a0a0; } .zum-hintergrund-links { background-color: #0077dd; } .zum-hintergrund-links.zum-farbe-xx-heller { background-color: #f5faff; } .zum-hintergrund-links.zum-farbe-x-heller { background-color: #cce7ff; } .zum-hintergrund-links.zum-farbe-heller { background-color: #47a9ff; } .zum-hintergrund-links.zum-farbe-hell { background-color: #1492ff; } .zum-hintergrund-links.zum-farbe-dunkel { background-color: #0068bd; } .zum-hintergrund-links.zum-farbe-dunkler { background-color: #005599; } /* overrides * uses mediawiki parent selector to establish override */ .mediawiki .box.hervorhebung1 { border-left-color:#F1D850; } .mediawiki .box.frage { border-left-color:#F1D850; } .mediawiki .box.lernpfad { border-left-color:#F19D50; } .mediawiki .box.hervorhebung2 { border-left-color:#C64285; } .mediawiki .box.merksatz { border-left-color:#C64285; } .mediawiki .box.üben, .mediawiki .box.ueben { border-left-color:#338894; } .mediawiki .box.arbeitsmethode { border-left-color:#5E43A5; } .mediawiki .box.unterrichtsidee { border-left-color:#A8DF4A; } .mediawiki .box.experimentieren { border-left-color:#A8DF4A; } .mediawiki .box.arbeitsmethode { border-left-color:#5E43A5; } .mediawiki .box.unterrichtsidee { border-left-color:#A8DF4A; } .mediawiki .box.experimentieren { border-left-color:#A8DF4A; } .mediawiki .box.meinung { border-left-color:#DBDBDB; } .mediawiki .box.lösung, .mediawiki .box.loesung { border-left-color:#DBDBDB; } .mediawiki .box.download { border-left-color:#DBDBDB; } .mediawiki .box.kurzinfo { border-left-color:#DBDBDB; } .mediawiki .box.zitat { border-left-color:#a0a0a0; } .mediawiki .button-left a, .mediawiki .button-center a, .mediawiki .button-right a { background-color: #DBDBDB; } .mediawiki .button-left a:hover, .mediawiki .button-left a:focus, .mediawiki .button-center a:hover, .mediawiki .button-center a:focus, .mediawiki .button-right a:hover, .mediawiki .button-right a:focus { background-color: #ececec; } .mediawiki .button-left.button-primary a, .mediawiki .button-center.button-primary a, .mediawiki .button-right.button-primary a { background-color: #0068bd; } .mediawiki .button-left.button-primary a:hover, .mediawiki .button-left.button-primary a:focus, .mediawiki .button-center.button-primary a:hover, .mediawiki .button-center.button-primary a:focus, .mediawiki .button-right.button-primary a:hover .mediawiki .button-right.button-primary a:focus { background-color: #1492ff; } .mediawiki .uk-text-muted { color: #a0a0a0 !important; } .mediawiki .uk-text-primary { color: #1B7A88 !important; } .mediawiki .uk-text-success { color: #6CA111 !important; } .mediawiki .uk-text-warning { color: #AE5D12 !important; } .mediawiki .uk-text-danger { color: #B6226D !important; } .mediawiki .uk-text-contrast { color: #fff !important; } .mediawiki .uk-button { background-color: #DBDBDB; } .mediawiki .uk-button:hover, .mediawiki .uk-button:focus { background-color: #ececec; } .mediawiki .uk-button.uk-active, .mediawiki .uk-button:active { background-color: #F1F1F1; } .mediawiki .uk-button-primary { background-color: #0068bd; } .mediawiki .uk-button-primary:hover, .mediawiki .uk-button-primary:focus { background-color: #0077dd; } .mediawiki .uk-button-primary.uk-active, .mediawiki .uk-button-primary:active { background-color: #1492ff; } .mediawiki .uk-button-success { background-color: #6CA111; } .mediawiki .uk-button-success:hover, .mediawiki .uk-button-success:focus { background-color: #8FCD25; } .mediawiki .uk-button-success.uk-active, .mediawiki .uk-button-success:active { background-color: #A8DF4A; } .mediawiki .uk-button-danger { background-color: #B6226D; } .mediawiki .uk-button-danger:hover, .mediawiki .uk-button-danger:focus { background-color: #C64285; } .mediawiki .uk-button-danger.uk-active, .mediawiki .uk-button-danger:active { background-color: #D965A0; } .mediawiki .uk-button-link { color: #0068bd; } .mediawiki .uk-button-link:hover, .mediawiki .uk-button-link:focus, .mediawiki .uk-button-link.uk-active, .mediawiki .uk-button-link:active { color: #0077dd; } .mediawiki .uk-button:disabled { background-color: #ececec; } .mediawiki .uk-button-link:disabled { color: #ececec; }