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

ไล่สีจาก สีไซแอน ไป สีม่วงไวโอเล็ต

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

สี

ผสมใน

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

แบบ
90°

CSS

background: linear-gradient(90deg, #00ffff, #66f1fd, #8be3fb, #a5d5f9, #b9c6f7, #c9b7f5, #d8a7f3, #e495f0, #ee82ee);
background: linear-gradient(90deg in oklab, #00ffff, #ee82ee);

Tailwind CSS v4

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

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

7

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

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

ผสมในตัวอย่างการไล่สีสีตรงกลางความสว่างความสด
OKLab#b9c6f783.4%0.07
OKLCH#a2c9ff83.4%0.17
sRGB#77c1f778.2%0.107
LCH#8fcfff83.4%0.173
HSL#4444f351.5%0.251

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

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

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

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

เมื่อผสมใน OKLab สีกึ่งกลางระหว่าง สีไซแอน กับ สีม่วงไวโอเล็ต คือ #b9c6f7 ส่วนการผสมใน sRGB ปกติได้ #77c1f7

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

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