Color Picker
Color Picker — ทำงานในเบราว์เซอร์ ไม่บันทึกข้อมูล
ตัวเลือกสี
เลือกสีด้วยตัวเลือกสีของระบบ จะเห็น HEX, RGB และ HSL พร้อมกัน ถ้าต้องการแค่ RGB↔HEX ให้ใช้ตัวแปลง RGB HEX
วิธีใช้
- กดเลือกสี แล้วเลือกในตัวเลือกสีเนทีฟของ OS ค่าเริ่มต้นคือ #1a5cff
- สวอตช์ด้านล่างและช่อง HEX, RGB และ HSL อัปเดตร่วมกัน
- การแก้ HEX อัปเดต RGB และ HSL ด้วย HEX สั้น 3 หลักถูกขยายเป็น 6 หลัก
- คัดลอก HEX ใส่ HEX ปัจจุบันลงคลิปบอร์ด
- รีเซ็ต คืนน้ำเงินเริ่มต้น ช่อง RGB และ HSL เป็นอ่านอย่างเดียว
แนวคิดหลัก
ตัวเลือกสีแสดงสีที่เลือกด้วยตาเป็น HEX, RGB และ HSL พร้อมกัน HEX พบบ่อยที่สุดใน CSS RGB เป็น 0–255 คั่นจุลภาค HSL คือมุมฮิว ความอิ่มตัว และความสว่าง มีล็อกอัปเดตภายในเพื่อไม่ให้ตัวเลือกสีกับช่อง HEX ทับกัน UI ตัวเลือกเนทีฟต่างกันตาม OS กล่องสวอตช์ใช้ HEX ปัจจุบันเป็นพื้นหลังเพื่อเห็นคอนทราสต์ทันที ช่อง HEX สูงสุด 7 ตัวอักษร
จอนี้โฟกัสการเลือกและตรวจ HSL หากจะเปลี่ยนตัวเลข RGB เร็ว ใช้การแปลง RGB HEX หากจะสุ่มพิกเซลจากรูป ใช้การดึงสีจากรูป ค่าสีไม่ถูกบันทึกบนเซิร์ฟเวอร์ ไม่มีช่องแก้ RGB หรือ HSL ด้วยมือ ตัวเลขแสดงอย่างเดียว ออกจากหน้าแล้วสีที่เลือกหาย จึงคัดลอก HEX ถ้าต้องการ
ตัวอย่าง
ค่าเริ่มต้น #1a5cff คือ RGB 26, 92, 255 และ HSL ประมาณ 224°, 100%, 55% วาง HEX จากคู่มือแบรนด์ลงช่อง ตัวเลือกและสวอตช์จะตาม หลังเลือกสีปุ่มหรือลิงก์ ให้คัดลอก HEX ใส่สไตล์ชีต #fff ขยายเป็น #ffffff ด้วย RGB 255, 255, 255 สำหรับปุ่มพื้นมืด ตรวจบนสวอตช์ว่าความสว่าง HSL ไม่ต่ำเกินไป
ที่เกี่ยวข้อง: ตัวแปลง RGB HEX · ดึงสีจากรูป
คำถามที่พบบ่อย
HEX, RGB และ HSL ปรากฏทั้งหมดในตัวเลือกสีหรือไม่?
ใช่ การเปลี่ยนตัวเลือกหรือ HEX อัปเดตทั้งสามช่อง RGB และ HSL แสดงอย่างเดียวและแก้ตรงไม่ได้ การมีสามสัญลักษณ์ในที่เดียวสะดวกสำหรับเอกสารโทเค็นออกแบบ HSL มีประโยชน์เมื่อตัดสินการปรับความอิ่มตัว
พิมพ์รหัส HEX โดยตรงได้หรือไม่?
ได้ สูงสุด 7 ตัวอักษรรวม # รหัส 3 หลักอย่าง #abc ขยายเป็น #aabbcc อักขระผิดถูกละเลย สตริงความยาวผิดอาจแยกไม่สำเร็จและคงสีเดิม เฉพาะ hex 6 หลักที่เชื่อถือได้
ตัวแปลง RGB HEX ต่างจากตัวเลือกสีอย่างไร?
ตัวแปลงสลับช่อง RGB/HEX หน้านี้มีตัวเลือกเนทีฟบวก HSL และสวอตช์ ใช้ตัวแปลงสำหรับตัวเลขอย่างเดียว ใช้เครื่องมือนี้เพื่อเลือกด้วยตา ตัวแปลงไม่มีตัวเลือก ใช้หน้านี้หากต้องการสวอตช์และ HSL
ปุ่มคัดลอก HEX อยู่ที่ไหน?
คัดลอก HEX ด้านล่าง เบราว์เซอร์ที่รองรับใส่ #rrggbb ลงคลิปบอร์ด หากสิทธิ์คลิปบอร์ดถูกบล็อก การคัดลอกอาจล้มเหลวเงียบ แล้วลากช่อง HEX เอง
แก้ค่า HSL โดยตรงได้หรือไม่?
ช่อง HSL เป็นอ่านอย่างเดียว หากจะจับฮิว ความอิ่มตัว และความสว่างเป็นตัวเลข ใช้ตัวเลือกหรือเปลี่ยน HEX การเลื่อนวงล้อตัวเลือกอัปเดตมุมฮิว HSL ไม่มีอินพุตตัวเลขความอิ่มตัว/ความสว่าง
สีที่เลือกถูกบันทึกบนเซิร์ฟเวอร์หรือไม่?
ไม่ถูกบันทึกหรือส่ง รีเฟรชกลับสีเริ่มต้น รีเฟรชกลับ #1a5cff หากจะเก็บหลายสี ให้จด HEX ที่คัดลอกแยก
ตรวจทานล่าสุด: 2026-09-04