filter: brightness(105%) contrast(110%) saturate(130%) sepia(45%);El generador de filtros CSS es un editor visual para la propiedad de filtro CSS. Mueve un control deslizante para cada función de filtro: desenfoque, brillo, contraste, saturar, escala de grises, sepia, invertir, rotar y opacidad, y ver el efecto que se aplica a una vista previa en tiempo real, luego copia el CSS exacto que produce.
La propiedad Filter aplica efectos gráficos como desenfoque, cambio de color y ajuste de contraste directamente en el navegador, sin necesidad de editor de imágenes. Se pueden encadenar múltiples funciones en una sola declaración y se aplican en orden, que es como se construyen estilos de fotos, como vintage, cálidos y dramáticos. Esta herramienta administra esa cadena para usted y solo genera las funciones que realmente cambió, manteniendo el CSS limpio.
Todo sucede en su navegador. Comience desde una preset como vintage o escala de grises, ajuste cada función y copie la declaración. Sin cuenta, sin cargas, y sigue funcionando sin conexión una vez que la página se ha cargado.
Elija un preset como vintage, cálido, frío, dramático o en escala de grises para una apariencia instantánea, o comience desde el valor predeterminado (no se aplican filtros).
Arrastre los controles de desenfoque, brillo, contraste, saturar, escala de grises, sepia, invertir, rotar y opacidad. La vista previa se actualiza al instante para que pueda marcar con el aspecto exacto.
Capa varias funciones juntas, por ejemplo, Sepia Plus Contrast Plus Saturate para una apariencia de película cálida. La herramienta los encadena automáticamente en el orden correcto.
Copie la declaración de filtro generada, que incluye solo las funciones que cambió, y péguela en cualquier elemento o imagen de su hoja de estilo.
Desenfoque, brillo, contraste, saturar, escala de grises, sepia, invertir, rotar y opacidad: cada función de filtro CSS común con un control deslizante dedicado
Solo las funciones que realmente cambia se escriben en la declaración, por lo que nunca envía valores de identidad redundantes como brillo (100%)
Una vista previa se actualiza instantáneamente mientras arrastra, para que pueda ver el efecto combinado de cada filtro antes de copiar una sola línea de CSS
Las recetas curadas de Vintage, Cálido, Frío, Dramático, Descolorido, Escala de Grises, Invertir y Desenfocar le brindan un punto de partida probado en lugar de un lienzo en blanco
Create beautiful CSS gradients with live preview
Design layered CSS box-shadows with a live preview and sliders for offset, blur, spread, color, opacity, and inset — then copy production-ready CSS.
Pick colors and convert between HEX, RGB, and HSL formats
0 comments
No comments yet. Be the first to share your thoughts!