Advertisement
  1. Code
  2. General

Die Bedeutung von Farbcodes

by
Read Time:19 minsLanguages:

German (Deutsch) translation by Władysław Łucyszyn (you can also view the original English article)

HTML-Farbcodes sind ein allgemeiner und entscheidender Bestandteil des modernen Webdesigns. Während die meisten Websites heutzutage größtenteils aus Bildern bestehen, sind Farben besonders wichtig, wenn Sie beim Codieren im laufenden Betrieb einen Hex-Farbwert erstellen müssen. In diesem Handbuch lernen wir die Grundlagen der Farbcodierung kennen und bieten Ihnen letztendlich die Möglichkeit, Farben ohne Verwendung eines Farbwählers zu entwickeln.


Einführung: Farbcodes

Wie Sie vielleicht wissen, gibt es zwei gängige Möglichkeiten, eine Farbe im Webdesign zu definieren:

  1. rgb(___, ___, ___)
  2. #_ _ _ _ _ _

Beide werden am häufigsten mit CSS oder HTML implementiert, wie Sie unten überprüfen können:

Im ersten Codebeispiel wird jeder "Text hier" -Text als hellgraue Farbe angezeigt. Wir werden später darüber nachdenken, warum das so ist. Beachten Sie jedoch, dass die Farbmethoden, obwohl sie sehr unterschiedlich zu sein scheinen, in Wirklichkeit genau dieselbe Farbe haben.

Im zweiten Beispiel haben wir nur einen kurzen CSS-Code. Es ist ziemlich einfach - alles mit einer Klasse von "foo" hat eine Textfarbe von rgb(111,222,111). Für die Neugierigeren wäre das eine hellgrüne Farbe.

Bisher sollte das meiste für Sie Sinn machen. Lassen Sie uns nun genau untersuchen, wie wir von diesen relativ kryptischen Codes zu etwas Konkreterem übergehen.


Anlage A: RGB

In RGB kann jeder Wert zwischen den Kommas eine Zahl von 0 bis 255 sein. Beispiel:

Da RGB für "Rot, Grün, Blau" steht, bedeutet dies, dass es einen Wert von 10 für Rot, 137 für Grün und 29 für Blau gibt. Dies ist zwangsläufig eine Art irreduzibler Bruch. So:

  • das Rot wäre 10/255 (zehn von ein Maximalwert von 255)
  • das Grün wäre 137/255 (137 von maximal 255)
  • und 29/255 für blau.

Je höher die Zahl, desto mehr von dieser bestimmten Farbe wird das Endergebnis enthalten.

Wenn auf Null gesetzt, gibt es keine dieser bestimmten Farben. Bei 255 erweist sich natürlich das Gegenteil. Deshalb:

  • rgb(0,0,0) = schwarz
  • rgb(255,255,255) = weiß

Dies gilt auch, weil das RGB-Farbsystem auf Farbe durch Licht basiert. Dies unterscheidet sich stark von der Art und Weise, wie Sie normalerweise Farben erstellen, z. B. mit Farbe oder Buntstiften. Wenn Sie eine Kombination aus rgb(255.255.255) mit Farbe hätten, würden Sie wahrscheinlich etwas wie trübes Braun herausbringen, aber sicherlich nicht Weiß!


Anlage B: Hexadezimal

Hexadezimale Farbe ist im Allgemeinen schwieriger zu erklären als RGB. Grundsätzlich sind sie gleich. Das Innenleben von Hexadezimal ist jedoch zweifellos komplizierter.

Um die hexadezimale Farbe zu erklären, müssen wir zuerst auf ein Binär- und ein Basis-Sechzehn-Zahlen-System zurückgreifen, um zu verstehen, was so etwas wirklich zu "sagen" versucht:

Für diejenigen unter Ihnen, die nicht wissen, wie eines dieser Verfahren funktioniert oder was eines davon ist, gibt es hier eine kurze Anleitung:

