Fandom

Wikia Deutschland

Hilfe:Farben

2.473Seiten in
diesem Wiki
Seite hinzufügen
Diskussion25 Teilen
Malaga rainbow.jpg

Farben nach Lust und Laune

Zum Gestalten von Wikis, Wikiseiten und Seitentext gehören auch Farben dazu. Sowohl im Theme-Designer als auch mittels CSS können Farben für Text, Hintergründe und mehr gesetzt werden.

Anmerkung: Einfärbungen mittels CSS werden auf Mobilgeräten nicht angezeigt!

Auf dieser Seite steht eine Tabelle mit Farbnamen, die man auch im Theme-Designer eingeben kann, sowie ein kurzer Crashkurs übers Einfärben in der Code-Ansicht.

Crashkurs: Text und Hintergrund färben Bearbeiten

Um Flächen oder Text mit Farben zu versehen, erlaubt die Fandom-Software Inline-CSS. Das sieht dann so aus:

Verwendung Wikitext-Beispiel Ergebnis-Beispiel
Farbiger Text <span style="color:green;">Text</span> Text
Farbiger Absatz <div style="color:green;">Absatz</div>
Absatz
Hintergrund weniger Worte <span style="background-color:lawngreen;">Beispiel</span> Beispiel
Hintergrund eines Absatzes <div style="background-color:lawngreen;">Absatz</div>
Absatz
Hintergrund einer Tabellenzelle | style="background-color:aquamarine;" | Tabellenzelle Tabellenzelle

Farbnamen Bearbeiten

Dies sind alle Farben, die man per Namen eingeben kann.

black indianred floralwhite olivedrab darkcyan blue
dimgray crimson linen yellowgreen cadetblue mediumblue
gray firebrick oldlace limegreen lightseagreen darkblue
darkgray darkred cornsilk lime darkturquoise navy
silver red antiquewhite lawngreen mediumturquoise midnightblue
lightgray orangered blanchedalmond chartreuse turquoise mediumslateblue
gainsboro tomato bisque greenyellow aquamarine slateblue
whitesmoke coral navajowhite springgreen mintcream darkslateblue
white darkorange wheat mediumspringgreen paleturquoise indigo
snow orange burlywood lightgreen azure purple
seashell yellow tan palegreen lightcyan darkmagenta
lavenderblush lightyellow rosybrown honeydew cyan darkorchid
mistyrose ivory sandybrown darkseagreen aliceblue darkviolet
pink lemonchiffon goldenrod mediumaquamarine lightsteelblue blueviolet
lightpink lightgoldenrodyellow darkgoldenrod mediumseagreen powderblue mediumpurple
hotpink beige peru seagreen lightblue mediumorchid
deeppink papayawhip chocolate forestgreen skyblue magenta
palevioletred moccasin saddlebrown green lightskyblue orchid
mediumvioletred peachpuff sienna darkgreen deepskyblue violet
lightsalmon palegoldenrod brown lightslategray dodgerblue plum
salmon khaki maroon slategray cornflowerblue thistle
darksalmon darkkhaki darkolivegreen darkslategray steelblue lavender
lightcoral gold olive teal royalblue ghostwhite

Andere Codierungsmöglichkeiten Bearbeiten

Statt vordefinierten Farbnamen kann man sich auch eigene Farben zusammenstellen. Statt style="color:blue;" schreibt man dann style="color:rgb(0,0,255);".

HEX Bearbeiten

Codes im Hexadezimalformat sehen so aus: #RRBBGG, also eine Raute und drei zweistellige Zahlen im Hexadezimalformat (Zahlen mit Ziffern von 0 bis 15, wobei 10 als 'A' und 15 als 'F' geschrieben werden). Die drei Zahlen stehen für die drei Farben Rot, Grün, Blau, aus denen die Farbe zusammengesetzt wird.

Beispiele: #000000, #FF0000, #00FF00, #0000FF, #FFFF00, #FF00FF, #00FFFF, #FFFFFF, #00A0A0, #0060A0, #B060A0.

RGB Bearbeiten

Die RGB-Schreibweise benutzt wie die Hex-Schreibweise die Farben Rot, Grün und Blau in verschiedenen Anteilen, um eine Farbe zusammenzusetzen, also dasselbe in Grün, bloß mit normalen Dezimalzahlen: rgb(R, G, B). Die Zahlen müssen innerhalb von 0 und 255 liegen, alternativ kann man auch Prozentangaben von 0% bis 100% pro Farbe angeben.

Beispiele: rgb(0,0,64), rgb(0%, 0%, 64%), rgb(127, 0, 255), rgb(50%, 0%, 100%).

RGBA Bearbeiten

RGBA erweitert das RGB-Modell um einen vierten Alpha-Wert, der von 0.0 bis 1.0 gehen kann, und die Transparenz einer Farbe vorgibt: rgba(20%, 60%, 30%, 1.0) vs. rgba(20%, 60%, 30%, 0.6)

HSL Bearbeiten

Hls.png

120° wählt das grünste Grün aus

Das HSL-Modell geht ganz anders an die Farbvorgabe heran und ist intuitiver als das RGB-Modell. Man gibt nur einen Farbwert von 0 bis 360 an, sowie zwei Prozentangaben für Sättigung und Helligkeit. 0 ist dabei Rot, 120 ist Grün, und 240 ist Blau (360 ist wieder Rot). Die Schreibweise ist hsl(Farbgrad, Sättigung, Helligkeit).

Beispiele: hsl(120, 100%, 100%), hsl(120, 100%, 0%), hsl(120, 100%, 50%), hsl(120, 50%, 50%), hsl(120, 0%, 50%), hsl(183, 50%, 50%), hsl(183, 100%, 50%), hsl(183, 100%, 30%).

HSLA Bearbeiten

Auch beim HSL-Model kann man einen vierten Alphawert hinzufügen, wieder von 0.0 (volltransparent, also unsichtbar) bis 1.0 (nicht transparent). Beispiel: hsla(183, 50%, 50%, 1.0) vs. hsla(183, 50%, 50%, 0.6)

Nützliche Weblinks Bearbeiten

Störung durch Adblocker erkannt!


Wikia ist eine gebührenfreie Seite, die sich durch Werbung finanziert. Benutzer, die Adblocker einsetzen, haben eine modifizierte Ansicht der Seite.

Wikia ist nicht verfügbar, wenn du weitere Modifikationen in dem Adblocker-Programm gemacht hast. Wenn du sie entfernst, dann wird die Seite ohne Probleme geladen.

Auch bei Fandom

Zufälliges Wiki