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

ไล่สีจาก สีม่วงไวโอเล็ต ไป สีปะการัง

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

สี

ผสมใน

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

แบบ
90°

CSS

background: linear-gradient(90deg, #ee82ee, #f083dd, #f284cb, #f485b9, #f684a7, #f88494, #fa8380, #fd816a, #ff7f50);
background: linear-gradient(90deg in oklab, #ee82ee, #ff7f50);

Tailwind CSS v4

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

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

7

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

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

ผสมในตัวอย่างการไล่สีสีตรงกลางความสว่างความสด
OKLab#f684a774.9%0.142
OKLCH#ff77a174.9%0.177
sRGB#f7819f74.2%0.147
LCH#ff75a175.2%0.202
HSL#f66a9d70.9%0.178

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

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

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

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

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

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

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