ตัวแปลงรหัสสี
HEX
#3b82f6RGB
rgb(59, 130, 246)HSL
hsl(217, 91%, 60%)OKLCH
oklch(0.623 0.188 259.8)HSL Adjustment
Contrast Ratio (WCAG)
Compare color:
샘플 텍스트
Contrast ratio: 3.68:1
WCAG: AA Large
อัปเดตล่าสุด: 2026 · เครื่องมือออนไลน์ฟรี
ตัวแปลงรหัสสี คืออะไร?
เครื่องมือแปลงสีออนไลน์ฟรี แปลงระหว่างรหัส HEX, RGB, HSL และ OKLCH ได้ทันที พร้อมคำนวณอัตราส่วนคอนทราสต์ WCAG ระหว่างสองสีเพื่อตรวจสอบความสอดคล้องด้านการเข้าถึงได้ง่าย
วิธีใช้งาน
- 1ป้อนสี— ใช้ตัวเลือกสีหรือป้อนข้อความ รองรับรูปแบบ HEX, rgb(), hsl()
- 2ดูรูปแบบ— รูปแบบ HEX, RGB, HSL และ OKLCH แสดงพร้อมกัน
- 3คัดลอกค่า— ใช้ปุ่มคัดลอกของแต่ละรูปแบบเพื่อคัดลอกค่า CSS
- 4ตรวจสอบอัตราส่วนคอนทราสต์— ตั้งค่าสีเปรียบเทียบเพื่อตรวจสอบอัตราส่วนคอนทราสต์ WCAG
เครื่องมือที่เกี่ยวข้อง
ตัวแปลง Timestampเครื่องมือออนไลน์ฟรีสำหรับแปลงระหว่าง Unix timestamp และวันที่แบบสองทิศทาง รองรับทั้งวินาที (10 หลัก) และมิลลิวินาที (13 หลัก) รวมถึงไทม์โซน KST, JST, UTC และรูปแบบ ISO 8601 พร้อมเวลาแบบสัมพัทธ์
ตัวสร้าง CSS Gradientเครื่องมือสร้าง CSS gradient แบบภาพออนไลน์ฟรี ออกแบบ gradient แบบ linear, radial และ conic เพิ่มจุดหยุดสี ปรับมุม แล้วคัดลอกโค้ด CSS พร้อมใช้สำหรับพื้นหลังเว็บไซต์
ตัวสร้าง CSS Box Shadowเครื่องมือสร้าง CSS box-shadow ออนไลน์ฟรี ปรับค่า offset, blur, spread, สี และ inset พร้อมแสดงตัวอย่างเงาแบบเรียลไทม์ และสร้างโค้ด CSS box-shadow พร้อมคัดลอก
คำถามที่พบบ่อย
OKLCH คือการแสดงรูปทรงกระบอกของปริภูมิสี Oklab ซึ่งเป็นปริภูมิสีที่สม่ำเสมอที่สุดในการรับรู้ รองรับใน CSS Color Level 4
วัดความแตกต่างของความสว่างระหว่างข้อความและสีพื้นหลัง AA ต้องการอย่างน้อย 4.5:1 AAA ต้องการ 7:1
ปัจจุบันรองรับเฉพาะสีทึบ (RGB, HEX 6 หลัก) RGBA และ HSLA จะเพิ่มในอนาคต
ได้ คุณสามารถวางผลลัพธ์ของแต่ละรูปแบบลงใน CSS ได้โดยตรง
ไม่ การแปลงสีทั้งหมดเกิดขึ้นในเบราว์เซอร์ของคุณ