Binär 101

  • Binär besteht vollständig aus Nullen und Einsen.
  • Eine Null ergibt einen Wert von Null und eine ergibt einen Wert von Eins; aber nicht immer.
  • Ein Bit ist entweder eine 1 oder eine Null. 1 ist ein bisschen. 0 ist ein bisschen. Aber 01 ist kein bisschen - es sind 2 Bits. 10 ist auch kein Bit, es sind auch 2 Bits.
  • Stellen wir uns vor, wir haben vier Bits; Dies wird geschickt als Knabbern oder ein halbes Byte bezeichnet. Anstelle dieser Zahl, die zwei oder 11 oder 110 entspricht, oder was auch immer Sie erraten, ist es tatsächlich viel anders.
  • Wenn sich mehr Bits ansammeln, verdoppelt sich der Wert jedes Bits.
  • Da das erste Bit einen Maximalwert von eins und einen alternativen Wert von 0 hat, kann das zweite Bit 2 oder 0 sein, das dritte kann 4 oder 0 sein, das vierte kann 8 oder 0 sein und so weiter und so fort.
  • Mit diesem System können Sie tatsächlich jede normale (Basis 10) Nummer erstellen. Beliebige Anzahl überhaupt.
  • Hinweis: Die akkumulierten Werte addieren sich, je nachdem, ob es sich um eine 1 oder eine 0 handelt. Außerdem sollten Sie beachten, dass Binärwerte in den meisten Fällen von rechts nach links gelesen werden.

Wenn das etwas verwirrend war, schlage ich vor, es noch einmal zu lesen. Wenn es danach immer noch keinen Sinn ergibt, ist das vollkommen in Ordnung - die folgenden Beispiele helfen Ihnen dabei, Ihr Verständnis zu verbessern.

Warten Sie - Wie hängt das mit Farbcodes zusammen?

Hexadezimal liefert, wie der Name schon sagt, sechzehn verwendbare "Werte" für eine Zahl, die angenommen werden soll. Wie Sie vielleicht schon früher bemerkt haben, kann ein "Knabbern" Ihnen eine beliebige Zahl von 0-15 geben: insgesamt 16 Werte!

Konzeptioneller Beweiß

Angenommen, wir haben Folgendes:

Und zu wissen, dass die Binärwerte jedes Bits wie folgt werden:

Der Binärwert von 1111 wird:

welches ist...

Wenn die Binärzahl 0000 gewesen wäre, wäre das Endergebnis einfach Null gewesen, da 0+0+0+0 gleich 0 ist.

Noch ein Beispiel

Die Werte für jedes Bit sind 8,4,2 und 1 (in der Reihenfolge). Addieren Sie die Binärwerte der folgenden Werte:

Gleich 5.

Hoffentlich sind diese kurzen Beispiele hilfreich. Ich ermutige Sie, einige andere schnell selbst auszuprobieren. Ich gebe Ihr sogar eins:

Konvertieren von binär in dezimal:1010Hinweis: Es ist zwischen 9 und 11.


Das mag sich in Bezug auf die Webentwicklung nirgendwo hinbewegen, aber glauben Sie mir, wir sind fast da.

Im Hexadezimalbereich gibt es 16 verschiedene Darstellungen für eine binäre Sequenz: 0,1,2,3,4,5,6,7,8,9, A,B,C,D,E und F. Diese wiederum , repräsentieren die Zahlen 0-15 (insgesamt 16 Zahlen). Beide repräsentieren die gleiche Binärzahl. Aber schnell - hören Sie auf und denken Sie nach - #FFFFFF liefert Weiß, richtig? Und Sie können niemals einen Buchstaben höher als F in einem HTML-Farbcode haben. Behalt das im Kopf.

Binäre, dezimale und hexadezimale Beziehungen

Hier ist ein kurzes Diagramm, das die Beziehung zwischen Binär, Dezimal und Hexadezimal abbildet:

Decimal|Hex|Binary

Dies bedeutet, dass Sie, wenn Sie die Zahl 15 erstellen möchten, F hexadezimal oder 1111 binär schreiben können. Wenn Sie beispielsweise 10 machen möchten, schreiben Sie A hexadezimal oder 1010 binär.


Hexadezimal auf Farbcodes anwenden

