Benutzer:Christian/Farbenvielfalt: Unterschied zwischen den Versionen

Aus ZUM-Unterrichten
(Die Seite wurde neu angelegt: „ == Sollpalette == Vorgeschlagene Palette aus Trello: [http://paletton.com/#uid=41t0X0kloufbJLah7A6qcrMsJlS] Primär (gelb) {|style="width:100%;vertical-alig…“)
 
KKeine Bearbeitungszusammenfassung
 
(7 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
== todo ==
* Icons durchgehen
* [[:Kategorie:Vorlage/Farben/Todo]]


== Sollpalette ==
== Sollpalette ==


Vorgeschlagene Palette aus Trello: [http://paletton.com/#uid=41t0X0kloufbJLah7A6qcrMsJlS]
Vorgeschlagene [http://paletton.com/#uid=41t0X0kloufbJLah7A6qcrMsJlS Palette aus Trello]


Primär (gelb)
{|style="width:100%;vertical-align:middle;text-align:center;" class="wikitable"
{|style="width:100%;vertical-align:middle;text-align:center;" class="wikitable"
!|Farbe
!|Farbe
Zeile 40: Zeile 42:
|style="background:#482998;color:white;"|#482998
|style="background:#482998;color:white;"|#482998
|style="background:#321878;color:white;"|#321878
|style="background:#321878;color:white;"|#321878
|-
|colspan=6|
Problem: Es ''"fehlt"'' ein orange und ein grün.
Lösung: Konstruktion einer [http://paletton.com/#uid=40x0X0kloufbJLah7A6qcrMsJlS gedrehten Palette]
|-
!style="height:3em"|orange
|style="background:#FFCEA2"|#FFCEA2
|style="background:#FFB877"|#FFB877
|style="background:#F19D50"|#F19D50
|style="background:#DD7F28;color:white;"|#DD7F28
|style="background:#AE5D12;color:white;"|#AE5D12
|-
!style="height:3em"|grün
|style="background:#D4F69C"|#D4F69C
|style="background:#C0EF6F"|#C0EF6F
|style="background:#A8DF4A"|#A8DF4A
|style="background:#8FCD25;color:white;"|#8FCD25
|style="background:#6CA111;color:white;"|#6CA111
|-
|colspan=6|
Dazu kommen noch die Standard Linkfarben.
|-
!style="height:3em"|Linkfarben
|
|
|style="background:#0077dd"|#0077dd
|
|style="background:#005599;color:white;"|#005599
|-
|colspan=6|
Und passende Grautöne in passender Helligkeit zur Primärfarbe
|-
!style="height:3em"|Grautöne
|style="background:#F1F1F1"|#F1F1F1
|style="background:#ECECEC"|#ECECEC
|style="background:#DBDBDB"|#DBDBDB
|style="background:#C8C8C8;color:white;"|#C8C8C8
|style="background:#a0a0a0;color:white;"|#a0a0a0
|}
== Ist-zustand + Änderungsvorschläge ==
{|style="width:100%;background:white;" class="wikitable"
!Typ
!colspan="3"|aktuell
!colspan="3"|Vorschlag<br/>anhand der<br/>Farbpalette
!Anmerkungen
|-
!Linkfarbe
|[[ #Ist-zustand | self]]</span>
|style="background:#0077dd;"|#0077dd
|style="color:#0077dd;"|#0077dd
|
|
|
|
|-
!Linkfarbe (besucht)
|[[ #Ist-zustand | self]]</span>
|style="background:#005599;"|#005599
|style="color:#005599;"|#005599
|
|
|
|
|-
!Fächericon Mint
|<span class="subjects mint">[[ #Ist-zustand | <span class="brainy hdg-calculator"></span>]]</span>
|style="background:#008b8b;"|#008b8b
|style="color:#008b8b;"|#008b8b
|
|style="background:#338894;"|#338894
|style="color:#338894;"|#338894
|Farbe ist definiert per CSS -> IdeaSketch
|-
!Fächericon Geist
|<span class="subjects geist">[[ #Ist-zustand | <span class="brainy hdg-calculator"></span>]]</span>
|style="background:#d2691e;"|#d2691e
|style="color:#d2691e;"|#d2691e
|
|style="background:#F19D50;"|#F19D50
|style="color:#F19D50;"|#F19D50
|Farbe ist definiert per CSS -> IdeaSketch
|-
!Fächericon Sprachen
|<span class="subjects sprachen">[[ #Ist-zustand | <span class="brainy hdg-calculator"></span>]]</span>
|style="background:#8b008b;"|#8b008b
|style="color:#8b008b;"|#8b008b
|
|style="background:#C64285;"|#C64285
|style="color:#C64285;"|#C64285
|Farbe ist definiert per CSS -> IdeaSketch
|-
!Fächericon Musisch
|<span class="subjects musisch">[[ #Ist-zustand | <span class="brainy hdg-calculator"></span>]]</span>
|style="background:#6b8e23;"|#6b8e23
|style="color:#6b8e23;"|#6b8e23
|
|style="background:#A8DF4A;"|#A8DF4A
|style="color:#A8DF4A;"|#A8DF4A
|Farbe ist definiert per CSS -> IdeaSketch
|-
!Iconfarben
|[[File:Pfad-Icon.svg|60px|link=]]
|style="background:#5aaf24;"|#5aaf24
|style="color:#5aaf24;"|#5aaf24
|[[File:Christian-Pfad-Icon.svg|60px|link=]]
|style="background:#8FCD25;"|#8FCD25
|style="color:#8FCD25;"|#8FCD25
|Icons müssen angepasst werden. -> [[Benutzer:Christian]]
|-
!Iconfarben
|[[File:Pfad-Icon.svg|60px|link=]]
|style="background:#5aaf24;"|#5aaf24
|style="color:#5aaf24;"|#5aaf24
|[[File:Christian-2-Pfad-Icon.svg|60px|link=]]
|style="background:#6CA111;"|#6CA111
|style="color:#6CA111;"|#6CA111
|Icon SVGs müssen angepasst werden. -> [[Benutzer:Christian]]
|-
!Box:Hervorhebung1
|
|style="background:#f1d650;"|#f1d650
|style="color:#f1d650;"|#f1d650
|
|style="background:#F1D850;"|#F1D850
|style="color:#F1D850;"|#F1D850
|
|-
!Box:Frage
|
|style="background:#ffdc00;"|#ffdc00
|style="color:#ffdc00;"|#ffdc00
|
|style="background:#F1D850;"|#F1D850
|style="color:#F1D850;"|#F1D850
|
|-
!Box:Hervorhebung2
|
|style="background:#c34188;"|#c34188
|style="color:#c34188;"|#c34188
|
|style="background:#C64285;"|#C64285
|style="color:#C64285;"|#C64285
|
|-
!Box:Merksatz
|
|style="background:#c34188;"|#c34188
|style="color:#c34188;"|#c34188
|
|style="background:#C64285;"|#C64285
|style="color:#C64285;"|#C64285
|
|-
!Box:Arbeitsmethode
|
|style="background:#5c43a6;"|#5c43a6
|style="color:#5c43a6;"|#5c43a6
|
|style="background:#5E43A5;"|#5E43A5
|style="color:#5E43A5;"|#5E43A5
|
|-
!Box:Unterrichtsidee
|
|style="background:#ade04a;"|#ade04a
|style="color:#ade04a;"|#ade04a
|
|style="background:#A8DF4A;"|#A8DF4A
|style="color:#A8DF4A;"|#A8DF4A
|
|-
!Box:Experimentieren
|
|style="background:#ade04a;"|#ade04a
|style="color:#ade04a;"|#ade04a
|
|style="background:#A8DF4A;"|#A8DF4A
|style="color:#A8DF4A;"|#A8DF4A
|
|-
!Box:Lernpfad
|
|style="background:#f19a50;"|#f19a50
|style="color:#f19a50;"|#f19a50
|
|style="background:#F19D50;"|#F19D50
|style="color:#F19D50;"|#F19D50
|
|-
!Box:Üben
|
|style="background:#318d92;"|#318d92
|style="color:#318d92;"|#318d92
|
|style="background:#338894;"|#338894
|style="color:#338894;"|#338894
|
|-
!Box:Meinung
|
|style="background:#cccccc;"|#cccccc
|style="color:#cccccc;"|#cccccc
|
|style="background:#DBDBDB;"|#DBDBDB
|style="color:#DBDBDB;"|#DBDBDB
|
|-
!Box:Lösung
|
|style="background:#cccccc;"|#cccccc
|style="color:#cccccc;"|#cccccc
|
|style="background:#DBDBDB;"|#DBDBDB
|style="color:#DBDBDB;"|#DBDBDB
|
|-
!Box:Download
|
|style="background:#cccccc;"|#cccccc
|style="color:#cccccc;"|#cccccc
|
|style="background:#DBDBDB;"|#DBDBDB
|style="color:#DBDBDB;"|#DBDBDB
|
|-
!Box:Kurzinfo
|
|style="background:#cccccc;"|#cccccc
|style="color:#cccccc;"|#cccccc
|
|style="background:#DBDBDB;"|#DBDBDB
|style="color:#DBDBDB;"|#DBDBDB
|
|-
!Box:Zitat
|
|style="background:#aaaaaa;"|#aaaaaa
|style="color:#aaaaaa;"|#aaaaaa
|
|style="background:#a0a0a0;"|#a0a0a0
|style="color:#a0a0a0;"|#a0a0a0
|
|-
!Box:unspezifisch
|
|style="background:#eeeeee;"|#eeeeee
|style="color:#eeeeee;"|#eeeeee
|
|style="background:#ECECEC;"|#ECECEC
|style="color:#ECECEC;"|#ECECEC
|
|}
|}

Aktuelle Version vom 12. Oktober 2018, 20:23 Uhr

todo

Sollpalette

Vorgeschlagene Palette aus Trello

Farbe Heller-2 Heller Grundton Dunkler Dunkler-2
primär #FFF0A2 #FFEA77 #F1D850 #DDC128 #AE9612
sekundär-1 #E993BF #D965A0 #C64285 #B6216D #8F0F50
sekundär-2 #84C5CE #52A1AC #338894 #1B7A88 #0D5F6B
komplementär #A591D7 #7B62BC #5E43A5 #482998 #321878

Problem: Es "fehlt" ein orange und ein grün. Lösung: Konstruktion einer gedrehten Palette

orange #FFCEA2 #FFB877 #F19D50 #DD7F28 #AE5D12
grün #D4F69C #C0EF6F #A8DF4A #8FCD25 #6CA111

Dazu kommen noch die Standard Linkfarben.

Linkfarben #0077dd #005599

Und passende Grautöne in passender Helligkeit zur Primärfarbe

Grautöne #F1F1F1 #ECECEC #DBDBDB #C8C8C8 #a0a0a0

Ist-zustand + Änderungsvorschläge

Typ aktuell Vorschlag
anhand der
Farbpalette
Anmerkungen
Linkfarbe self #0077dd #0077dd
Linkfarbe (besucht) self #005599 #005599
Fächericon Mint #008b8b #008b8b #338894 #338894 Farbe ist definiert per CSS -> IdeaSketch
Fächericon Geist #d2691e #d2691e #F19D50 #F19D50 Farbe ist definiert per CSS -> IdeaSketch
Fächericon Sprachen #8b008b #8b008b #C64285 #C64285 Farbe ist definiert per CSS -> IdeaSketch
Fächericon Musisch #6b8e23 #6b8e23 #A8DF4A #A8DF4A Farbe ist definiert per CSS -> IdeaSketch
Iconfarben Pfad-Icon.svg #5aaf24 #5aaf24 Christian-Pfad-Icon.svg #8FCD25 #8FCD25 Icons müssen angepasst werden. -> Benutzer:Christian
Iconfarben Pfad-Icon.svg #5aaf24 #5aaf24 Christian-2-Pfad-Icon.svg #6CA111 #6CA111 Icon SVGs müssen angepasst werden. -> Benutzer:Christian
Box:Hervorhebung1 #f1d650 #f1d650 #F1D850 #F1D850
Box:Frage #ffdc00 #ffdc00 #F1D850 #F1D850
Box:Hervorhebung2 #c34188 #c34188 #C64285 #C64285
Box:Merksatz #c34188 #c34188 #C64285 #C64285
Box:Arbeitsmethode #5c43a6 #5c43a6 #5E43A5 #5E43A5
Box:Unterrichtsidee #ade04a #ade04a #A8DF4A #A8DF4A
Box:Experimentieren #ade04a #ade04a #A8DF4A #A8DF4A
Box:Lernpfad #f19a50 #f19a50 #F19D50 #F19D50
Box:Üben #318d92 #318d92 #338894 #338894
Box:Meinung #cccccc #cccccc #DBDBDB #DBDBDB
Box:Lösung #cccccc #cccccc #DBDBDB #DBDBDB
Box:Download #cccccc #cccccc #DBDBDB #DBDBDB
Box:Kurzinfo #cccccc #cccccc #DBDBDB #DBDBDB
Box:Zitat #aaaaaa #aaaaaa #a0a0a0 #a0a0a0
Box:unspezifisch #eeeeee #eeeeee #ECECEC #ECECEC