ตัวแปลงสี

เครื่องมือออนไลน์ฟรีแปลงระหว่างรูปแบบสีได้ทันที โปรแกรมแปลงสีออนไลน์ฟรีรองรับ hex, rgb, hsl, hsv, cmyk และสีที่มีชื่อ รับตัวอย่างสีและข้อมูลการเข้าถึง ไม่มีการสมัครสมาชิก

ตัวแปลงสี คืออะไร?

เครื่องมือสำหรับนักพัฒนาอันทรงพลังที่ออกแบบมาเพื่อช่วยให้คุณทำงานได้อย่างมีประสิทธิภาพมากขึ้น Color Converter ให้ผลลัพธ์ที่แม่นยำทันทีด้วยอินเทอร์เฟซที่สะอาดตาและใช้งานง่าย เหมาะสำหรับนักพัฒนา วิศวกร และผู้เชี่ยวชาญด้านไอที

สูตร

HEX → RGB: split #RRGGBB into decimal ค่าs

RGB → HSL: normalize RGB → find hue/saturation/lightness

HSL → RGB: แปลง via chroma สูตรs

HEX: #RRGGBB (0-255 each)

RGB: rgb(R, G, B) (0-255)

HSL: hsl(H°, S%, L%) (H: 0-360, S/L: 0-100)

วิธีคำนวณ

ป้อนข้อมูลของคุณในฟิลด์ด้านบน
กำหนดค่าตัวเลือกที่มีเพื่อปรับแต่งเอาต์พุต
ดูผลลัพธ์ได้ทันทีพร้อมการอัพเดตแบบเรียลไทม์
คัดลอกหรือส่งออกผลลัพธ์ของคุณเพื่อใช้ในโครงการของคุณ

ตัวอย่าง

อินพุต: #FF5733 (HEX) → RGB: rgb(255, 87, 51) → HSL: hsl(11, 100%, 60%). อินพุต: hsl(200, 50%, 50%) → RGB: rgb(64, 149, 191) → HEX: #4095BF.

ประโยชน์หลัก

Get accurate results instantly in your browser.
ประหยัดเวลาด้วยการคำนวณแบบเรียลไทม์ขณะที่คุณพิมพ์
No data leaves your device - complete privacy.
ใช้งานได้ฟรีบนอุปกรณ์ใดๆ ก็ได้ ไม่จำเป็นต้องลงทะเบียน

ข้อผิดพลาดที่พบบ่อย

ลืมคำนำหน้า # สำหรับสี HEX
Using RGB ค่าs above 255 or below 0
การสับสนช่วงสี HSL (0-360) กับ RGB (0-255)

เคล็ดลับ

Use HSL for intuitive สี adjustments
ใช้ HEX for CSS compatibility
ใช้ภาพตัวอย่างเพื่อตรวจสอบสีของคุณก่อนใช้งาน
Keep a reference of ทั่วไป สี conversions

คำศัพท์สำคัญ

HEX: การแสดง RGB แบบเลขฐานสิบหก
RGB: Red Green Blue สี โมเดล
HSL: โมเดลสี ความอิ่มตัว ความสว่าง
สี space: Mathematical โมเดล for สีs

กรณีใช้งานทั่วไป

แปลงing CSS สี ค่าs
Creating สี schemes from base สีs
การตรงกันing design system สีs
การทำความเข้าใจความสัมพันธ์ของสีผ่าน HSL

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

ความแตกต่างระหว่าง HEX, RGB และ HSL คืออะไร?

HEX คือการแสดงเลขฐานสิบหก 6 หลัก (#FF0000) RGB กำหนดสีเป็นค่าสีแดง/เขียว/น้ำเงิน (rgb(255, 0, 0)) HSL ใช้เฉดสี ความอิ่มตัว และความสว่าง (hsl(0, 100%, 50%))

Which สี รูปแบบ should I use?

HEX เป็นคำที่พบบ่อยที่สุดในการพัฒนาเว็บสำหรับสีธรรมดา RGB ให้การควบคุมช่องสีอย่างละเอียด HSL ใช้งานง่ายที่สุดสำหรับมนุษย์ — ปรับเฉดสีสำหรับสีต่างๆ ความอิ่มตัวของสีสำหรับความเข้ม และความสว่างสำหรับความสว่าง

คืออะไร the HSL advantage?

HSL นั้นมนุษย์สามารถอ่านได้มากกว่า คุณสามารถสร้างโครงร่างสีได้โดยคง S และ L ให้คงที่ในขณะที่เปลี่ยน H สำหรับอธิบาย hsl(0, 50%, 50%) = red, hsl(120, 50%, 50%) = green, hsl(240, 50%, 50%) = blue