ไลบรารี สี 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>
US Highway Colors
| w3-ทางหลวง-สีน้ำตาล |
| w3-ทางหลวง-สีแดง |
| w3-ทางหลวง-สีส้ม |
| w3-ทางหลวง-รถโรงเรียน |
| w3-ทางหลวง-สีเหลือง |
| w3-ทางหลวง-สีเขียว |
| w3-highway-สีน้ำเงิน |
สีทางหลวงถูกกำหนดไว้ในFederal Standard 595
สีเพื่อความปลอดภัยของสหรัฐอเมริกา
| w3-ความปลอดภัย-สีแดง |
| w3-ความปลอดภัย-สีส้ม |
| w3-ความปลอดภัย-สีเหลือง |
| w3-ความปลอดภัย-สีเขียว |
| w3-ความปลอดภัย-สีน้ำเงิน |
| w3-ความปลอดภัย-สีม่วง |
สีเพื่อความปลอดภัยของสหรัฐอเมริกาถูกกำหนดไว้ใน มาตรฐานของรัฐบาล กลาง 595
สีสัญญาณยุโรป
| w3-สัญญาณ-สีเหลือง |
| w3-สัญญาณ-สีส้ม |
| w3-สัญญาณ-สีแดง |
| w3-สัญญาณ-สีม่วง |
| w3-สัญญาณ-สีน้ำเงิน |
| w3-สัญญาณ-สีเขียว |
| w3-สัญญาณ-สีเทา |
| w3-สัญญาณ-สีน้ำตาล |
| w3-สัญญาณ-สีขาว |
| w3-สัญญาณ-สีดำ |
ตัวอย่าง
<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-สดใส-เขียว-น้ำเงิน |
| w3-สดใส-ม่วง-น้ำเงิน |
| w3-สดใส-แดง-ม่วง |
| 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-food-อะโวคาโด |
| w3-อาหาร-กล้วย |
| w3-อาหาร-เนย |
| w3-food-บลูเบอร์รี่ |
| w3-อาหาร-เชอร์รี่ |
| w3-อาหาร-ช็อคโกแลต |
| w3-food-แครนเบอร์รี่ |
| w3-อาหาร-กาแฟ |
| w3-อาหาร-ไข่ |
| w3-อาหาร-องุ่น |
| w3-อาหาร-กีวี |
| w3-อาหาร-มะนาว |
| w3-อาหาร-มะนาว |
| w3-food-มะม่วง |
| w3-อาหาร-เห็ด |
| w3-อาหาร-มัสตาร์ด |
| w3-food-สะระแหน่ |
| w3-อาหาร-มะกอก |
| w3-อาหาร-ส้ม |
| w3-food-ถั่ว |
| w3-food-ลูกพีช |
| w3-อาหาร-ลูกแพร์ |
| w3-food-พิสตาชิโอ |
| w3-อาหาร-บ๊วย |
| w3-อาหาร-ราสเบอร์รี่ |
| w3-อาหาร-หญ้าฝรั่น |
| w3-อาหาร-ปลาแซลมอน |
| w3-อาหาร-สเปียร์มินต์ |
| w3-อาหาร-สควอช |
| w3-อาหาร-สตรอเบอร์รี่ |
| w3-อาหาร-มะเขือเทศ |
| w3-อาหาร-ข้าวสาลี |
| w3-อาหาร-ไวน์ |
ตัวอย่าง
<div class="w3-food-apple">Apple</div>
<div
class="w3-food-banana">Banana</div>
ดาวน์โหลด CSS »
สีอำพราง
| w3-camo-น้ำตาล |
| w3-camo-สีแดง |
| w3-camo-มะกอก |
| w3-camo-ฟิลด์ |
| w3-camo-เอิร์ ธ |
| w3-camo-ทราย |
| w3-camo-tan |
| w3-camo-หินทราย |
| w3-camo-เขียวเข้ม |
| w3-camo-ป่า |
| w3-camo-เขียวอ่อน |
| w3-camo-สีเขียว |
| w3-camo-สีเทาเข้ม |
| w3-camo-สีเทา |
| w3-camo-สีดำ |
ตัวอย่าง
<div class="w3-camo-earth">Camouflaged Truck</div>
<div
class="w3-camo-grey">Camouflaged Ship</div>
ดาวน์โหลด CSS »
สีลายพรางถูกกำหนดไว้ในFederal Standard 595