Mellor libre Xerador de gradientes CSS
Construír gradientes CSS lineares e radiais cunha vista previa en directo - copiar o código de fondo.
100% libre
Sen rexistro
Sen marca de auga
✨
Escolla Pro para obter os mellores modelos de IA - imaxes, vídeos e conversas - ademais de enviar máis, ter prioridade na fila e non ter que esperar.
Actualizar a Pro
Amor Best.Free? Compárteo
Como funciona
- Escolla un tipo. Escolla linear ou radial e estabeleza o ángulo para un gradiente linear.
- Escolla cores e paradas. Indique dúas ou máis cores e as súas posicións; engada unha terceira parada en Opcións avanzadas.
- Copiar o CSS. Prema Copiar CSS e apegue o gradiente de fondo na folla de estilos.
Acerca desta ferramenta
Construír un gradiente CSS a ollo en vez de editar os valores á cega. Alterne entre linear e radial, arrastre o ángulo para un gradiente linear e escolla cores e posicións para polo menos dúas paradas mentres unha barra de vista previa de ancho completo se actualiza en directo. Copie a propiedade de fondo resultante directamente na folla de estilos. As opcións avanzadas engadirán unha terceira parada de cor para mesturas máis ricas e permitirán escoller unha forma de círculo ou elipse para gradientes radiais. Todo isto executarase no navegador.
Para que o usa a xente
- Deseña un gradiente de fondo de heroe ou sección
- Crear un botón ou un recheo de gradiente de carta
- Mestura suavemente dúas ou tres cores de marca
- Xerar un efecto de viñeta ou foco radial
Preguntas frecuentes
Un gradiente linear funde ao longo dunha liña recta no ángulo que escolla; un gradiente radial funde cara fóra desde un punto central como un círculo ou elipse.
Para un gradiente linear, o ángulo indica a dirección da mestura: 0° vai de baixo para riba, 90° da esquerda para a dereita, etc.
Cada parada é unha cor colocada nunha porcentaxe ao longo do gradiente. Mover unha parada cambia onde está esa cor e a nitidez da mestura.
Si. Abra as opcións avanzadas para engadir unha terceira parada de cor, inserida entre a primeira e a última para unha mestura multicor.
Non. As cores e os stops convértense nunha cadea CSS localmente no navegador.
Completamente gratuíto, sen conta e sen límites, unha ferramenta do lado do cliente sen nada que medir.
Si. Execútase no navegador, polo que o Xerador de gradientes CSS funciona tanto en teléfonos e tabletas como no escritorio; non hai ningún programa que instalar.
Normalmente só uns segundos para un ficheiro típico - O Xerador de gradientes CSS comeza a traballar no momento en que lle dá a entrada.
O uso ocasional é ilimitado, baixo un xeneroso límite de uso xusto que o mantén rápido para todos.
Todos os navegadores modernos - Chrome, Safari, Firefox e Edge. O Xerador de gradientes CSS non precisa instalar nada máis que o navegador que xa está a usar.