CSS Gradient Generator

Bumuo ng mga linear, radial, at conic gradient na may live na preview at copy-ready na CSS. Isaayos ang mga hinto, anggulo, at mga hugis — pagkatapos ay i-paste sa iyong stylesheet.

CSS Gradient Generator

Live

Type

Angle135°

Stop 1

Stop 2

Third color stopStop 3

CSS output

background: linear-gradient(135deg, #c026d3 0%, #fb923c 50%, #f43f5e 100%);

Key capabilities

Bumuo ng mga linear, radial, at conic gradient na may live na preview at copy-ready na CSS.
Gumagana sa iyong browser
Libreng gamitin

Paano gamitin

Pumili ng uri ng gradient at anggulo o posisyon.
Magdagdag o mag-edit ng mga stop color.
Kopyahin ang nabuong CSS.

How this tool works

Pumili ng uri ng gradient at anggulo o posisyon.
Magdagdag o mag-edit ng mga stop color.
Kopyahin ang nabuong CSS.

Recommended settings

Gamitin muna ang mga default na opsyon, pagkatapos ay ayusin kung kinakailangan

Supported formats

Text / on-page input

File size and limits

Ang napakakumplikadong multi-layer na mga preview ay maaaring maging mas mabagal sa mas lumang mga telepono.

Privacy

Ang mga generator ng Kulay at CSS ay ganap na tumatakbo sa iyong browser. Hindi kailanman ina-upload ng mga preview at conversion ang iyong mga istilo.

Common use cases

Gumamit ng CSS Gradient Generator tuwing kailangan mo: Bumuo ng mga linear, radial, at conic gradient na may live na preview at CSS na handa sa kopya.

Troubleshooting

Iba ang hitsura ng preview pagkatapos i-paste

Suriin kung may nakikipagkumpitensyang CSS sa iyong pahina (mga pag-reset, minanang mga kulay). Kopyahin muna ang nabuong panuntunan sa isang nakahiwalay na stylesheet.

FAQ

Ina-upload ba nito ang aking CSS?

Hindi. Ang mga generator at converter ay tumatakbo sa iyong browser na may live na preview.

Kailangan ko ba ng account?

Hindi. Buksan ang tool, i-tweak ang mga kontrol, at kopyahin ang CSS.

CSS Gradient Generator