A most excellent

Hex Color Picker

Tune HEX and compare HWB, HSL, HSV, RGB, and OKLCH values in one calm workspace.

HEX คัลเลอร์พิกเกอร์

HEX คัลเลอร์พิกเกอร์หนึ่งตัว หกโมเดลสี

ป้อนรหัสสี HEX และดูค่าที่สอดคล้องกันใน RGB, HSL, HSV, HWB และ OKLCH ทันที ขยับแถบเลื่อนและการแสดงผลทั้งหกจะซิงค์แบบเรียลไทม์ รหัส HEX และแฮช URL ซิงค์ร่วมกัน ทำให้บุ๊กมาร์กหรือแชร์สีใดก็ได้ในไม่กี่วินาที

แปลง HEX เป็น RGB แบบเรียลไทม์

ป้อนสี HEX เช่น #3b82f6 และค่า RGB จะอัปเดตทันที HEX ไฟน์เดอร์ยังรับรหัสย่อสามหลักด้วย

ตัวค้นหารหัส HEX พร้อมแชร์ URL

ทุกครั้งที่ปรับสี แฮช URL จะอัปเดตโดยอัตโนมัติ ทำให้ตัวค้นหารหัส HEX นี้กลายเป็นบุ๊กมาร์กที่แชร์ได้ ส่งลิงก์ให้สมาชิกทีมและพวกเขาจะเห็นสีเดียวกันทุกประการ

หกโมเดลสีซิงค์พร้อมกัน

HEX, RGB, HSL, HSV, HWB และ OKLCH อัปเดตพร้อมกันทั้งหมด การเปลี่ยนโมเดลไม่ทำให้สีหาย — เหมาะสำหรับ design token และตัวแปร CSS

อินเทอร์เฟซ HEX คัลเลอร์พิกเกอร์แสดงแถบเลื่อนสำหรับโมเดลสี HSL, RGB และ OKLCH

ตัวค้นหารหัสสี

ค้นหารหัสสีใดก็ได้ — HEX, RGB, HSL, OKLCH

ตัวค้นหารหัสสีนี้ครอบคลุมมาตรฐานทั้งหมดที่ใช้ในการออกแบบเว็บ การพัฒนาแอป และการพิมพ์ดิจิทัล HEX คือรูปแบบเริ่มต้นสำหรับ CSS และ HTML RGB คือรูปแบบพื้นฐานของหน้าจอ HSL เป็นรูปแบบที่มนุษย์อ่านได้สำหรับนักออกแบบ OKLCH คือรูปแบบการรับรู้ถัดไปใน CSS Color Level 4 ทั้งสี่พร้อมใช้งานพร้อมกัน — คัดลอกที่เหมาะกับเวิร์กโฟลว์ของคุณ

ตัวค้นหารหัสสีแสดงค่า HEX, RGB, HSL และ OKLCH สำหรับสีน้ำเงินสดใส
HTML คัลเลอร์พิกเกอร์แสดงค่ารหัสสี HEX และ RGB ที่พร้อมสำหรับ CSS

HTML คัลเลอร์พิกเกอร์

HTML คัลเลอร์พิกเกอร์สำหรับ CSS และการออกแบบเว็บ

ไม่ว่าคุณจะเขียนสไตล์อินไลน์ กำหนด design token หรือดูแลไลบรารีตัวแปร CSS HTML คัลเลอร์พิกเกอร์นี้มอบโค้ดที่คุณต้องการอย่างแม่นยำ ปรับเฉด ความอิ่มตัว และความสว่างด้วยสายตา จากนั้นคัดลอกรหัสสี HEX หรือค่า CSS rgb() ไปยัง stylesheet ของคุณโดยตรง

  • สร้างค่า CSS ที่ถูกต้องทันที: hex, rgb(), hsl(), hwb() และ oklch()
  • การซิงค์แฮช URL ช่วยให้บันทึกและแชร์สีใดก็ได้เป็นบุ๊กมาร์กเบราว์เซอร์
  • ตัวบ่งชี้แกมมัตทำเครื่องหมายสีที่มีเฉพาะใน Display-P3 และอยู่นอก sRGB
  • ทำงานออฟไลน์ได้ — ไม่มีการเรียก API ไม่พึ่งพาเซิร์ฟเวอร์

RGB คัลเลอร์พิกเกอร์

RGB คัลเลอร์พิกเกอร์พร้อมแถบเลื่อนความแม่นยำ

RGB คัลเลอร์พิกเกอร์พร้อมแถบเลื่อนช่องอิสระสามตัวสำหรับแดง เขียว และน้ำเงิน

ช่อง RGB เฉพาะทาง

แถบเลื่อน R, G และ B อิสระสามตัวสำหรับผสมสีตามช่อง RGB พิกเกอร์แสดงค่าทศนิยมและรหัส HEX แบบเรียลไทม์ขณะลาก

RGB พิกเกอร์แสดงการแปลงสดระหว่างค่าช่อง RGB และรหัสสี HEX

แปลง RGB เป็น HEX และในทางกลับกัน

วางรหัส HEX ที่รู้จักเพื่อดูการแยกส่วน RGB ทันที หรือปรับแถบเลื่อน RGB พิกเกอร์เพื่อค้นหารหัส HEX ของเฉดที่กำหนดเอง ไม่ต้องใช้ตัวแปลงแยกต่างหาก

RGB คัลเลอร์พิกเกอร์เปรียบเทียบตัวอย่างแกมมัต sRGB และ Display-P3 เคียงข้างกัน

RGB คัลเลอร์พิกเกอร์รองรับแกมมัตกว้าง

สลับระหว่างแกมมัต sRGB และ Display-P3 เพื่อดูว่าสีที่เลือกสามารถแสดงผลบนหน้าจอแกมมัตกว้างได้หรือไม่ ตัวอย่างทั้งสองอัปเดตแบบเคียงข้างกัน

คำถามที่พบบ่อย

คำถามเกี่ยวกับ HEX คัลเลอร์พิกเกอร์