0

เครื่องกำเนิดการไล่ระดับสีเชิงเส้น CSS

สร้างการไล่ระดับสี CSS แบบมองเห็นได้: แบบเชิงเส้น แนวรัศมี หรือทรงกรวย แถบเลื่อนมุม และการหยุดสีสูงสุด 6 สีพร้อมการแสดงตัวอย่างแบบเต็มความกว้างแบบสดและโค้ดที่คัดลอกได้

90°
กำลังประมวลผล... 0%

ผลลัพธ์

หน้านี้จะเปิดตัวสร้างการไล่ระดับสีโดยเลือกประเภทเชิงเส้นไว้แล้ว ลากแถบเลื่อนมุมเพื่อหมุนการเฟด ปรับการหยุดสี และดูตัวอย่างแบบเต็มความกว้างพร้อมการอัปเดตบรรทัด CSS ในทุกอินพุต

linear-gradient() ระบายสีตามเส้นตรง ซึ่งเป็นการไล่ระดับสีที่ใช้มากที่สุดใน CSS 90 องศาวิ่งจากซ้ายไปขวา 180 องศาจากบนลงล่าง และมุมใดๆ ที่อยู่ระหว่างนั้นให้เส้นทแยงมุม ตำแหน่งหยุดเป็นเปอร์เซ็นต์จะตัดสินว่าแต่ละแถบสีจะเริ่มผสมสีถัดไปที่ใด

เมื่อการแสดงตัวอย่างดูดี ให้คัดลอกเส้นพื้นหลังลงในสไตล์ชีตของคุณ หากคุณต้องการจุดเริ่มต้นแทนที่จะเป็นกระดานชนวนที่ว่างเปล่า หน้าพระอาทิตย์ตก มหาสมุทร และสีพาสเทลให้เปิดเครื่องมือเดียวกันนี้ซึ่งมีคู่สีที่ได้รับการพิสูจน์แล้วซึ่งโหลดไว้แล้ว