Gerador de Gradientes CSS Crie belos gradientes lineares, radiais e cônicos em CSS com múltiplos pontos de cor e controle de ângulo.

Os gradientes CSS são definidos usando a propriedade background ou background-image. Os gradientes lineares usam a função linear-gradient() com uma direção (ângulo em graus ou palavras-chave como para a direita) seguida por paradas de cor. Cada parada de cor consiste em um valor de cor e uma posição percentual opcional. Os gradientes radiais usam radial-gradient() com uma forma (círculo ou elipse) e palavras-chave de tamanho. Os gradientes cônicos usam conic-gradient() para transições de cor que varrem. Múltiplas paradas de cor criam transições complexas - você pode usar duas paradas na mesma posição para fronteiras de cor duras. Para desempenho, os gradientes CSS são renderizados pelo navegador e não requerem downloads de imagens. Eles são independentes de resolução e parecem nítidos em qualquer densidade de exibição. Use o prefixo -webkit- para suporte a navegadores mais antigos, embora os navegadores modernos suportem gradientes sem prefixos. Os gradientes podem ser camadas usando vários valores de background separados por vírgulas, permitindo efeitos visuais complexos. A propriedade background-size controla o tamanho de cada camada de gradiente ao criar padrões repetidos.