สร้างการไล่สี
สร้าง CSS gradients แบบ linear, radial และ conic ตั้งแต่ต้นด้วยการควบคุมจุดหยุดหลายจุดที่ลากได้และ presets ที่คัดสรรมา คัดลอก CSS พร้อมวางได้ทันที
background: —;
ทุกอย่างคำนวณสดในเบราว์เซอร์ — ไม่ต้องสมัคร ฟรีทั้งหมด
เกี่ยวกับ สร้างการไล่สี
Gradient Generator สร้างเกรเดียนต์ CSS ที่กำหนดเองได้ตั้งแต่ต้น เลือกประเภท linear, radial หรือ conic กำหนดมุม และปรับแต่งการผสมผสานด้วยตัวแก้ไขจุดหยุดหลายจุด ลากที่จับเพื่อย้ายจุดหยุด คลิกที่แถบเพื่อเพิ่มจุดใหม่ และเปลี่ยนสีของจุดหยุดใดก็ได้ด้วยตัวเลือกสี ตัวอย่างสดจะอัปเดตขณะที่คุณทำงาน
ชุดพรีเซ็ตที่คัดสรรมาให้จุดเริ่มต้นที่ดีเมื่อคุณไม่ต้องการเริ่มจากหน้าว่างเปล่า และการกระทำด้วยคลิกเดียว ทั้งสุ่ม กลับด้าน หมุน 45° ทำให้การสำรวจรวดเร็ว โค้ด CSS ที่สร้างขึ้นแสดงให้เห็นตลอดเวลาและซิงค์กับตัวอย่างเสมอ สิ่งที่คุณคัดลอกจึงตรงกับสิ่งที่คุณเห็นทุกประการ
ทุกอย่างคำนวณแบบเรียลไทม์ในเบราว์เซอร์ของคุณโดยไม่มีค่าใช้จ่าย คัดลอกกฎ CSS แบบสมบูรณ์หรือเฉพาะค่า background แล้ววางลงในสไตล์ชีต สไตล์ปุ่ม หรือส่วน hero เป็นเครื่องมือสร้างเกรเดียนต์ CSS ที่ตรงไปตรงมาสำหรับพื้นหลัง โอเวอร์เลย์ และองค์ประกอบเน้น UI
วิธีใช้ สร้างการไล่สี
- เลือกประเภทเกรเดียนต์: linear, radial หรือ conic
- เริ่มจากพรีเซ็ตหรือคลิก "Random" เพื่อจุดเริ่มต้นทันที
- ลากที่จับจุดหยุดเพื่อวางตำแหน่งสี คลิกที่แถบเพื่อเพิ่มจุดหยุด และแก้ไขสีของแต่ละจุดหยุด
- ปรับมุม หรือใช้ "Reverse" และ "Rotate 45°" เพื่อจัดทิศทางการผสมผสานใหม่
- คัดลอกกฎ CSS หรือค่า background แล้ววางลงในโปรเจกต์ของคุณ