Jetzt sind wir ein bisschen näher dran, genau herauszufinden, wie hexadezimal funktioniert. Stellen wir uns kurz ein Beispiel für einen HTML-Farbcode vor, der in drei Teile unterteilt ist:

#006699 bis -> #00,66,99

Das kommt mir ein wenig bekannt vor; wenn Sie denken, was ich denke, haben Sie recht. Hexadezimal ist genauso organisiert wie RGB: Es hat einen Wert für jedes Rot, Grün und Blau. Der Hauptunterschied ist:

  • RGB kann bis zu drei Zeichen enthalten, um eine Zahl zwischen 0 und 255 zu definieren.
  • Hexadezimal benötigt dagegen nur zwei, um einen Wert zwischen 0 und 255 zu erhalten. Dies ist teilweise der Grund, warum Hex die häufigste Methode zur Verwendung von Farben in der Webentwicklung ist - einfach, weil es einfacher zu tippen ist und weniger Zeichen benötigt.

Wir werden nun untersuchen, wie Sie einen Wert bis zu 255 erstellen können, da wir bisher nur gelernt haben, wie Sie Zahlen bis zu 15 erstellen.

  • Nehmen wir an, wir haben eine Zahl wie 66. Der Haken hier ist, dass 66 hexadezimal geschrieben ist, nicht in regulären Zahlen. Daher wird dies nicht gleich 66 sein, es wird etwas anderes sein, etwas Größeres.
  • Lassen Sie uns dieses Problem zunächst in eine Binärdatei konvertieren. Gemäß unserer handlichen Tabelle oben ist 6 in binär 0110. Dies bedeutet, dass 66 in binär 0110 0110 (oder 01100110, dasselbe) wäre.
  • Da Binärdaten von rechts nach links gelesen werden, würden wir zuerst den am weitesten rechts liegenden Teil dekodieren. Wie wir wissen, wäre der erste 0110 gleich 6.
  • Dann links. Da zwei hexadezimale Zeichen miteinander verbunden sind, um "66" zu ergeben, würden die ganz linken Binärziffern etwas anderes bedeuten und definitiv nicht wieder 6. Noch einmal, wir würden den Wert jedes Bits weiter verdoppeln.
  • Von links nach rechts wären die Werte jedes Bits (mit 8 Bits [das ist ein Byte!]): 128, 64, 32, 16, 8, 4, 2, 1. Betrachten wir also die Bits für die linke Seite Bei einem viel größeren Wert erhalten wir eine viel größere Anzahl:

Wir haben festgestellt, dass das erste Knabbern rechts gleich sechs ist. Und jetzt haben wir festgestellt, dass das zweite Knabbern links gleich 96 ist. Also, was machst du damit? Fügen Sie sie einfach hinzu! 96+6 = 102. Daher beträgt der Hexadezimalwert von 66 im normalen Dezimalsystem 102.

Dies bedeutet, dass hexadezimal das RGB-Äquivalent von 66 (hexadezimal) 102 beträgt. Dementsprechend ist #666666 gleich rgb (102, 102, 102).

Lassen Sie uns noch eine Hex-Dezimal-Konvertierung durchführen:

255 ist der Maximalwert für jede Farbe. Wenn wir also #FFFFFF hätten, von dem wir alle wissen, dass es weiß ist, wäre es rgb(255,255,255), das ebenfalls weiß ist.

Lassen Sie uns zum besseren Verständnis eine letzte Konvertierung durchführen. Dieses Mal werden wir eine ganze hexadezimale Farbe in RGB konvertieren. Unsere Farbe ist #6AB4FF.

Schlussfolgerung: #6AB4FF entspricht rgb(106, 180, 255).

Nun fragen Sie sich vielleicht, wie wir von diesen Werten zu einer tatsächlichen Farbe gelangen, die wir uns in unserem Kopf vorstellen können. Der nächste Abschnitt wird Ihnen dabei helfen. Nachdem wir nun wissen, wie Hexadezimal und RGB zusammenhängen und wie Hexadezimal tatsächlich funktioniert, werden wir nun überprüfen, wie Sie im Handumdrehen eine Farbe in Ihrem eigenen Code finden und Ihnen dabei helfen können, eine zu erstellen Farbe, ohne jemals einen Farbwähler verwenden zu müssen.


