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

ไล่สีจาก สีไซแอน ไป สีน้ำเงิน

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

สี

ผสมใน

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

แบบ
90°

CSS

background: linear-gradient(90deg, #00ffff, #00e8ff, #00d1ff, #00b9ff, #00a0ff, #0087ff, #006cfd, #0048ff, #0000ff);
background: linear-gradient(90deg in oklab, #00ffff, #0000ff);

Tailwind CSS v4

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

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

7

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

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

ผสมในตัวอย่างการไล่สีสีตรงกลางความสว่างความสด
OKLab#00a0ff67.9%0.198
OKLCH#00a8e567.9%0.234
sRGB#0080ff61.4%0.211
LCH#00a2d565.7%0.34
HSL#0080ff61.4%0.211

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

ทำการไล่สีจาก สีไซแอน ไป สีน้ำเงิน ใน CSS อย่างไร

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

สีที่อยู่กึ่งกลางระหว่าง สีไซแอน กับ สีน้ำเงิน คือสีอะไร

เมื่อผสมใน OKLab สีกึ่งกลางระหว่าง สีไซแอน กับ สีน้ำเงิน คือ #00a0ff ส่วนการผสมใน sRGB ปกติได้ #0080ff

ทำการไล่สีจาก สีไซแอน ไป สีน้ำเงิน ใน Tailwind CSS อย่างไร

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