วิธีใช้สร้างพื้นหลังไล่สีและโค้ด CSS
กรอกสองบรรทัด #FF5018 0 และ #235AFF 100 เลือก Linear มุม 90° แล้วตรวจตัวอย่าง เพิ่มสีที่ 50 เพื่อแทรกจุดกลาง ต้องเรียงตำแหน่งไม่ลดลง
ขั้นตอนใช้งานและตรวจข้อมูล
-
เลือก Linear มุม 90 ใส่ #FF5018 0 และ #235AFF 100 คนละบรรทัด
-
กดประมวลผล ดูภาพและตรวจโค้ดที่มี 90deg กับจุด 0% และ 100%
-
ลอง Radial เพื่อเทียบรูปแบบ แล้วนำโค้ดไปทดสอบกับขนาดกล่องจริงทั้งมือถือและคอมพิวเตอร์
เปิดใช้งาน
เปิดสร้างพื้นหลังไล่สีและโค้ด CSS
หากต้องการเข้าใจเหตุผลของผลลัพธ์ อ่าน หลักการและกรณีที่มักเข้าใจผิด
คำถามที่พบบ่อย
ตำแหน่งจุดสีเป็นสัดส่วน ไม่ใช่ความเข้ม หมายถึงอะไร?
ตำแหน่ง 0% คือจุดเริ่มและ 100% คือจุดท้ายของแนวไล่สี สีที่อยู่ระหว่างจุดจะถูกคำนวณผสมโดยเบราว์เซอร์ ส่วนมุมมีผลกับ linear gradient แต่ radial ของเครื่องมือนี้กำหนดเป็นวงรีกึ่งกลาง
ทดลองแล้วควรได้ผลอย่างไร?
สองจุด #FF5018 0 และ #235AFF 100 ได้สีต่อเนื่องจากส้มไปน้ำเงิน
มีข้อจำกัดอะไรที่ต้องตรวจ?
รับ 2–12 จุด เรียงตำแหน่งจากน้อยไปมาก Radial ใช้วงรีกึ่งกลาง ไม่รับ CSS ดิบ