เครื่องกำเนิดการไล่ระดับสี CSS Radial
สร้างการไล่ระดับสี CSS แบบมองเห็นได้: แบบเชิงเส้น แนวรัศมี หรือทรงกรวย แถบเลื่อนมุม และการหยุดสีสูงสุด 6 สีพร้อมการแสดงตัวอย่างแบบเต็มความกว้างแบบสดและโค้ดที่คัดลอกได้
ผลลัพธ์
หน้านี้จะเปิดเครื่องกำเนิดการไล่ระดับสีโดยเลือกประเภทรัศมีไว้แล้ว: สีจะแผ่ออกจากศูนย์กลางขององค์ประกอบเป็นวงกลมที่มีศูนย์กลางร่วมกัน และทุกครั้งที่คุณเปลี่ยนจุดจะทาสีตัวอย่างใหม่ทันที
Radial-Gradient() เป็นเครื่องมือสำหรับเอฟเฟกต์สปอตไลท์และเอฟเฟกต์เรืองแสง วิกเน็ตต์แบบนุ่มนวล และพื้นหลังที่ต้องใช้จุดโฟกัสมากกว่าทิศทาง ตำแหน่งจุดหยุดในแผนที่เปอร์เซ็นต์ไปยังระยะห่างจากศูนย์กลาง — 0% คือตรงกลาง และ 100% เป็นขอบไกล — ดังนั้นการขันจุดหยุดแรกให้แน่นขึ้นจะทำให้แกนสว่างเล็กๆ กระจายออกไปทำให้เกิดการล้างในวงกว้าง
คัดลอกเส้นพื้นหลังเมื่อตัวอย่างดูถูกต้องแล้ว แถบเลื่อนมุมถูกซ่อนอยู่ในโหมดนี้เนื่องจากวงกลมไม่มีทิศทาง ให้สลับกลับเป็นแบบเส้นตรงหรือทรงกรวย แล้วจะปรากฏขึ้นอีกครั้ง