RGB / Hex แปลง
การแปลงระหว่างรูปแบบสี RGB และ HEX
RGB/HEX Converter
Convert between RGB and HEX colors
RGB เป็น HSL Converter เป็นเครื่องมือแปลงสีที่จำเป็นสำหรับนักออกแบบและนักพัฒนา แปลงค่าสี RGB เป็นรูปแบบ HSL ได้ทันที ทำให้สามารถควบคุมสีได้ดีขึ้น ปรับแต่งสีได้ง่ายขึ้น และปรับแต่งสีได้ง่ายขึ้นใน CSS และโปรเจ็กต์การออกแบบ
ตัวแปลง RGB HEX
สีที่ป้อน
ป้อนรหัสฐานสิบหก ค่า RGB หรือวางการอ้างอิงสี
ดูผลลัพธ์
ดูการแปลงเป็นรูปแบบ HSL ทันทีพร้อมการแสดงตัวอย่างภาพ
ทำความเข้าใจส่วนประกอบ
เรียนรู้ว่าเฉดสี (H) ความอิ่มตัว (S) และความสว่าง (L) หมายถึงอะไร
ปรับแต่ง
ใช้แถบเลื่อนเพื่อปรับค่า HSL และดูการเปลี่ยนแปลงแบบเรียลไทม์
คัดลอกค่า
คลิกปุ่มคัดลอกเพื่อหยิบรหัสสีที่แปลงแล้ว
ใช้ใน CSS
ใช้ค่า HSL ในสไตล์ชีตของคุณเพื่อการปรับแต่งสีที่ง่ายขึ้น
Frequently Asked Questions
ความแตกต่างระหว่าง RGB และ HEX คืออะไร?
RGB ใช้ค่าทศนิยม 0-255, HEX ใช้เลขฐานสิบหก 00-FF
RGBA คืออะไร?
RGB พร้อมช่องอัลฟ่าเพื่อความโปร่งใส
ฉันสามารถใช้สิ่งนี้ในการพิมพ์ได้หรือไม่?
HEX/RGB ใช้สำหรับสีของหน้าจอ ให้ใช้ CMYK ในการพิมพ์
การแสดงตัวอย่างสีมีความแม่นยำเพียงใด?
แม่นยำมาก - ใช้การแสดงสีของเบราว์เซอร์
เหตุใดจึงใช้ HSL แทน RGB
HSL ใช้งานง่ายกว่าสำหรับการรับรู้ของมนุษย์ การปรับความอิ่มตัวหรือความสว่างใน HSL นั้นง่ายกว่าการคำนวณค่า RGB ใหม่ ทำให้การปรับแต่งสีและการเปลี่ยนแปลงต่างๆ ง่ายขึ้น
ความอิ่มตัวหมายถึงอะไรใน HSL
ความอิ่มตัว (0-100%) ควบคุมความเข้มของสี 0% คือระดับสีเทา 100% คือสีล้วน จะกำหนดว่าสีจะสดใสหรือจางลงเพียงใด
ความเบาหมายถึงอะไรใน HSL
ความสว่าง (0-100%) ควบคุมความสว่าง 0% เป็นสีดำ 50% เป็นสีบริสุทธิ์ 100% เป็นสีขาว จะกำหนดว่าสีจะปรากฏมืดหรือสว่างเพียงใด
ฉันสามารถใช้สี HSL ในเบราว์เซอร์ทั้งหมดได้หรือไม่
ใช่ ไวยากรณ์สี HSL ได้รับการสนับสนุนในเบราว์เซอร์สมัยใหม่ทั้งหมด คุณสามารถใช้ hsl() ได้โดยตรงใน CSS โดยไม่ต้องใส่คำนำหน้าผู้ขาย
ฉันจะสร้างรูปแบบสีได้อย่างไร
รักษาเฉดสีให้คงที่และปรับความอิ่มตัวและความสว่าง การลดความอิ่มตัวจะสร้างโทนสีที่ปิดเสียง ในขณะที่การลดความสว่างจะสร้างเฉดสีที่เข้มขึ้น
HSL และ HSLA มีความแตกต่างหรือไม่?
HSLA มีช่องอัลฟ่าเพื่อความโปร่งใส HSLA(hue, saturation%, lightness%, alpha) ช่วยให้คุณควบคุมความทึบได้ตั้งแต่ 0 (โปร่งใส) ถึง 1 (ทึบแสง)
Tool Information
Related Tools You Might Like
Color Palette Generator จากภาพ
สารสกัดสีที่โดดเด่นจากภาพ
เครื่องกําเนิดไฟฟ้า CSS
สร้าง CSS Gradients ที่กําหนดเองด้วย Preview
WCAG Contrast เช็ค
ตรวจสอบความต้านทานสีตามมาตรฐาน WCAG
เครื่องกําเนิดสัญญาณดิจิตอล
สร้างสัญญาณดิจิตอลแบบสไตล์ด้วยตัวอักษรที่แตกต่างกัน
เครื่องกําเนิดไฟฟ้า Box Shadow
สร้าง CSS Box Shadows
เครื่องกําเนิดไฟฟ้า Shadow
สร้าง CSS Text Shadows
เครื่องคํานวณปริมาณ Surfboard
การคํานวณปริมาณ surfboard ที่สมบูรณ์แบบขึ้นอยู่กับน้ําหนักของคุณระดับประสบการณ์และเงื่อนไขคลื่น
Wave Height แปลง
แปลงระหว่างการวัดความสูงของคลื่นที่แตกต่างกัน (ความสูงของใบหน้า, ระดับฮาเวียน, น้ําแตกของทะเล)
สกูบา Dive Planner
การวางแผนการดูดสกูบของคุณด้วยข้อ จํากัด ความลึกเวลาด้านล่างและความต้องการความปลอดภัย