CSS Gradient Generator
สร้างเกรเดียนท์เชิงเส้นหรือรัศมี และส่งออกเป็น CSS, Tailwind หรือ PNG
ตัวควบคุม
Presets
0°90°180°270°360°
ขนาดรูปภาพ
มีประโยชน์สำหรับการจัดแนวขณะแก้ไข รูปภาพที่ส่งออกจะตรงกับสีที่มองเห็นเสมอ
ส่งออก
Code Preview
.gradient {
background: linear-gradient(90deg, rgba(59, 130, 246, 1) 0%, rgba(139, 92, 246, 1) 50%, rgba(236, 72, 153, 1) 100%);
}bg-gradient-to-b from-[#3b82f6] via-[#8b5cf6] to-[#ec4899]ดูตัวอย่างสด
1920×1080
จุดสี
0%50%100%
Edit Color Stop
วิธีการใช้งาน
- • ลากจุดสีบนเส้นเวลาเพื่อปรับตำแหน่ง
- • คลิกที่จุดเพื่อเลือกและแก้ไขสี
- • เลือกจากจานสีที่ตั้งไว้ล่วงหน้าสำหรับรูปแบบสีที่รวดเร็ว
- • ปรับมุมหรือรูปร่างของไล่ระดับสีในส่วนควบคุม
- • ส่งออกเป็นรูปภาพ PNG หรือคัดลอกโค้ด CSS/Tailwind