Wahre Farbe

Kurzer Spaßfakt: Da jeder Wert von Rot, Grün und Blau 8 Bits enthält, bedeutet dies, dass eine RGB-Farbe insgesamt 24 Bits enthält (8*3 = 24). Hier erhalten wir den Begriff 24-Bit-Farbe, der oft als "Wahre Farbe" bezeichnet wird.

Mit 24-Bit-Farben können wir bis zu 16.777.216 - über 16 Millionen - Farben erstellen. Dies ist in der Regel für jedes Projekt mehr als zufriedenstellend. 32-Bit-Farben haben jedoch zunehmend an Bedeutung gewonnen, jedoch nicht unbedingt im Bereich des Webdesigns. Weitere Informationen zur Farbtiefe finden Sie in Wikipedia.org in diesem Artikel. Außerdem können Sie hier ein Bild aller ~ 16 Millionen Farben in einem Bild anzeigen (David Naylor Blog). Es ist wirklich faszinierend! Die Bildgrößen von 4096 x 4096 sind sinnvoll, da 4096 die Quadratwurzel von 16.777.216 ist.


Endlich: Anwendungen

Damit dieses Wissen für uns von Nutzen ist, müssen Sie lernen, wie Sie schnell und einfach Ihre eigenen Farben erstellen können. Wir werden so einfach wie möglich beginnen und dann zu schwieriger zu artikulierenden Farben übergehen.

Lektion Exploration #1

Nehmen wir an, wir möchten im laufenden Betrieb eine graue Farbe erstellen. Graustufenfarben sind häufig und in vielen Fällen am nützlichsten. Bisher wissen wir Folgendes: #000000 ist gleich schwarz, und #FFFFFF ist gleich weiß. Daher sind die häufigsten Graustufenfarben Inkremente zwischen diesen beiden Werten. Um einen Grauton zu erzielen, würden wir entsprechend Werte zwischen Weiß und Schwarz festlegen.

Logischerweise ist ein Wert, der näher an #FFFFFF liegt, ein hellerer Grauton, und ein Wert, der näher an #000000 liegt, ist dunkler. In diesem Sinne machen wir eine ziemlich hellgraue Farbe. Einige schnelle Überlegungen geben uns die folgende Auflösung: #DDDDDD ist bequem weit genug von Weiß entfernt, so dass es für uns eindeutig ein schönes Hellgrau sein wird.

Später wollen wir ein dunkleres Grau machen. Wieder einmal einfach. Mach einfach so etwas wie #333333. Wie Sie sehen können, sind Grauwerte sehr einfach. Wenn Sie feststellen, dass Sie einen noch spezifischeren Grauton benötigen, denken Sie daran, dass als allgemeine Faustregel gilt: Wenn jeder Wert für Rot, Grün und Blau alle gleich oder fast gleich ist, wird er grau angezeigt. Ein solches Beispiel hierfür ist die Farbe "Gainsboro" mit dem Farbcode #DCDCDC. Dies bedeutet, dass es in jedem Wert von Rot, Grün und Blau nur eine weniger als unsere #DDDDDD-Farbe ist. Sie werden wahrscheinlich nicht in der Lage sein, zwischen den beiden zu unterscheiden, aber wenn Sie um 1 erhöhen oder verringern, erhalten Sie etwas mehr "graue Präzision".

#DDDDDD gepaart mit seinem dunkelgrauen Gegenstück #333333

Lektion Exploration #2

Die zweit einfachsten Farben, die Sie erstellen können, sind (offensichtlich) Rot, Grün und Blau. Verwenden wir als Beispiel Rot. Wenn wir reines RGB-Rot erzeugen möchten, geben wir den Farbwert an der Maximalwert von Rot mit 0 Grün und 0 Blau. Das macht doch Sinn, oder? Um Rot hexadezimal zu machen, haben wir einfach #FF0000 eingegeben. Jetzt haben wir rot.

