การออกแบบและสี
ตัวเลือกสี จานสี ไล่ระดับสี และตัวตรวจสอบคอนทราสต์
ตัวเลือกและตัวแปลงสี
เลือกสีและแปลงระหว่าง HEX, RGB, HSL และ OKLCH
ใหม่ ตัวตรวจสอบคอนทราสต์สี
ตรวจสอบอัตราส่วนคอนทราสต์ WCAG AA/AAA ระหว่างสีข้อความและสีพื้นหลัง
ใหม่ ตัวสร้างไล่ระดับสี CSS
สร้างไล่ระดับสี CSS แบบเส้นตรง แบบรัศมี และแบบกรวย พร้อมตัวอย่างแบบสด
ใหม่ ตัวสร้าง CSS Box-Shadow
สร้างเงากล่อง CSS แบบหลายชั้นพร้อมค่าพรีเซ็ตและตัวอย่างแบบสด คัดลอก CSS, ค่า หรือสไตล์ React ได้ทันที
ใหม่ ตัวสร้างจานสี
สร้างจานสีแบบคู่ตรงข้าม แบบใกล้เคียง แบบสามสี และแบบโมโนโครม
ใหม่ ตัวสร้าง Cubic Bezier
ออกแบบเส้นโค้ง easing ของ CSS โดยลากจุดควบคุม พร้อมตัวอย่างแบบสด
ใหม่ ตัวสร้าง Border Radius
สร้างมุมโค้ง CSS และรูปทรงหยดน้ำแบบออร์แกนิกด้วยภาพ
ใหม่ CSS Flexbox Playground
ปรับคุณสมบัติ flex พร้อมตัวอย่างแบบสดและคัดลอก CSS
ใหม่ CSS Grid Playground
ปรับคอลัมน์ ช่องว่าง และการจัดแนวของกริด พร้อมตัวอย่างแบบสดและ CSS
ใหม่ ตัวสร้าง Glassmorphism
ออกแบบการ์ดกระจกฝ้าและคัดลอก CSS พร้อมตัวอย่างแบบสด
ใหม่ ตัวสร้าง CSS Text-Shadow
ปรับเงาข้อความ CSS พร้อมตัวอย่างแบบสดและคัดลอกโค้ด
ใหม่ ตัวผสมสี
ผสมสองสีในอัตราส่วนใด ๆ และคัดลอกผลลัพธ์หรือขั้นใดก็ได้
ใหม่ เลือกสีจากรูปภาพ
เลือกสีใดก็ได้จากรูปภาพและดึงพาเลตสีหลักออกมาเป็น HEX, RGB และ HSL
ใหม่ Pixel Art Maker
Draw pixel art on a customizable grid, pick colors, and export as PNG — in your browser.
ใหม่ Color Token Generator
Generate a full design-token scale (50–950 shades) from a single base color — CSS, Tailwind or JSON.