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

ไล่สีจาก สีไซแอน ไป สีเขียว

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

สี

ผสมใน

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

แบบ
90°

CSS

background: linear-gradient(90deg, #00ffff, #00efe2, #00dfc6, #00cfaa, #00bf8e, #00af72, #009f55, #009035, #008000);
background: linear-gradient(90deg in oklab, #00ffff, #008000);

Tailwind CSS v4

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

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

7

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

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

ผสมในตัวอย่างการไล่สีสีตรงกลางความสว่างความสด
OKLab#00bf8e71.3%0.149
OKLCH#00c28f71.3%0.166
sRGB#00c08071.2%0.16
LCH#00c18970.9%0.168
HSL#00c06070.6%0.188

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

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

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

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

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

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

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