เครื่องกำเนิดการไล่ระดับสี CSS
สร้างการไล่ระดับสี CSS แบบมองเห็นได้: แบบเชิงเส้น แนวรัศมี หรือทรงกรวย แถบเลื่อนมุม และการหยุดสีสูงสุด 6 สีพร้อมการแสดงตัวอย่างแบบเต็มความกว้างแบบสดและโค้ดที่คัดลอกได้
ผลลัพธ์
เขียนการไล่ระดับสีเชิงเส้น (135deg, #2193b0 0%, #6dd5ed 100%) ด้วยมือแล้วโหลดหน้าใหม่เพื่อดูว่าเป็นการวนซ้ำที่ช้า ตัวสร้างนี้จะปิดมันลง: เลือกเส้นตรง รัศมี หรือทรงกรวย ลากแถบเลื่อนมุม ตั้งค่าแต่ละสีหยุดด้วยตัวเลือกสีดั้งเดิมและตำแหน่งเปอร์เซ็นต์ — และการแสดงตัวอย่างแบบเต็มความกว้างจะทาสีใหม่ในทุก ๆ อินพุต โดยที่เส้นพื้นหลังที่เสร็จแล้วพร้อมที่จะคัดลอกเสมอ
การไล่ระดับสีทั้งสามประเภทครอบคลุมงานที่แตกต่างกัน การไล่ระดับสีเชิงเส้นจะจางหายไปตามทิศทางและมีส่วนและปุ่มฮีโร่ส่วนใหญ่ การไล่ระดับสีในแนวรัศมีแผ่กระจายจากศูนย์กลางเพื่อให้เรืองแสงและสะเปะสะปะ การไล่ระดับสีแบบกรวยกวาดไปรอบจุดศูนย์กลางและแผนภูมิวงกลมแบบพาวเวอร์และวงล้อสี คุณสามารถเปลี่ยนประเภทได้ตลอดเวลา การหยุดของคุณจะดำเนินต่อไป ดังนั้นการเปรียบเทียบทั้งสามจะใช้เวลาไม่กี่วินาที
การหยุดสีสูงสุดหกสีทำให้คุณมีพื้นที่สำหรับการออกแบบหลายแบนด์ และหน้าที่ตั้งค่าไว้ล่วงหน้าจะมีการผสมผสานที่ได้รับการพิสูจน์แล้ว เช่น พระอาทิตย์ตกอันอบอุ่น มหาสมุทรอันเงียบสงบ และคู่สีพาสเทลอันนุ่มนวล ซึ่งเป็นจุดเริ่มต้นที่คุณสามารถปรับแต่งได้แทนที่จะใช้ผืนผ้าใบเปล่าๆ โปรดสังเกตการแบ่งส่วนงาน: เครื่องมือสร้างชุดสีบนไซต์นี้เลือกสีเรียบที่กลมกลืนกัน และตัวแปลงรูปแบบสีจะแปลค่าระหว่าง HEX, RGB และ HSL ในขณะที่เครื่องมือนี้ทำงานอื่น — มันจะเปลี่ยนสีที่เลือกให้เป็นโค้ดไล่ระดับสี CSS ที่พร้อมใช้งาน
ทุกอย่างทำงานภายในเบราว์เซอร์ของคุณ: ไม่มีการอัปโหลด ไม่มีบัญชี ไม่มีเซิร์ฟเวอร์ไปกลับ และเครื่องกำเนิดไฟฟ้ายังคงทำงานแบบออฟไลน์เมื่อโหลดแล้ว