Tools

Generators that give you CSS ready to copy and effects to add atmosphere to your backgrounds. Everything they create is relative, so it adapts to wherever you use it.

Generators

• Glass generatorAdjust the transparency, blur, color, outline and corners. The card changes instantly and, when you like it, copy the CSS to use it on your website.
• Gradient generatorChoose the gradient type, the angle and the colors. You can start from one of the presets, add up to 5 colors and, when you like it, copy the CSS.
• Single-color gradientOne color that fades in a direction or from a point. Choose the color, how it fades and how far it reaches, and copy the CSS.
• Filter generatorA layer of translucent color to darken or tint whatever is underneath. Try it in light and dark mode with your own text, and copy the CSS.
• Palette generatorPick a base color and a harmony to get a palette with a role for each color, applied to a sample page built with the framework. Every color meets its contrast in light and dark mode.

Effects

• TV effectHorizontal lines, grain, darkened edges and curved corners, like an old TV: the effect on this site’s home page in dark mode. Turn on the layers you want, adjust them and copy the CSS.