W3.CSS Color Libraries
Highway Colors
| Color Name |
|---|
| (10055) w3-highway-brown |
| (11086) w3-highway-red |
| (12243) w3-highway-orange |
| (13415) w3-highway-schoolbus |
| (13507) w3-highway-yellow |
| (14066) w3-highway-green |
| (15065) w3-highway-blue |
The numbers in parentheses are references to Federal Standard 595.
The hex values are non official approximate values intended to simulate highway colors in HTML.
Example
<div class="w3-tag w3-highway-green">Falcon Ridge Parkway</div>
<div class="w3-tag w3-highway-schoolbus">Schoolbus Stop</div>
Try It Yourself »
Download the CSS »
Safety Colors
| Color Name |
|---|
| (11120) w3-safety-red |
| (12300) w3-safety-orange |
| (13591) w3-safety-yellow |
| (14120) w3-safety-green |
| (15092) w3-safety-blue |
| (17155) w3-safety-purple |
The numbers in parentheses are references to Federal Standard 595.
The hex values are non official approximate values intended to simulate safety colors in HTML.
ANA Colors (Army Navy Aero)
| Color Name |
|---|
| (ANA 501) w3-ana-blue |
| (ANA 502) w3-ana-insignia-blue |
| (ANA 503) w3-ana-willow-green |
| (ANA 503) w3-ana-oxygen-tank-green |
| (ANA 504) w3-ana-olive-drab |
| (ANA 505) w3-ana-lemon-yellow |
| (ANA 506) w3-ana-orange-yellow |
| (ANA 507) w3-ana-aircraft-cream |
| (ANA 508) w3-ana-international-orange |
| (ANA 508) w3-ana-aircraft-orange |
| (ANA 509) w3-ana-insignia-red |
| (ANA 510) w3-ana-maroon |
| (ANA 511) w3-ana-insignia-white |
| (ANA 512) w3-ana-aircraft-grey |
| (ANA 513) w3-ana-engine-gray |
| (ANA 514) w3-ana-instrument-black |
| (ANA 515) w3-ana-black |
| (ANA 516) w3-ana-strata-blue |
| (ANA 516) w3-ana-aircraft-blue |
| (ANA 601) w3-ana-international-white |
| (ANA 601) w3-ana-aircraft-white |
| (ANA 602) w3-ana-light-gray |
| (ANA 603) w3-ana-sea-gray |
| (ANA 603) w3-ana-gunship-gray |
| (ANA 604) w3-ana-international-black |
| (ANA 604) w3-ana-navy-black |
| (ANA 605) w3-ana-aircraft-insignia-blue |
| (ANA 606) w3-ana-aircraft-sea-blue |
| (ANA 607) w3-ana-sea-blue |
| (ANA 608) w3-ana-navy-blue |
| (ANA 609) w3-ana-azure-blue |
| (ANA 610) w3-ana-610 |
| (ANA 611) w3-ana-interior-green |
| (ANA 612) w3-ana-gunship-green |
| (ANA 614) w3-ana-internation-yellow |
| (ANA 615) w3-ana-tan |
| (ANA 616) w3-ana-desert-sand |
| (ANA 617) w3-ana-field-drab |
| (ANA 618) w3-ana-dull-red |
| (ANA 619) w3-ana-international-red |
| (ANA 619) w3-ana-aircraft-red |
| (ANA 621) w3-ana-international-gray |
| (ANA 622) w3-ana-aircraft-black |
| (ANA 623) w3-ana-teal-blue |
| (ANA 625) w3-ana-sea-plane-gray |
| (ANA 626) w3-ana-626 |
| (ANA 627) w3-ana-field-green |
| (ANA 628) w3-ana-sierra-tan |
The numbers in parentheses are references to Federal Standard 595.
The hex values are non official approximate values intended to simulate ANA colors in HTML.
Example
<div class="w3-tag w3-olive-drab">
<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>
Try It Yourself »
Download the CSS »
Camouflage Colors
| Color Name |
|---|
| (30051) w3-camo-brown |
| (30090) w3-camo-red |
| (33070) w3-camo-olive |
| (33105) w3-camo-field |
| (33245) w3-camo-earth |
| (33303) w3-camo-sand |
| (33446) w3-camo-tan |
| (33510) w3-camo-sandstone |
| (34082) w3-camo-dark-green |
| (34086) w3-camo-forest |
| (34089) w3-camo-light-green |
| (34094) w3-camo-green |
| (36170) w3-camo-dark-grey |
| (36300) w3-camo-grey |
| (37030) w3-camo-black |
The numbers in parentheses are references to Federal Standard 595.
The hex values are non official approximate values intended to simulate camouflage colors in HTML.
Example
<div class="w3-camo-earth">Camouflaged Truck</div>
<div class="w3-camo-grey">Camouflaged Ship</div>
Try It Yourself »
Download the CSS »
Vivid Colors
| Color Name |
|---|
| w3-vivid-pink |
| w3-vivid-red |
| w3-vivid-orange |
| w3-vivid-yellow |
| w3-vivid-green |
| w3-vivid-blue |
| w3-vivid-violet |
| w3-vivid-purple |
| w3-vivid-black |
| w3-vivid-white |
| w3-vivid-yellowish-pink |
| w3-vivid-reddish-orange |
| w3-vivid-orange-yellow |
| w3-vivid-greenish-yellow |
| w3-vivid-yellow-green |
| w3-vivid-yellowish-green |
| w3-vivid-bluish-green |
| w3-vivid-greenish-blue |
| w3-vivid-purplish-blue |
| w3-vivid-reddish-purple |
| w3-vivid-purplish-red |
The w3-names are references to ISCC-NBS.
The hex values are non official approximate values intended to simulate vivid colors in HTML.
Example
<div class="w3-vivid-red">
<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>
Try It Yourself »
Download the CSS »
Signal Colors
| Color Name |
|---|
| (1003) w3-signal-yellow |
| (2010) w3-signal-orange |
| (3001) w3-signal-red |
| (4008) w3-signal-violet |
| (5005) w3-signal-blue |
| (6032) w3-signal-green |
| (7004) w3-signal-grey |
| (8002) w3-signal-brown |
| (9003) w3-signal-white |
| (9004) w3-signal-black |
The numbers in parentheses are references to the RAL Color Standard.
The hex values are non official approximate values intended to simulate signal colors in HTML.
Example
<div class="w3-tag w3-signal-red">Stopp</div>
<div class="w3-tag w3-signal-yellow">Wait</div>
<div class="w3-tag w3-signal-green">Go</div>
Try It Yourself »
Download the CSS »
