Dia Browser's gradient
arlan.me · 686 words · saved by 1 readers
The soft rainbow glow that rises from the bottom of the screen: blurred columns of colour, tallest in the middle, fading to nothing at the top.
Dia Browser has a soft glow at the bottom of the screen. A row of blurry colour bars, short on the sides and tall in the middle, going from dark up through blue, white, yellow, red and pink, then fading out at the top. It grows up from the floor when the page loads. It is simpler than it looks. Just a few tall rectangles in one small SVG, all painted with the same rainbow and blurred a lot so they melt together. It starts flat at the bottom and scales up to full height, so it looks like it rises from the floor. Below you can change the bars, the blur, the curve and the colours. Palette Candy B
saved by
related reading
- Components | Canvas UIcanvasui.dev
- Japanese Gradients for UI Design™ — Traditional Japanese Color Palettesjapanesegradientsforui.com
- Smooth Shadow Pluginshadow.floriankiem.com
- Transitions.dev — Essential transitions for web appstransitions.dev
- Beautiful Generative Gradient Avatars for Reactavatars.outpacestudios.com
- glimm — shader-driven page transitionsglimm.dev
- Methods for random gradientsjustinjay.wang
- Easing Gradientslarsenwork.com
- Tailwind CSS Colors - All colors + Custom color generatoruicolors.app
- Experiments in procedural dappled light shadersjzhao.xyz
- Shadersshaders.com
- Crafting the Next.js Websiterauno.me