ข้ามไปยังเครื่องมือเลือกสี

ไล่สีจาก สีดำ ไป สีม่วงไวโอเล็ต

การไล่สีจาก สีดำ ไป สีม่วงไวโอเล็ต แบบนุ่มนวลใน CSS ผสมใน OKLab ตรงกลางจึงยังสดใส เปลี่ยนมุม เพิ่มสี แล้วคัดลอกโค้ดได้

สี

ผสมใน

OKLab ทำให้ตรงกลางยังสดใส ส่วน sRGB เป็นวิธีผสมของเบราว์เซอร์รุ่นเก่า และมักกลายเป็นสีเทาตรงกลาง

แบบ
90°

CSS

background: linear-gradient(90deg, #000000, #060106, #1f0b1f, #3c1c3c, #5c2f5c, #7e427e, #a256a2, #c76cc7, #ee82ee);
background: linear-gradient(90deg in oklab, #000000, #ee82ee);

Tailwind CSS v4

bg-linear-90/oklab from-[#000000] to-[#ee82ee]

สีตลอดแนวการไล่สี

7

สีดำ และ สีม่วงไวโอเล็ต ผสมกันอย่างไรในแต่ละปริภูมิสี

สีสองสีเดียวกันให้สีตรงกลางต่างกัน ขึ้นอยู่กับปริภูมิที่เบราว์เซอร์ใช้ผสม ด้านล่างคือสีที่ตำแหน่ง 50% พอดี สองสีนี้ผสมกันแทบเหมือนกันในทุกปริภูมิ: สีตรงกลางคือ #5c2f5c ใน OKLab และ #774177 ใน sRGB จะเลือกแบบไหนก็ได้

ผสมในตัวอย่างการไล่สีสีตรงกลางความสว่างความสด
OKLab#5c2f5c38.1%0.093
OKLCH#5c2f5c38.1%0.093
sRGB#77417746.2%0.106
LCH#70417045%0.093
HSL#7f397f46.5%0.134

คำถามเกี่ยวกับการไล่สีนี้

ทำการไล่สีจาก สีดำ ไป สีม่วงไวโอเล็ต ใน CSS อย่างไร

ใช้ background: linear-gradient(90deg in oklab, #000000, #ee82ee) และเพิ่มบรรทัดแบบ sRGB ไว้ก่อนหน้าสำหรับเบราว์เซอร์ที่เก่ามาก การผสมใน OKLab ใช้ได้กับเบราว์เซอร์ปัจจุบันทุกตัว

สีที่อยู่กึ่งกลางระหว่าง สีดำ กับ สีม่วงไวโอเล็ต คือสีอะไร

เมื่อผสมใน OKLab สีกึ่งกลางระหว่าง สีดำ กับ สีม่วงไวโอเล็ต คือ #5c2f5c ส่วนการผสมใน sRGB ปกติได้ #774177

ทำการไล่สีจาก สีดำ ไป สีม่วงไวโอเล็ต ใน Tailwind CSS อย่างไร

ใน Tailwind CSS v4 ใช้คลาส bg-linear-90/oklab from-[#000000] to-[#ee82ee]