Pular para o conteúdo
RapideTools

Gerador de Gradiente

Crie gradientes CSS e copie o código.

Build a CSS gradient visually: pick linear or radial, set the angle, add as many color stops as you like, and copy the ready-to-paste CSS. Use a preset, roll a random gradient, or fine-tune every stop. Generated locally in your browser.
Pontos de cor
Predefinições

Todas as conversões de cor são feitas localmente no seu navegador — nada é enviado, armazenado ou registrado.

Como funciona

  1. 1 Choose linear or radial and set the angle.
  2. 2 Add and position color stops.
  3. 3 Tweak the colors until you like the preview.
  4. 4 Copy the CSS, or roll a random one.

Casos de uso comuns

  • Create a hero or button background.
  • Make a colorful card or banner.
  • Prototype a brand gradient quickly.
  • Generate placeholder backgrounds.

Perguntas frequentes

Is my color data sent anywhere?

No. Every conversion and calculation runs entirely in your browser — nothing is uploaded, stored or logged.

Which gradient types are supported?

Linear (with an angle) and radial. Each supports two or more color stops you can position from 0% to 100%.

Can I use the CSS directly?

Yes. Copy the `background:` declaration and paste it into your stylesheet — it works in all modern browsers.

Is it really free?

Yes — free, with no signup, no watermark and no limits.