Blaue RGB-Farbe. Farben in Stilen können auf unterschiedliche Weise angegeben werden: per Hexadezimalwert, per Name, im RGB-, RGBA-, HSL-, HSLA-Format
Wie Sie wissen, kann Farbe den Zustand einer Person beeinflussen: sowohl geistig als auch körperlich. Jeden Tag bewerten die Augen beim Surfen auf Websites im Internet Millionen von Farben und Schattierungen. Ein Webdesigner, der mit der Psychologie der Farbe vertraut ist, kann die Stimmung des Besuchers manipulieren, um bestimmte Ziele zu erreichen.
Dies liegt daran, dass manche Farbtöne beruhigen, andere hingegen erregen. Als nächstes werden wir darüber sprechen, wie Farben mithilfe von Computertechnologie synthetisiert und angezeigt werden.
RGB ist ein Farbmodell, das eine Methode zum Erhalten aller Farben und ihrer Schattierungen durch Mischen der drei Hauptkomponenten in verschiedenen Anteilen darstellt:
- rote Farbe ( Rot);
- grüne Farbe ( Grün);
- blaue Farbe ( Blau).
Daher kommt auch die Kurzbezeichnung RGB. Diese Farben wurden aus einem bestimmten Grund als Hauptfarben ausgewählt: Der Grund liegt in der Physiologie der Netzhaut des menschlichen Auges und ihrer Wahrnehmung:
Das RGB-Modell ist bis heute das beliebteste Modell und wird zur Wiedergabe von Farben auf Fernsehbildschirmen und Computermonitoren verwendet. Da Hersteller ihre Produkte mit unterschiedlichen Eigenschaften ausstatten, wurde 1996 ein einheitliches RGB-basiertes Farbsynthesesystem namens sRGB geschaffen, an dem Microsoft und HP zusammenarbeiteten.
Numerische Darstellung der Farbe
Wie bereits erwähnt, entstehen RGB-Farben durch Mischen von Primärfarben. Um die Intensität jedes einzelnen von ihnen zu beschreiben, wurde ein Schema übernommen, bei dem die Farbe durch den Bereich 0-255 (8 Bit) dargestellt wird, was in hexadezimaler Schreibweise 00-FF entspricht.
Das heißt, die Primärfarben sehen folgendermaßen aus:
- Rot – RGB (255,0,0);
- Grün – RGB (0,255,0);
- Blau – RGB (0,0,255);
Nimmt die Farbintensität Werte unter 255 an, so erhält man unterschiedliche Rot-, Grün- und Blautöne. Im Folgenden finden Sie eine Tabelle ihrer Abstufungen sowie der Hexadezimalwerte der einzelnen Farbtöne:
RGB-Farbtabellen
Natürlich gibt es neben den Abstufungen der Primärfarben auch gemischte Farben, und ihre Anzahl ist recht groß. Daher wurde eine Tabelle mit RGB-Farben erstellt, in der alle vorhandenen Farbtöne sowie deren Namen und numerische Darstellungen aufgeführt sind ( in dezimaler und hexadezimaler Form).
Sie können es hier ansehen. Diese Tabelle erleichtert Webdesignern das Leben erheblich, da Sie in wenigen Sekunden den gewünschten Farbton finden und dessen numerische Darstellung herausfinden können.
Sichere RGB-Farbpalette
Irgendwann gab es jedoch ein Problem mit der Darstellung von Farben in verschiedenen Browsern, und um dieses Problem zu lösen, wurde die sogenannte „sichere“ Palette von RGB-Farben zusammengestellt, die durch mathematische Berechnungen abgeleitet wurden.
Wenn der Browser eine Farbe nicht richtig anzeigen kann, versucht er, durch Mischen benachbarter Farben etwas annähernd an das zu bringen, was er braucht, und höchstwahrscheinlich wird das Ergebnis völlig inakzeptabel sein:
Durch die Verwendung von RGB-Farbcodes aus dieser Palette kann ein Webentwickler beruhigt sein, was die Anzeige von Farben auf den Seiten seiner Website angeht, wenn sie mit verschiedenen Browsern, Plattformen und Monitoren angezeigt werden. Obwohl die Tabelle der sicheren Farben derzeit an Relevanz verliert ( Der technische Fortschritt steht immer noch nicht still), wenn man es benutzt, kann man, wie man sagt, ruhig schlafen.
Goldfarbe im RGB-Modell
Das Wort „Gold“ wurde erstmals zu Beginn des 14. Jahrhunderts verwendet, um die Farbe eines chemischen Elements namens Aurum – Gold – zu beschreiben. Im RGB-Modell wird die Farbe Gold durch folgende Zahlenwerte dargestellt:
- RGB (255, 215, 0) – Dezimalsystem;
- HEX #FFD700 – Hexadezimalsystem.
Beige Farbe im RGB-Modell
Die Farbe Beige nimmt in der Geschichte einen recht bedeutenden Platz ein, auch wenn sie nicht die ausdrucksstärkste ist. Viele Kulturdenkmäler, insbesondere antike Skulpturen, wurden aus Speckstein und Speckstein gefertigt, der einen beigen Farbton aufweist. Im RGB-Modell hat die Farbe Beige die folgenden numerischen Darstellungen.
Diese Seite enthält eine Tabelle mit Schlüsselwörtern, die zur Bezeichnung von Farben in Webentwicklersprachen wie HTML, CSS, JavaScript, Flash usw. verwendet werden können.
In den alten Spezifikationen des WC3-Konzerns waren lediglich 16 Schlüsselwörter angegeben, mit deren Hilfe Farben in HTML und CSS festgelegt wurden. In weiteren, moderneren Spezifikationen wurden weitere 130 Schlüsselwörter zur Angabe von Farbnamen hinzugefügt. Die folgende Tabelle enthält die Farbnamen und die entsprechenden Hex- und RGB-Codes.
Gemäß den CSS-Regeln wird bei Farbnamen die Groß-/Kleinschreibung nicht beachtet. Die Farbeinträge IndianRed und indianred sind gleichwertig.
Erwähnenswert ist auch, dass von den 146 Schlüsselwörtern in der Tabelle tatsächlich weniger Farben enthalten sind. Dies liegt daran, dass sich einige Schlüsselwörter auf dieselbe Farbe beziehen. So stellen die Namen Gray und Gray den 50 %-Grau-Farbcode #808080 dar, und das Wort Magenta ist ein Synonym für die HTML-Farbe Fuchsia, entsprechend dem Hexadezimalcode #FF00FF. Synonym sind auch die Wörter Aqua und Cyan, sie entsprechen dem Code #00FFFF.
|
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
HTML-Farben
HTML-Farben und Möglichkeiten, sie anzugeben
In HTML gibt es zwei Möglichkeiten, eine Farbe anzugeben:
1. Mithilfe des Farbnamens
2. Verwendung des RGB-Systems, bei dem Farben im Hexadezimalformat angegeben werden.
Farbname
Name Farben in HTML durch englische Wörter wie rot oder grün angezeigt. Der Farbname fungiert als Wert des HTML-Tag-Attributs. Es gibt viele Blumennamen, in diesem Artikel werden wir nur die wichtigsten betrachten.
Typischerweise werden in HTML zwei Attribute verwendet, um eine Farbe festzulegen:
1. Attribut color="color_name" – Textfarbe,
2. Attribut bgcolor="color_name" – Hintergrundfarbe.
Beispiele für die Verwendung von Farbattributen:
color="red" - dem Text eine rote Farbe zuweisen,
bgcolor="green" – weist dem Hintergrund eine grüne Farbe zu.
Tabelle der grundlegenden HTML-Farbnamen:
| Farbname | Seine Erscheinung | Übersetzung |
|---|---|---|
| Weiß | Weiß | |
| Elfenbein | Elfenbein | |
| Silber | Silber | |
| grau | Grau | |
| Schwarz | Schwarz | |
| kastanienbraun | Kastanienbraun | |
| Rot | Rot | |
| orange | Orange | |
| Gold | Gold | |
| Gelb | Gelb | |
| Olive | Olive | |
| Kalk | Kalk | |
| Grün | Grün | |
| Aqua | Meereswelle | |
| Blau | Blau | |
| Marine | Navi | |
| blaugrün | Türkis | |
| Fuchsie | Magenta | |
| lila | Lila |
Hexadezimales Zahlensystem
Im Alltag verwenden wir das dezimale Zahlensystem von 0 bis 9. Programmierer und Designer verwenden häufig das hexadezimale Zahlensystem von 0 bis 15, wobei:
10 = A
11 = B
12 = C
13 = D
14 = E
15 = F
Nahezu jede für unser Sehvermögen sichtbare Farbe und Schattierung kann im Hexadezimalsystem geschrieben werden. Beispielsweise entspricht die rote Farbe Rot im Hexadezimalsystem ff0000
color="red" - rote Farbe, namentlich,
color="#ff0000" – rote Farbe, im hexadezimalen Zahlensystem.
In HTML wird einer Hexadezimalzahl im Attributwert ein Rautezeichen # vorangestellt.
RGB
Bevor Sie beginnen, Farben in HTML mithilfe des hexadezimalen Zahlensystems anzugeben, müssen Sie sich zunächst mit etwas wie R G B vertraut machen
RGB ist eine Abkürzung für die Wörter R ed G reen B lue (Rot-Grün-Blau).
Eine Farbe in HTML, hexadezimal geschrieben, besteht aus drei Zahlenblöcken 00 00 00, wobei jeder Block für eine der RGB-Farben verantwortlich ist, der erste Block für Rot, der zweite für Grün und der dritte für Blau. Die Zahlen können zwischen 00 und ff liegen.
Wobei ff in Dezimalschreibweise 255 ist.
RGB-Schema:
Rot – von 00 bis ff
Grün – von 00 bis ff
Blau – von 00 bis ff
Als Ergebnis erhalten wir eine sechsstellige Zahl 000000, wobei die ersten beiden Zahlen für die rote Farbe, die zweiten beiden Zahlen für die grüne Farbe und die dritten beiden Zahlen für die blaue Farbe verantwortlich sind.
Wenn wir eine rote Farbe erhalten möchten, schreiben wir ff0000, grüne Farbe 00ff00, blaue Farbe 0000ff. Wenn wir beispielsweise eine dunkelrote Farbe erhalten möchten, müssen wir den ersten Zahlenblock und anstelle von ff reduzieren (entspricht 255 im Dezimalzahlensystem), schreiben Sie zum Beispiel 96 (entspricht 150 in Dezimalschreibweise).
Zur Verdeutlichung geben wir Beispiele für Farben und ihren Hexadezimalcode:
Farben in HTML mischen
Wenn Sie den Zeichenunterricht in der Schule nicht versäumt haben, erinnern Sie sich wahrscheinlich daran, dass man durch gleichmäßiges Mischen von Rot und Grün Gelb erhalten kann,
Wenn man zu Rot ein wenig Grün hinzufügt, erhält man Orange usw.
Es können auch Hexadezimal- und RGB-Farben gemischt werden:
Wenn Sie mit dem hexadezimalen Zahlensystem und RGB experimentieren, werden Sie irgendwann den Dreh raus und die gewünschte Farbe auswählen können.
Das CSS-Farbmodul enthält detaillierte Werte, mit denen Autoren die Farben und die Deckkraft von HTML-Elementen sowie die Werte der Farbeigenschaft definieren können.
Farbeigenschaft
1. Prioritätsfarben: Farbeigenschaft
Die Eigenschaft gibt die Schriftfarbe unter Verwendung verschiedener Farbwiedergabesysteme an. Die Eigenschaft beschreibt die Farbe des Textinhalts des Elements. Darüber hinaus wird es verwendet, um einen potenziellen indirekten Wert (currentColor) für alle anderen Eigenschaften bereitzustellen, die Farbwerte akzeptieren.
Die Immobilie wird vererbt.
2. Farbwerte
2.1. Hauptschlüsselwörter
Die Liste der Hauptschlüsselwörter umfasst folgende Bedeutungen:
| Name | VERHEXEN | RGB | Farbe |
|---|---|---|---|
| Schwarz | #000000 | 0,0,0 | |
| Silber | #C0C0C0 | 192,192,192 | |
| grau | #808080 | 128,128,128 | |
| Weiß | #FFFFFF | 255,255,255 | |
| kastanienbraun | #800000 | 128,0,0 | |
| Rot | #FF0000 | 255,0,0 | |
| lila | #800080 | 128,0,128 | |
| Fuchsie | #FF00FF | 255,0,255 | |
| Grün | #008000 | 0,128,0 | |
| Kalk | #00FF00 | 0,255,0 | |
| Olive | #808000 | 128,128,0 | |
| Gelb | #FFFF00 | 255,255,0 | |
| Marine | #000080 | 0,0,128 | |
| Blau | #0000FF | 0,0,255 | |
| blaugrün | #008080 | 0,128,128 | |
| Aqua | #00FFFF | 0,255,255 |
Bei Farbnamen wird die Groß-/Kleinschreibung nicht beachtet.
Syntax
Farbe: blaugrün;
2.2. Numerische Farbwerte
2.2.1. RGB-Modellfarben
Das Hexadezimalformat eines RGB-Werts ist ein #-Zeichen, direkt gefolgt von drei oder sechs Hexadezimalzeichen. Die dreistellige RGB-Notation #rgb wird in die sechsstellige Form #rrggbb umgewandelt, indem die Ziffern kopiert und keine Nullen hinzugefügt werden. Beispielsweise wird #fb0 zu #ffbb00 erweitert. Dadurch wird sichergestellt, dass weißes #ffffff im kurzen #fff-Eintrag angegeben werden kann und alle Abhängigkeiten von der Farbtiefe der Anzeige beseitigt werden.
Das Format eines RGB-Werts in funktionaler Notation ist rgb (gefolgt von einer durch Kommas getrennten Liste von drei numerischen Werten (entweder drei ganzzahligen Werten oder drei Prozentwerten), gefolgt von einem Symbol). Der ganzzahlige Wert 255 entspricht 100 % und F oder FF in hexadezimaler Schreibweise:
RGB(255.255.255) = RGB(100 %, 100 %, 100 %) = #FFF
Um numerische Werte herum sind Leerzeichen zulässig.
In HTML kann die Farbe auf drei Arten angegeben werden:
Festlegen einer Farbe in HTML anhand ihres Namens
Einige Farben können über ihren Namen angegeben werden, wobei der Farbname in Englisch als Wert verwendet wird. Die häufigsten Schlüsselwörter: Schwarz, Weiß, Rot, Grün, Blau usw.:
Textfarbe – rot
Die beliebtesten Farben des World Wide Web Consortium (W3C)-Standards:
| Farbe | Name | Farbe | Name | Farbe | Name | Farbe | Name |
|---|---|---|---|---|---|---|---|
| Schwarz | Grau | Silber | Weiß | ||||
| Gelb | Kalk | Aqua | Fuchsie | ||||
| Rot | Grün | Blau | Lila | ||||
| Kastanienbraun | Olive | Marine | Blaugrün |
Beispiel für die Verwendung unterschiedlicher Farbnamen:
Beispiel: Angabe einer Farbe anhand ihres Namens
- Versuch es selber "
Kopfzeile auf rotem Hintergrund
Kopfzeile auf orangefarbenem Hintergrund
Überschrift auf lindgrünem Hintergrund
Weißer Text auf blauem Hintergrund
Kopfzeile auf rotem Hintergrund
Kopfzeile auf orangefarbenem Hintergrund
Überschrift auf lindgrünem Hintergrund
Weißer Text auf blauem Hintergrund
Festlegen der Farbe mithilfe von RGB
Bei der Darstellung verschiedener Farben auf einem Monitor wird die RGB-Palette als Grundlage verwendet. Jede Farbe wird durch Mischen von drei Grundfarben erhalten: R - rot, G - grün, B - blau. Die Helligkeit jeder Farbe wird durch ein Byte angegeben und kann daher Werte von 0 bis 255 annehmen. Beispielsweise wird RGB(255,0,0) als Rot angezeigt, da Rot auf seinen höchsten Wert (255) eingestellt ist und der Rest werden auf 0 gesetzt. Sie können die Farbe auch als Prozentsatz festlegen. Jeder Parameter gibt den Helligkeitsgrad der entsprechenden Farbe an. Beispiel: Die Werte rgb(127, 255, 127) und rgb(50 %, 100 %, 50 %) stellen die gleiche mittlere grüne Farbe ein:
Beispiel: Angeben der Farbe mithilfe von RGB
- Versuch es selber "
RGB(127, 255, 127)
RGB(50 %, 100 %, 50 %)
RGB(127, 255, 127)
RGB(50 %, 100 %, 50 %)
Legen Sie die Farbe anhand des Hexadezimalwerts fest
Werte R G B kann auch mit hexadezimalen (HEX) Farbwerten in der Form angegeben werden: #RRGGBB wobei RR (rot), GG (grün) und BB (blau) hexadezimale Werte von 00 bis FF sind (identisch mit Dezimal 0-255). ). Das Hexadezimalsystem basiert im Gegensatz zum Dezimalsystem, wie der Name schon sagt, auf der Zahl 16. Das Hexadezimalsystem verwendet die folgenden Zeichen: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Hier werden die Zahlen von 10 bis 15 durch lateinische Buchstaben ersetzt. Zahlen größer als 15 im Hexadezimalsystem werden durch die Kombination zweier Zeichen zu einem Wert dargestellt. Beispielsweise entspricht die höchste Zahl 255 im Dezimalformat dem höchsten FF-Wert im Hexadezimalformat. Im Gegensatz zum Dezimalsystem wird einer Hexadezimalzahl ein Rautezeichen vorangestellt. # #FF0000 wird beispielsweise als Rot angezeigt, da Rot auf den höchsten Wert (FF) und die restlichen Farben auf den Minimalwert (00) eingestellt sind. Zeichen nach dem Raute-Symbol # Sie können sowohl Groß- als auch Kleinbuchstaben eingeben. Das Hexadezimalsystem ermöglicht die Verwendung der Kurzform #rgb, wobei jedes Zeichen einem Double entspricht. Daher sollte der Eintrag #f7O als #ff7700 betrachtet werden.
Beispiel: HEX-Farbe
- Versuch es selber "
rot: #FF0000
grün: #00FF00
blau: #0000FF
rot: #FF0000
grün: #00FF00
blau: #0000FF
rot+grün=gelb: #FFFF00
rot+blau=lila: #FF00FF
grün+blau=cyan: #00FFFF
Liste gängiger Farben (Name, HEX und RGB):
| englischer Name | Russischer Name | Probe | VERHEXEN | RGB | ||
|---|---|---|---|---|---|---|
| Amaranth | Amaranth | #E52B50 | 229 | 43 | 80 | |
| Bernstein | Bernstein | #FFBF00 | 255 | 191 | 0 | |
| Aqua | Blau Grün | #00FFFF | 0 | 255 | 255 | |
| Azurblau | Azurblau | #007FFF | 0 | 127 | 255 | |
| Schwarz | Schwarz | #000000 | 0 | 0 | 0 | |
| Blau | Blau | #0000FF | 0 | 0 | 255 | |
| Bondi Blue | Bondi-Strandwasser | #0095B6 | 0 | 149 | 182 | |
| Messing | Messing | #B5A642 | 181 | 166 | 66 | |
| Braun | Braun | #964B00 | 150 | 75 | 0 | |
| Himmelblau | Azurblau | #007BA7 | 0 | 123 | 167 | |
| Dunkles Frühlingsgrün | Dunkles Frühlingsgrün | #177245 | 23 | 114 | 69 | |
| Smaragd | Smaragd | #50C878 | 80 | 200 | 120 | |
| Aubergine | Aubergine | #990066 | 153 | 0 | 102 | |
| Fuchsie | Fuchsie | #FF00FF | 255 | 0 | 255 | |
| Gold | Gold | #FFD700 | 250 | 215 | 0 | |
| Grau | Grau | #808080 | 128 | 128 | 128 | |
| Grün | Grün | #00FF00 | 0 | 255 | 0 | |
| Indigo | Indigo | #4B0082 | 75 | 0 | 130 | |
| Jade | Jade | #00A86B | 0 | 168 | 107 | |
| Kalk | Kalk | #CCFF00 | 204 | 255 | 0 | |
| Malachit | Malachit | #0BDA51 | 11 | 218 | 81 | |
| Marine | Marineblau | #000080 | 0 | 0 | 128 | |
| Ocker | Ocker | #CC7722 | 204 | 119 | 34 | |
| Olive | Olive | #808000 | 128 | 128 | 0 | |
| Orange | Orange | #FFA500 | 255 | 165 | 0 | |
| Pfirsich | Pfirsich | #FFE5B4 | 255 | 229 | 180 | |
| Kürbis | Kürbis | #FF7518 | 255 | 117 | 24 | |
| Lila | Violett | #800080 | 128 | 0 | 128 | |
| Rot | Rot | #FF0000 | 255 | 0 | 0 | |
| Safran | Safran | #F4C430 | 244 | 196 | 48 | |
| Meeresgrün | Grünes Meer | #2E8B57 | 46 | 139 | 87 | |
| Sumpfgrün | Bolotny | #ACB78E | 172 | 183 | 142 | |
| Blaugrün | Blau Grün | #008080 | 0 | 128 | 128 | |
| Ultramarin | Ultramarin | #120A8F | 18 | 10 | 143 | |
| Violett | Violett | #8B00FF | 139 | 0 | 255 | |
| Gelb | Gelb | #FFFF00 | 255 | 255 | 0 | |
Farbcodes (Hintergrund) nach Sättigung und Farbton.