Das Erstellen von Grün und Blau folgt genau dem gleichen Prinzip. Um reines Grün zu machen: #00FF00 (alles grün, sonst nichts). Um reines Blau zu machen: #0000FF (alles blau, sonst nichts).

Einfach genug; Diese Farben sind jedoch in den meisten Fällen absolut abscheulich, wenn sie in einem Webdesign verwendet werden. Um diese Farben verwenden zu können, müssen wir sie daher entsprechend schattieren.

Glücklicherweise ist das Schattieren auch einfach. Verwenden wir für dieses Beispiel Blau. Wir haben bereits #0000FF für uns eingerichtet. Um den Farbton unseres Blauwerts zu ändern, müssen wir lediglich die letzten beiden Zeichen des hexadezimalen Farbcodes ändern. Da FF das höchstmögliche Blau ist, können wir es an dieser Stelle wirklich nur dunkler machen. Lassen Sie uns genau das tun:

Wenn Sie #0000FF in #000055 ändern (die Schwarzmenge verringern und das Blau näher an Schwarz heranrücken), erhalten Sie ein dunkleres Blau.

Wie Sie sehen können, ist das Schattieren von Rot, Grün und Blau alles andere als schwierig - es ist eine einfache Sache, die Menge einer bestimmten Farbe zu verringern. Die gleiche Regel gilt für Rot und Grün, nicht nur für Schwarz. Daher ist #005500 ein dunklerer Grünton und #550000 ein dunklerer Rotton. (Natürlich können Sie niedriger oder höher als 55 gehen, wenn Sie möchten).

Normales Rot, Grün und Blau neben einigen dunkleren Versionen von sich.

Lektion Exploration #3

Ich nehme an, Sie denken wahrscheinlich: Was ist also mit Gelb, Lila und all den anderen Farben? Zum Glück ist es nur ein bisschen komplexer als die großen drei von RGB. Beginnen wir mit gelb.

Um Gelb zu erzeugen, müssen wir zuerst über das Farbspektrum nachdenken. Eine kleine Mnemonik, die die Leute gerne benutzen, ist "Roy G. Biv", was für "Rot, Orange, Gelb, Grün, Blau, Indigo, Violett" steht. Jetzt ist die Logik darin etwas verwirrend, aber versuchen Sie, bei mir zu bleiben. Um gelb zu werden, verwenden wir die beiden Hauptfarben Rot, Grün und Blau auf beiden Seiten von Gelb. In diesem Fall wäre es rot und grün. Wenn wir also #FFFF00 schreiben würden, hätten wir Gelb. Fantastisch!

Es gibt nur wenige andere mögliche Kombinationen, die diese Methode verwenden, daher werden wir sie schnell durchgehen. Zwischen Rot und Blau in einem Farbkreis wäre der Code #FF00FF, und wir würden Pink oder Magenta erhalten, wie es traditionell genannt wird. Als nächstes haben wir zwischen Grün und Blau (#00FFFF) Cyan. Und das sind leider alle einfachen Kombinationen, die wir machen können. Der Rest erfordert einige Gedanken, die wir gleich durchgehen werden. Lassen Sie uns zunächst herausfinden, wie diese Farben schattiert werden.

Einfach genug, wir werden dieses Mal anfangen, Cyan zu schattieren, was, wie wir uns erinnern, #00FFFF ist. Und... Sie haben es wahrscheinlich erraten, aber um Gelb, Cyan oder Pink zu schattieren, müssen Sie nur die FF-Werte in kleinere ändern. In diesem Beispiel könnten wir etwas wie #005555 tun, indem wir Cyan auf eine viel dunklere Variante schattieren. Einer der offiziellen HTML-Farbnamen, DarkCyan, ist #008B8B, sodass einer etwas leichter ist als der, den wir gerade erstellt haben. Da haben wir es also: wie man Gelb, Cyan und Pink schattiert.

Gelb, Magenta und Cyan neben ihren abgedunkelten Versionen

Endnote zur Schattierung

