W3.CSS- Farbbibliotheken
Farbbibliotheken
Farbbibliotheken sind kleine CSS-Dateien, die häufig verwendete Farbwerte wie Sicherheitsstandards, Autobahnfarben, Modefarben, Tarnfarben und mehr enthalten.
Schulbus
Falcon-Ridge-Parkway
HALT
So verwenden Sie Farbbibliotheken
Farbbibliotheken sind einfach zu verwenden. Fügen Sie einfach einen Link zur Farbbibliothek auf Ihrer Webseite hinzu:
<link rel="stylesheet"
href="https://www.w3schools.com/lib/w3-colors-highway.css">
Fügen Sie dann dem HTML-Element, das Sie einfärben möchten, einen Klassennamen hinzu:
<div class="w3-highway-schoolbus">Schoolbus</div>
<div
class="w3-highway-green">Falcon Ridge Parkway</div>
<div
class="w3-highway-red">STOP</div>
US-Highway-Farben
| w3-highway-braun |
| w3-autobahn-rot |
| w3-autobahn-orange |
| w3-autobahn-schulbus |
| w3-autobahn-gelb |
| w3-autobahn-grün |
| w3-autobahn-blau |
Die Highway-Farben sind im Federal Standard 595 definiert .
US-Sicherheitsfarben
| w3-sicherheitsrot |
| w3-sicherheit-orange |
| w3-sicherheitsgelb |
| w3-sicherheitsgrün |
| w3-sicherheitsblau |
| w3-sicherheits-lila |
Die US-Sicherheitsfarben sind im Federal Standard 595 definiert .
Europäische Signalfarben
| w3-signal-gelb |
| w3-signal-orange |
| w3-signal-rot |
| w3-Signal-Violett |
| w3-signal-blau |
| w3-Signal-Grün |
| w3-signalgrau |
| w3-signalbraun |
| w3-signalweiß |
| w3-signal-schwarz |
Beispiel
<div class="w3-signal-red">Stop</div>
<div
class="w3-signal-yellow">Wait</div>
<div class="w3-signal-green">Go</div>
CSS herunterladen »
Die europäischen Signalfarben sind im RAL-Farbstandard definiert .
Lebendige Farben
| w3-leuchtend-pink |
| w3-leuchtend-rot |
| w3-lebendig-orange |
| w3-leuchtend-gelb |
| w3-leuchtend-grün |
| w3-lebendig-blau |
| w3-lebendig-violett |
| w3-leuchtend-lila |
| w3-lebendig-schwarz |
| w3-lebendig-weiß |
| w3-leuchtend-gelblich-rosa |
| w3-lebendig-rötlich-orange |
| w3-leuchtend-orange-gelb |
| w3-lebendig-grünlich-gelb |
| w3-leuchtend-gelb-grün |
| w3-lebendig-gelblich-grün |
| w3-lebendig-bläulich-grün |
| w3-lebendig-grünlich-blau |
| w3-lebendig-lila-blau |
| w3-lebendig-rötlich-lila |
| w3-lebendig-lila-rot |
Beispiel
<div class="w3-vivid-red">
<p>London is the most populous city in the
United Kingdom,
with a metropolitan area of over 9 million
inhabitants.</p>
</div>
CSS herunterladen »
Die lebendigen Farben sind in ISCC-NBS definiert .
Lebensmittelfarben
| w3-Essen-Apfel |
| w3-Essen-Spargel |
| w3-food-aprikose |
| w3-food-aubergine |
| w3-Essen-Avocado |
| w3-Essen-Banane |
| w3-Essen-Butter |
| w3-Lebensmittel-Heidelbeere |
| w3-food-kirsche |
| w3-Essen-Schokolade |
| w3-food-cranberry |
| w3-Essen-Kaffee |
| w3-Essen-Ei |
| w3-Lebensmittel-Traube |
| w3-food-kiwi |
| w3-Essen-Zitrone |
| w3-food-lime |
| w3-food-mango |
| w3-Speisepilz |
| w3-Essen-Senf |
| w3-food-minze |
| w3-Lebensmittel-Olive |
| w3-Lebensmittel-Orange |
| w3-Lebensmittel-Erbse |
| w3-Essen-Pfirsich |
| w3-Lebensmittel-Birne |
| w3-food-pistazie |
| w3-Lebensmittel-Pflaume |
| w3-food-himbeere |
| w3-Essen-Safran |
| w3-Essen-Lachs |
| w3-food-grüne minze |
| w3-food-kürbis |
| w3-food-erdbeere |
| w3-Essen-Tomate |
| w3-Nahrung-Weizen |
| w3-Essen-Wein |
Beispiel
<div class="w3-food-apple">Apple</div>
<div
class="w3-food-banana">Banana</div>
CSS herunterladen »
Camouflage-Farben
| w3-camo-braun |
| w3-camo-rot |
| w3-camo-olive |
| w3-Camo-Feld |
| w3-camo-erde |
| w3-camo-sand |
| w3-camo-tan |
| w3-camo-sandstein |
| w3-camo-dunkelgrün |
| w3-Camo-Wald |
| w3-camo-hellgrün |
| w3-camo-grün |
| w3-camo-dunkelgrau |
| w3-tarngrau |
| w3-camo-schwarz |
Beispiel
<div class="w3-camo-earth">Camouflaged Truck</div>
<div
class="w3-camo-grey">Camouflaged Ship</div>
CSS herunterladen »
Die Tarnfarben sind im Federal Standard 595 definiert .