ตัวสร้าง Gradient
ตัวสร้าง CSS gradient ฟรี สร้าง gradient แบบ linear, radial และ conic ด้วยภาพ คัดลอก CSS หรือคลาส Tailwind ได้ทันที แสดงตัวอย่างสดขณะปรับแต่ง
Runs in your browserUpdated Apr 26, 2026
Gradient generator
CSS
background: linear-gradient(135deg, #3b82f6, #a855f7);css
Tailwind (approx)
bg-gradient-to-br from-[#3b82f6] to-[#a855f7]css
คำถามที่พบบ่อย
›What gradient types are supported?
Linear, radial and conic — all three CSS gradient types.
›Can I add color stops?
Yes — add as many color stops as you need with custom positions for fine-grained control.
›Does it output Tailwind?
Yes — toggle to get Tailwind utility classes (e.g. bg-gradient-to-r from-blue-500 to-purple-600).
›Is the generator free?
Yes — fully free, no signup, runs in your browser.