Um eine Farbe heller zu machen, müssen Sie lediglich die niedrigen Werte (normalerweise die 00-Werte) erhöhen und den FF (oder andere Hauptfarben) in Ruhe lassen. Wenn wir zum Beispiel Grün hätten und es leichter machen wollten, würden wir mit #00FF00 beginnen. Um es zu erleichtern, würden wir einfach die 00-Werte erhöhen. #AAFFAA erzeugt eine schöne Frühlingsfarbe Grün.

Um #FF00FF (Rosa) heller zu machen, ist es der gleiche Vorgang. Erhöhen Sie die niedrigen Werte: #FFAAFF. Dies erzeugt eine hellrosa Farbe. Klappt wunderbar!

Unsere frühlingsgrünen und hellrosa Farben.

Anwendungen 2: Logisches Erstellen und Dekodieren von Farben

Bisher haben wir gelernt, wie man einfachste Farben erstellt, aber in den meisten Anwendungen ist dieses Wissen für ein Projekt nicht hilfreich. Hier kommt dieser zweite Teil ins Spiel.

Erstellen einer benutzerdefinierten Farbe

Um eine gut aussehende Farbe zu erstellen, müssen wir das, was wir bereits wissen, abarbeiten und auf logische Weise überlegen, was wir erstellen möchten. Lassen Sie uns ein Szenario erstellen. Wir möchten eine subtile orange Farbe erzeugen, die unseren Bedürfnissen entspricht - ähnlich wie ein etwas dunklerer Farbton von Orangensoda.

Wir beginnen mit dem, was wir bereits machen können, und das ist gelb: #FFFF00. Wir müssen es etwas näher an den orangefarbenen Bereich rücken, um dies zu tun, würden wir etwas von dem grünen "Ziehen", wie ich es gerne nenne, lindern. Dadurch wird die Rotmenge erhöht. Ich habe beschlossen, es in #FF5500 zu ändern. Dieses schnelle und einfache Beispiel gibt Ihnen eine Vorstellung davon, wie Sie eine Farbe erstellen würden. Das Letzte, was ich erwähnen möchte, ist, dass Sie sich vielleicht fragen, warum ich nicht angefangen habe, die blaue Menge zu addieren, die wir bei einem Wert von 00 belassen haben. Der Grund dafür ist, dass Sie langsam in Schritten von blau hinzufügen 11, 22, 33 usw. sieht es immer noch ziemlich orange aus. Sobald Sie jedoch über 55 Jahre alt sind, werden Sie einige Probleme sehen. Vor allem, wenn wir es bis auf #FF5599 erhöhen. Was passiert ist, dass es sich in eine wirklich rosa Farbe verwandelt. Warum ist das? Denken Sie an die Zeit zurück, als wir ursprünglich Pink kreiert haben. Der Code war #FF00FF. Das Rot ist maximal und das Blau ist maximal. Wenn Sie also in unserer orangefarbenen Farbe #FF5500 in #FF5599 ändern, sind unsere roten und grünen Werte nicht mehr die herausragenden Werte. Stattdessen ist es rot und blau, was rosa ergibt. Auf diese Weise würde der Wert 55 für Grün einfach unseren Rosaton aufhellen, anstatt ihn in Richtung des orangefarbenen Bereichs zu verschieben.

Unsere orange Farbe. Es sieht aus wie Orangensoda, oder?

Hinweis für den Leser: Das Erstellen komplexer Farbcodes ist zugegebenermaßen recht unpraktisch. In der Zeit, die Sie benötigen würden, um eine ausreichende Farbe zu erstellen, hätten Sie leicht mehrere gute Farben aus einem Farbwähler herausholen können. Für eine komplexe Farbe ist es am besten, nicht zu versuchen, sie selbst zu erstellen. Überlassen Sie es stattdessen einfach dem Bewährten und sparen Sie sich wertvolle Zeit. Sie sollten jedoch Ihre Fähigkeiten einsetzen, um eine einfache Aufgabe wie das Abdunkeln oder Aufhellen einer Farbe unterwegs schnell auszuführen.

Eine Farbe dekodieren

