BESTE WEBSITE FÜR WEBENTWICKLER
HTML-Farben. Lektionen für Anfänger

Ua En Es Fr

Farben NCol


Was sind NCol-Farben?

NCol (Natural Color) ist ein Farbsystem, das von W3Schools entwickelt wurde. Es basiert auf der Verwendung natürlicher Farbtöne, die denen der Natur so nahe wie möglich kommen. Diese Farben werden im Webdesign verwendet, um Websites und Benutzeroberflächen ein natürlicheres, weicheres Aussehen zu verleihen.

Im Rahmen von NCol werden Farben verwendet, die natürlich und harmonisch wirken und nicht den Effekt von hellen oder scharfen Übergängen erzeugen. Dabei kann es sich um Farben handeln, die natürliche Elemente imitieren, wie z. B. grüner Wald, blauer Himmel, Braun- und Sandtöne usw.


Wie funktioniert das?

Die Farbe von NCol wird durch einen Buchstaben angegeben, der eine Farbe angibt, und eine Zahl, die den prozentualen Abstand von dieser Farbe angibt.

Verwendete Farben:

  • R — Red / Rot;
  • Y — Yellow / Gelb;
  • G — Green / Grün;
  • C — Cyan / Cyan;
  • B — Blue / Blau;
  • M — Magenta / Magenta.

Zum Beispiel:

  • R30 bedeutet Rot, verschoben um 30% in Richtung Gelb (d.h. mehr Orange).
  • B50 bedeutet blaue Farbe, die um 50 % in Richtung Grün (d. h. Blau) versetzt ist.

Vorteile von NCol:

  • Einfachheit: Leicht zu verstehen und zu merken.
  • Intuitiv: Entspricht der natürlichen Wahrnehmung von Farben.
  • Harmonie: NCol-Farben schaffen eine harmonische und natürliche Atmosphäre, die die Benutzeroberfläche angenehm für das Auge macht.
  • Entwicklerfreundlich: Sie können schnell den gewünschten Farbton erhalten, indem Sie den numerischen Wert ändern.
  • Benutzerfreundlichkeit: Websites, die natürliche Farben verwenden, können weniger wahrnehmungsgeladen sein, sodass Benutzer mehr Zeit auf solchen Websites verbringen können, ohne sich müde zu fühlen.
  • Relevanz für Umwelt- und Naturthemen: Wenn Ihr Projekt einen Bezug zu Natur, Gesundheit oder Ökologie hat, sind solche Farben sehr geeignet.

Nachteile von NCol:

  • Begrenzt: Deckt nicht alle möglichen Farbtöne ab. Da sich die NCol-Palette auf natürliche Farbtöne konzentriert, ist dieser Ansatz möglicherweise nicht für Projekte geeignet, die hellere, dynamischere oder "trendige" Farben erfordern.
  • Vielleicht weniger ausdrucksstark: Natürlich aussehende Farben können weniger lebendig oder ausdrucksstark aussehen, was nicht immer für Marken geeignet ist, die sich abheben oder Aufmerksamkeit erregen wollen.
  • Nicht standardisiert: Kein offizieller Standard, wird daher möglicherweise von einigen Tools nicht unterstützt.
  • Subjektivität: Die Art und Weise, wie Farben wahrgenommen werden, kann von Person zu Person unterschiedlich sein.

Anwendungsbeispiel:

  • Umweltfreundliche Websites: Für eine Website, die sich dem Umweltschutz widmet, können Sie die NCol-Palette verwenden, um natürliche Farbtöne – Grün, Braun, Blau – hervorzuheben und gleichzeitig ein Gefühl der Einheit mit der Natur zu schaffen.
  • Gesundheitsschnittstellen: Eine Website oder App, die sich auf einen gesunden Lebensstil bezieht, kann diese Farben anwenden, um eine beruhigende Atmosphäre zu schaffen.
  • Intuitive Paletten: Webseiten, auf denen Farben mithilfe intuitiver Paletten ausgewählt werden.
  • Design-Apps: Apps, die es Benutzern ermöglichen, Farben einfach auszuwählen, ohne die technischen Details zu kennen.

