W3.CSS 색상 라이브러리
색상 라이브러리
색상 라이브러리는 안전 표준, 고속도로 색상, 패션 색상, 위장 색상 등과 같이 일반적으로 사용되는 색상 값을 포함하는 작은 CSS 파일입니다.
학교 버스
팔콘 릿지 파크웨이
그만
색상 라이브러리를 사용하는 방법
색상 라이브러리는 사용하기 쉽습니다. 웹 페이지에 색상 라이브러리에 대한 링크를 추가하기만 하면 됩니다.
<link rel="stylesheet"
href="https://www.w3schools.com/lib/w3-colors-highway.css">
그런 다음 색상을 지정하려는 HTML 요소에 클래스 이름을 추가합니다.
<div class="w3-highway-schoolbus">Schoolbus</div>
<div
class="w3-highway-green">Falcon Ridge Parkway</div>
<div
class="w3-highway-red">STOP</div>
미국 고속도로 색상
| w3-highway-brown |
| w3-고속도로-빨간색 |
| w3-highway-오렌지 |
| w3-highway-schoolbus |
| w3-고속도로-노랑 |
| w3-highway-green |
| w3-highway-blue |
고속도로 색상은 연방 표준 595 에 정의되어 있습니다.
미국 안전 색상
| w3-안전-빨간색 |
| w3-안전-오렌지 |
| w3-안전-노란색 |
| w3-안전-녹색 |
| w3-세이프티 블루 |
| w3-안전 보라색 |
미국 안전 색상은 연방 표준 595 에 정의되어 있습니다.
유럽 신호 색상
| w3-신호-노란색 |
| w3 신호 주황색 |
| w3-신호-빨간색 |
| w3-시그널 바이올렛 |
| w3-signal-blue |
| w3 신호 녹색 |
| w3 신호 회색 |
| w3 신호 갈색 |
| w3-signal-white |
| w3-signal-black |
예시
<div class="w3-signal-red">Stop</div>
<div
class="w3-signal-yellow">Wait</div>
<div class="w3-signal-green">Go</div>
CSS 다운로드 »
유럽 신호 색상은 RAL 색상 표준 에 정의되어 있습니다.
선명한 색상
| w3-비비드-핑크 |
| w3-비비드-레드 |
| w3-비비드-오렌지 |
| w3-비비드-옐로우 |
| w3-비비드-그린 |
| w3-비비드-블루 |
| w3-비비드-바이올렛 |
| w3-비비드-퍼플 |
| w3-비비드-블랙 |
| w3-비비드-화이트 |
| w3-비비드-노랑-핑크 |
| w3-비비드-레드-오렌지 |
| w3-비비드-오렌지-옐로우 |
| w3-생생한-녹색-노란색 |
| w3-선명한-황색-녹색 |
| w3-선명한-황록색 |
| w3-선명한-청록색 |
| w3-vivid-greenish-blue |
| w3-선명한-보라색-파랑 |
| w3-vivid-reddish-purple |
| w3-선명한-보라색-빨간색 |
예시
<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 다운로드 »
선명한 색상은 ISCC-NBS 에 정의되어 있습니다.
식용색소
| w3-음식 사과 |
| w3-식품-아스파거스 |
| w3-음식 살구 |
| w3-음식 가지 |
| w3-푸드-아보카도 |
| w3-푸드 바나나 |
| w3-푸드 버터 |
| w3-푸드 블루베리 |
| w3-푸드 체리 |
| w3-푸드 초콜릿 |
| w3-푸드 크랜베리 |
| w3-음식-커피 |
| w3-음식 계란 |
| w3-음식-포도 |
| w3-푸드 키위 |
| w3-푸드-레몬 |
| w3-푸드 라임 |
| w3-푸드 망고 |
| w3-음식 버섯 |
| w3-푸드 머스타드 |
| w3-푸드 민트 |
| w3-푸드-올리브 |
| w3-푸드-오렌지 |
| w3-음식 완두콩 |
| w3-식품-복숭아 |
| w3-음식 배 |
| w3-푸드-피스타치오 |
| w3-푸드플럼 |
| w3-푸드-라즈베리 |
| w3-식품 사프란 |
| w3-식품-연어 |
| w3-푸드 스피어민트 |
| w3-푸드 스쿼시 |
| w3-식품-딸기 |
| w3-푸드-토마토 |
| w3-식품-밀 |
| w3-음식-와인 |
위장 색상
| w3-카모-브라운 |
| w3-camo-red |
| w3-camo-olive |
| w3-camo-field |
| w3-camo-earth |
| w3-camo-sand |
| w3-camo-tan |
| w3-camo-sandstone |
| w3-camo-dark-green |
| w3-camo-forest |
| w3-camo-light-green |
| w3-camo-green |
| w3-camo-dark-grey |
| w3-camo-grey |
| w3-camo-black |
예시
<div class="w3-camo-earth">Camouflaged Truck</div>
<div
class="w3-camo-grey">Camouflaged Ship</div>
CSS 다운로드 »
위장 색상은 연방 표준 595 에 정의되어 있습니다.