Color in CSS
In CSS (Cascading Style Sheets), you can specify colors using several different methods: Keyword: You can use color names like "red", "blue", "green", etc.
color: red;
Hexadecimal: You can specify colors using hexadecimal values. Hexadecimal values range from 0 to F, representing values from 0 to 15. For example, #RRGGBB, where RR represents red, GG represents green, and BB represents blue.
color: #ff0000; /* red */
RGB: You can use the RGB color model. RGB stands for Red, Green, and Blue. It's represented as rgb(red, green, blue), where each parameter can take a value from 0 to 255.
color: rgb(255, 0, 0); /* red */
RGBA: Similar to RGB, but with an additional parameter for alpha (transparency), which ranges from 0 (completely transparent) to 1 (completely opaque).
color: rgba(255, 0, 0, 0.5);
/* semi-transparent red */
HSL: HSL stands for Hue, Saturation, and Lightness. Hue is represented as an angle between 0 and 360 degrees, saturation and lightness are represented as percentages.
color: hsl(0, 100%, 50%); /* red */
HSLA: Similar to HSL, but with an additional parameter for alpha (transparency).
color: hsla(0, 100%, 50%, 0.5);
/* semi-transparent red */
Farbtable
| RGB | Hexadezimal | Farbname |
|---|---|---|
| 222,184, 135 | #deb887 | burlywood |
| 139,0,0 | #8b0000 | Dark Red |
| 124,252,0 | #7cfc00 | LawnGreen |
| 255,182,193 | #ffb6c1 | LightPink |
| 245,245,245 | #f5f5f5 | WhiteSmoke |
| 255,99,71 | #ff6347 | tomato |
| 64,224,208 | #40e0d0 | turquoise |
Farbharmonien
Meine Farbpalette
Farbschemata Analyse
stopptkinderarmut.org
Die Webseite https://www.stopptkinderarmut.org verwendet eine Farbpalette mit den folgenden Farben:
#ffffff
#00000
#e3e3e8
#68a0a0
#ff0099
#f57b01
#fef400
Diese Farbpalette besteht hauptsächlich aus neutralen und gedämpften Farben wie Weiß, Schwarz und Grau, die durch Akzentfarben wie Petrol, Rosa, Orange und Gelb aufgefrischt werden. Die Kombination aus neutralen und lebendigen Farben verleiht der Webseite eine ausgewogene und dennoch lebendige Ästhetik.
Mögliche Zielgruppen:
- Eltern und Erziehungsberechtigte
- Pädagogen und Lehrkräfte
- Politiker und Entscheidungsträger
hammerundnagel.de
Die Webseite https://hammerundnagel.de verwendet eine Farbpalette mit den folgenden Farben:
#968e7d
#000000
#d29544
#f6af33
#cac6be
#d5d2cb
#919ea6
#ffffff
#ecf2fa
#040608d9
#e9edf2
Diese Farbpalette verwendet eine Mischung aus neutralen Farben wie Grau und Beige sowie auffälligeren Farben wie Braun und Orange, um ein ansprechendes und zugleich professionelles Erscheinungsbild zu erzeugen.
Mögliche Zielgruppen:
- Heimwerker und Handwerker
- Friseur
- Gewerbliche Kunden und Bauunternehmen
hipp.de
Die Webseite https://www.hipp.de verwendet eine Farbpalette mit den folgenden Farben:
#0d2e6b
#314d81
#d63384
#fff3cd
#0d6efd
#6610f2
#6f42c1
#dc3545
#fd7e14
#ffc107
#198754
#20c997
#abd293
#0dcaf0
#c6eafa
#000000
#ffffff
#6c757d
#343a40
Diese Farbpalette kombiniert verschiedene Blau- und Grautöne mit kräftigen Farben wie Rosa, Rot, Orange und Gelb. Die Hauptfarbe Blau und Grün und ihre verschiedenen Schattierungen dominieren die Palette. Die dezenten Blau- und Grüntöne fungieren als zurückhaltende Hintergründe und unterstützen teilweise die Textdarstellung, während die kräftigen Farben dazu dienen, wichtige Elemente hervorzuheben und Aufmerksamkeit zu erregen.
Mögliche Zielgruppen:
- Gesundheitsbewusste Verbraucher
- Ärzte, Ernährungsberater und Gesundheitsfachkräfte
- Landwirtschaft
Farbschema Erstellung
Farbpalette nach Farbassoziationen
- Grün: Natur, Frische, Hoffnung
- Blau: Sympathie, Harmonie, Freundlichkeit
- Schwarz: Eleganz, Stärke, Geheimnis
- Weiß: Reinheit, Frieden, Neutralität
Farbpalette nach einer Bildvorlage