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

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

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

สี

ผสมใน

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

แบบ
90°

CSS

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

Tailwind CSS v4

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

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

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, #ff7f50, #ee82ee) และเพิ่มบรรทัดแบบ sRGB ไว้ก่อนหน้าสำหรับเบราว์เซอร์ที่เก่ามาก การผสมใน OKLab ใช้ได้กับเบราว์เซอร์ปัจจุบันทุกตัว

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

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

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

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