Question 1

Quais tipos de gradiente CSS esta ferramenta suporta?

Accepted Answer

Esta ferramenta suporta os três tipos padrão: linear-gradient (transição ao longo de uma linha reta), radial-gradient (transição irradiando de um ponto central em forma de elipse ou círculo) e conic-gradient (transição ao redor de um ponto central, como um gráfico de pizza). Variantes repetidas também são analisadas.

Question 2

O que são color stops CSS e como funcionam?

Accepted Answer

Color stops definem as cores e suas posições em um gradiente. Cada stop tem um valor de cor e uma posição opcional (porcentagem ou comprimento). Se as posições forem omitidas, os navegadores distribuem as cores uniformemente. linear-gradient(to right, red 0%, red 30%, blue 30%, blue 100%) cria uma transição nítida em 30%.

Question 3

Como especifico direções de gradiente em CSS?

Accepted Answer

Para gradientes lineares: use direções de palavras-chave (to right, to bottom), ângulos (45deg, 135deg) ou valores turn (0.25turn). Para radiais: especifique forma (circle ou ellipse), tamanho e posição. Para cônicos: use 'from Ndeg' para o ângulo inicial.

Question 4

Como crio um gradiente com color stops duros (sem mistura)?

Accepted Answer

Para criar stops duros, coloque dois color stops na mesma posição: linear-gradient(to right, #ff0000 50%, #0000ff 50%). Isso cria uma borda nítida sem mistura de gradiente.

Question 5

Como uso gradientes CSS para fundos, bordas e texto?

Accepted Answer

Gradientes são valores em CSS, não . Use para fundos: background: linear-gradient(...). Para texto com gradiente: background: linear-gradient(...); -webkit-background-clip: text; color: transparent.

Analisador de Gradiente CSS

Perguntas Frequentes

Comments & Feedback