ทุกสี ถูกถอดรหัสแล้ว
ค่า Hex, RGB, HSL, CMYK ความกลมกลืนของสี เฉดสี Tailwind ความเปรียบต่าง WCAG
ป้อนรหัส hex 6 หลักใดก็ได้
สีเด่น
แบรนด์เด่น
ดูทั้งหมด →
Organize the world's information
4 สี
Apple
Think different
3 สี
Microsoft
Empower every person and organization
4 สี
Amazon
Work hard. Have fun. Make history.
2 สี
Meta
Helping people connect
1 สี
Bringing the world closer together
2 สี
YouTube
Broadcast yourself
1 สี
Capture and share the world's moments
3 สี
คอลเลกชันเด่น
ดูทั้งหมด →เครื่องมือสี
ดูทั้งหมด →ตรวจสอบความเปรียบต่าง
ตรวจสอบอัตราส่วนคอนทราสต์สีตามแนวทาง WCAG 2.1 ทดสอบการปฏิบัติตามมาตรฐาน AA และ AAA สำหรับข้อความปกติและข้อความขนาดใหญ่
แปลงสี
แปลงระหว่างรูปแบบสี HEX, RGB, HSL, HSV, CMYK และ OKLCH ได้ทันที
สร้างพาเลต
สร้างจานสีที่กลมกลืนโดยใช้โทนสีคู่ตรงข้าม สีใกล้เคียง สีสามเหลี่ยม และสีตรงข้ามแยก
สร้างเฉดสี
สร้างสเกลเฉดสีแบบ Tailwind CSS (50–950) จากสีพื้นฐานใดก็ได้สำหรับระบบการออกแบบ
จำลองตาบอดสี
จำลองว่าสีจะปรากฏอย่างไรในสภาวะตาบอดสีเขียว ตาบอดสีแดง ตาบอดสีน้ำเงิน และตาบอดสีทั้งหมด
สร้างไล่เฉดสี
สร้างการไล่ระดับสี CSS แบบเส้นตรงและแบบรัศมีที่สวยงาม พร้อมตัวอย่างแบบเรียลไทม์และโค้ดพร้อมคัดลอก
บทความล่าสุด
ดูทั้งหมด →CSS color-mix(): ผสมสีโดยตรงในเบราว์เซอร์
เรียนรู้ CSS color-mix() เพื่อผสมสีโดยตรงในเบราว์เซอร์ เชี่ยวชาญ syntax, color spaces, กรณีการใช้งานจริง และสร้างพาเลตแบบไดนามิกโดยไม่ต้องใช้ JavaScript
ม.ค. 26, 2026
บทเรียนแนะนำสร้าง Color Picker Web Component ตั้งแต่ต้น
สร้าง color picker ที่เข้าถึงได้เป็น Web Component นำ canvas rendering, hue sliders, alpha channels และ custom events ด้วย Shadow DOM ไปใช้งาน
ม.ค. 21, 2026
บทเรียนแนะนำพื้นที่สีเชิงรับรู้: Lab, LCH, Oklab, OKLCH
สำรวจพื้นที่สีที่สม่ำเสมอเชิงรับรู้ — CIE Lab, LCH, Oklab และ OKLCH เรียนรู้วิธีการออกแบบของแต่ละพื้นที่สี จุดเด่น และวิธีเลือกใช้สำหรับ CSS และงานออกแบบ
ม.ค. 15, 2026
บทเรียนแนะนำColor Proofing: รับประกันความถูกต้องของสีงานพิมพ์
เรียนรู้เทคนิค soft proofing, hard proofing และ press proof เพื่อรับประกันความถูกต้องของการพิมพ์สีจากหน้าจอสู่ผลลัพธ์สุดท้าย
ม.ค. 10, 2026