NCol kann in HTML und CSS verwendet werden, um die Farbe von Text, Hintergründen, Rahmen und anderen Elementen festzulegen.


NCol-Alternativen:

Es gibt auch andere Farbkennzeichnungssysteme, wie zum Beispiel:

  • RGB: Gibt die Farbe mit drei Zahlen an, die der Intensität von Rot, Grün und Blau entsprechen.
  • HEX: Ähnlich wie RGB, verwendet aber ein hexadezimales Zahlensystem.
  • HSL: Gibt die Farbe anhand von Farbton, Sättigung und Helligkeit an.

Schlüsse

Die Wahl des Farbkennzeichnungssystems hängt von Ihren Bedürfnissen und Vorlieben ab. NCol kann eine bequeme Option für eine schnelle und intuitive Farbauswahl sein, insbesondere für Anfänger.

Insgesamt ist NCol (Natural Color) ein benutzerfreundliches Farbsystem, das dabei hilft, Benutzeroberflächen und Designs zu erstellen, die für den Benutzer natürlich und komfortabel aussehen, aber Einschränkungen bei der Farbauswahl für hellere oder nicht standardmäßige Projekte aufweist.


Wie bekommt man NCol-Farbe?

Um eine NCol-Farbe zu erhalten, können Sie den NCol-Rechner verwenden.

NCol-Rechner


 
rgb(255, 0, 0)
#ff0000
hsl(0, 100%, 50%)


H:
R
W:
0
B:
0

Natürliche Farben (NCol)

Natural Colors (NCol) ist eine Initiative von W3Schools.

Das System wurde entwickelt, um die Auswahl von HTML-Farben zu erleichtern.

NCol gibt Farben mit einem Farbbuchstaben mit einer Zahl an, um den Abstand (in Prozent) von der Farbe anzugeben.

R30 bedeutet 30 % weg von Rot und bewegt sich in Richtung Gelb. (Mit anderen Worten: Rot mit 30% Gelb).

LetterColorHues
RRed
R
R25
R50
R75
YYellow
Y
Y25
Y50
Y75
GGreen
G
G25
G50
G75
CCyan
C
C25
C50
C75
BBlue
B
B25
B50
B75
MMagenta
M
M25
M50
M75
R Y G C B M
                                                                                                                       

Farbe und Abstand können auch in Farbtönen (0-360) angegeben werden:

R = 000 Y = 060 G = 120 C = 180 B = 240 M = 300

HTML-Unterstützung

NCol wird in HTML nicht unterstützt, kommt aber dem neuen HWB-Farbsystem, das in CSS4 vorgeschlagen wird, sehr nahe.

Während Sie auf CSS4 warten, können Sie die Farbbibliothek von W3Schools einbinden und NCol als HTML-Attribut wie folgt verwenden:

Beispiel

<div data-w3-color="R50,50%,0">

<p>London is the capital city of England.
It is the most populous city in the United Kingdom,
with a metropolitan area of over 13 million inhabitants.</p>

</div>

<script src="../lib/w3color.js"></script>
Try It Yourself »

W3Schools Farbbibliothek

Die im obigen Beispiel verwendete JavaScript-Bibliothek kann von

https://www.w3schools.com/lib/w3color.js.

Sie können auch einen alternativen Download von unserer Website verwenden W3SchoolsDE. DasBeste unter dem Link: https://w3schoolsua.github.io/lib/w3color.js.


Warum NCol?

Der Versuch, Farben mit Hilfe der RGB- oder HEX-Notation zu erklären, ist sehr schwierig.

Können Sie sagen, welche Farbe rgb(199,21,133) hat?

RGB basiert darauf, wie Farben durch Mischen von Lichtquellen physikalisch erzeugt werden.

NCol basiert darauf, wie Farben für das menschliche Auge aussehen.

Aus diesem Grund macht es NCol viel einfacher, Farben zu beschreiben.

Natürliche Farben wurden erstmals von Karl Ewald Konstantin Hering (Deutschland 1834 - 1918) beschrieben.