Sie sehen diesen schönen Farbcode, der Sie ins Gesicht starrt, aber Sie haben keine Ahnung, welche Farbe er wirklich hat. Groß! Hier kommt wahrscheinlich der größte Spaß ins Spiel. Der beste Weg, Ihnen dies beizubringen, ist ein einfacher Test. Bei einem Test in einer meiner Informationstechnologieklassen wurden mir einmal die folgenden Fragen gestellt.

1. #000000 repräsentiert die Farbe ____.

  1. grün
  2. schwarz
  3. weiß
  4. rot

2. #00FF00 repräsentiert die Farbe ___.

  1. grün
  2. schwarz
  3. rot
  4. weiß

3. #FFCC66 steht für einen Farbton von ___.

  1. blau
  2. rot
  3. lila
  4. gold

Hoffentlich konnten Sie all dies herausfinden! Besonders die ersten beiden. Sie hätten herausfinden müssen, dass die Antwort auf Nummer eins schwarz oder B war. Bei der zweiten Frage war die Antwort ebenfalls recht einfach. Nach dem Schema von Rot, Grün, Blau wissen wir, dass die Farbe einen gewissen Grünton hat, da jeder Wert außer Grün auf 00 gesetzt ist. Da der Wert für Grün außerdem FF (oder 255) ist, wissen wir, dass diese Farbe reines Grün ist. Die Antwort lautet also A.

Es scheint, als wäre die einzige schwer zu entschlüsselnde Farbe hier Nummer drei, #FFCC66. Das ist verständlich. Da der blaue Wert(66) so viel kleiner als die beiden anderen Zahlen ist, kann er als relativ irrelevant angesehen werden. Sie können es also mit der Farbe für Gelb #FFFF00 vergleichen. Zwischen diesen beiden sehen sie etwas ähnlich aus. Mit dieser Methode können Sie die ersten drei Antworten ausarbeiten, da keine von ihnen in der Nähe von Gelb liegt. Daher lautet die Antwort D. Der verringerte Grünwert von CC schattiert die Farbe leicht, und die Zunahme von Blau führt dazu, dass die Farbe Gold viel ähnlicher wird.

Normales Rot, Grün und Blau neben einigen dunkleren Versionen von sich.

Das Decodieren von Farbcodes umfasst in erster Linie das Durchdenken und Vergleichen mit bereits bekannten Farben!


Ein Laster Zeiger

Hier ist ein letzter kurzer Tipp, wie Sie das Erstellen einer Farbe mithilfe des Hexadezimalsystems beschleunigen können. Mit dieser Methode können Sie einige Farbcodes von sieben auf vier Zeichen reduzieren (z. B. #_ _ _ _ _ _ bis #_ _ _). Diese Methode wird als Farbkürzel bezeichnet, und die Idee dahinter ist, dass sie den Wert jeder der drei Hauptfiguren nimmt und sie unsichtbar dupliziert. Damit meine ich Folgendes: Wenn Sie den Farbcode #123 hätten, wäre dies das Äquivalent von #112233. Sie können dies für jeden Farbcode tun, bei dem jeder Hexadezimalwert für Rot, Grün und Blau genau dasselbe Zeichen ist. Einige häufigere Abkürzungen sind:

  • #000 für schwarz (#000000)
  • #fff für weiß (#ffffff)
  • #f00 für rot (#ff0000)
  • #0f0 für grün (#00ff00)
  • #00f für blau (#00f)

Abschluss

Hoffentlich hat Ihnen dieser Artikel dabei geholfen, herauszufinden, wie Farbcodes wirklich funktionieren. In vielen Programmen wie Photoshop ist es zugegebenermaßen am einfachsten, die integrierten Farbwähler zu verwenden. Der Kernbereich, in dem sich diese Fähigkeit als nützlich erweisen wird, ist das Durchsuchen eines CSS-Quellcodes und das einfache Herausfinden der Farbe, ohne auf eine andere Ressource zurückgreifen zu müssen. Unabhängig davon, welche Methode schneller ist, sollten wir als Webentwickler und Designer diese Dinge wissen wollen! Vielen Dank fürs Lesen. Dies ist ein verständlicherweise schwieriges Thema, also lassen Sie uns mehr in den Kommentaren sprechen!

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.