Softonic

ตัวแปลงรหัสสี

ขั้นตอน 1 / 2
ถัดไป

วางสีในรูปแบบ HEX (#ff6600 หรือ #f60), rgb(255, 102, 0), คั่นด้วยเครื่องหมายจุลภาค 255, 102, 0 หรือ hsl(24, 100%, 50%) แล้วตัวแปลงจะแสดงผลในอีกสองรูปแบบทันที พร้อมตัวอย่างสีแบบสดและปุ่มคัดลอกหนึ่งคลิกในแต่ละรูปแบบ

การแปลงรหัสสีทำงานอย่างไร

  1. 1

    ป้อนสีในรูปแบบที่รองรับ

    HEX (#abc, #abcdef), rgb(r, g, b), คั่นด้วยจุลภาค r, g, b หรือ hsl(h, s%, l%)

  2. 2

    แปลงเป็นค่าภายใน

    เครื่องมือแปลงค่าเป็น RGB ภายใน จากนั้นจึงหาค่าเทียบเท่าในรูปแบบ HEX และ HSL จากค่านั้น

  3. 3

    แสดงผลทุกรูปแบบ

    สตริง HEX, RGB และ HSL ที่ตรงกันแสดงเคียงข้างกัน

  4. 4

    ตัวอย่างสีแบบสด

    แสดงสีผลลัพธ์ให้เห็นในทันที เพื่อให้คุณยืนยันการแปลงก่อนคัดลอก

รูปแบบที่รองรับ

รูปแบบ ตัวอย่าง การใช้งาน
HEX 3 หลัก #F66 รูปแบบย่อ ใช้เฉพาะสีที่มีตัวเลขซ้ำกัน
HEX 6 หลัก #FF6B6B ค่าเริ่มต้นสำหรับ CSS และการออกแบบกราฟิก
RGB rgb(255, 107, 107) CSS, JS, ซอฟต์แวร์ออกแบบ
คั่นด้วยจุลภาค 255, 107, 107 เหมือน RGB แต่ไม่ใช้รูปแบบฟังก์ชัน
HSL hsl(0, 100%, 71%) เข้าใจเรื่องสี/ความอิ่มตัว/ความสว่างได้ง่ายกว่า

ควรใช้รูปแบบใดเมื่อใด

  • HEX สำหรับ CSS แบบคงที่และการส่งมอบงานออกแบบ
  • RGB เมื่อส่งค่าสีไปยัง JavaScript หรือซอฟต์แวร์ออกแบบ
  • HSL เมื่อปรับความสว่างหรือความอิ่มตัว เพราะเข้าใจได้ง่ายกว่า RGB

รูปแบบอื่น เช่น HSV, CMYK, LAB, LCH และ OKLCH มีอยู่ในเครื่องมือออกแบบ รูปแบบเหล่านี้แสดงสีเดียวกันด้วยวิธีที่ต่างกัน แต่ตัวแปลงนี้มุ่งเน้นสามรูปแบบเว็บพื้นฐานข้างต้น

ความแม่นยำ

  • การแปลงระหว่าง HEX, RGB และ HSL มีความแม่นยำ: HEX กับ RGB เป็นโมเดลสีเดียวกัน และ HSL คำนวณจาก RGB ด้วยสูตรมาตรฐาน
  • ค่า HSL ถูกปัดเป็นจำนวนเต็ม จึงอาจมีการเลื่อนของหลักสุดท้ายเมื่อแปลงไปกลับ สีที่มองเห็นยังคงเหมือนเดิม ใช้ HEX เมื่อต้องการค่าที่ตรงกันทุกบิต

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

ใช้ HEX หรือ rgb() เพื่อความเข้ากันได้กว้าง ใช้ hsl() เมื่อต้องการอ่านง่าย เบราว์เซอร์สมัยใหม่รองรับ oklch() และรูปแบบอื่นด้วย แต่ HEX ยังคงเป็นค่าเริ่มต้นที่ปลอดภัยที่สุด

ไม่ได้ ตัวแปลงรับเฉพาะสีทึบ: HEX 3 หรือ 6 หลัก และ rgb() กับ hsl() ที่ไม่มีช่องอัลฟา ให้ใช้ rgba() หรือ HEX 8 หลักใน CSS ของคุณโดยตรง

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

HSL แสดงค่าสี ความอิ่มตัว และความสว่างเป็นจำนวนเต็ม การแปลงไปกลับจึงอาจคลาดเคลื่อนไปหนึ่งหน่วย สีที่มองเห็นเหมือนเดิม ใช้ HEX เมื่อต้องการค่าที่ตรงกันเป๊ะ

เครื่องมือที่เกี่ยวข้อง

ตารางอ้างอิง ASCII

ตาราง ASCII ครบตั้งแต่ 0 ถึง 127 พร้อมค่าเลขฐานสิบ ฐานสิบหก ฐานแปด ฐานสอง และรูปแบบการอ้างอิงอักขระแบบตัวเลขของ HTML รวม NUL, LF และ DEL

อ้างอิงตัวอักษร HTML

รายการที่สามารถค้นหาได้ขององค์ประกอบ HTML พร้อมรหัสชื่อและรหัสตัวเลข รวมถึงฟังก์ชันสำเนาด้วยคลิกเดียวสำหรับตัวอักษรพิเศษและสัญลักษณ์ต่างๆ

ตารางอ้างอิงแป้นพิมพ์ลัด

ค้นหาแป้นพิมพ์ลัดเริ่มต้นตามเอกสารของ VS Code, Chrome และ Bash ที่ใช้ GNU Readline บน macOS, Windows และ Linux

ตัวตรวจสอบความถูกต้องของ JSON

ตรวจสอบไวยากรณ์ JSON และตรวจจับเครื่องหมายจุลภาคต่อท้าย เครื่องหมายอัญประกาศที่ผิด คีย์ซ้ำ และโครงสร้างที่ผิดรูปแบบ พร้อมระบุตำแหน่งข้อผิดพลาดอย่างแม่นยำ

เครื่องมือตรวจสอบ IBAN

ตรวจสอบความยาวตามประเทศ โครงสร้างภายในประเทศ และเลข MOD 97-10 ของ IBAN ในเบราว์เซอร์ ไม่มีการอัปโหลดและไม่ยืนยันว่าบัญชีมีอยู่จริง

ตัวลดรูปพีชคณิตบูลีน

ประเมินนิพจน์บูลีนสำหรับทุกชุดอินพุตและดูตารางค่าความจริงที่สมบูรณ์ รองรับตัวแปรสูงสุดห้าตัวและตัวดำเนินการ &, |, !, ^

เครื่องมือนี้มีให้บริการในภาษาอื่น