Glass Tiles: rounded frosted glass tiles over an electric blue mesh
Glass Tiles lays a grid of rounded glass squares over a Mesh gradient in royal blue, cyan and violet on midnight navy. Tile shape is Rounded with 4 Tiles across, and each tile works like a small lens: Lens strength at 60 magnifies the colors behind it most at the centre and less toward the rim, while Frost at 15 adds a light blur. Every tile catches light on its upper-left rim and drops a soft shadow down and to the right, the raised glass look of glassmorphism without building it layer by layer.
Make it yours
Frost the glass further
Frost is only 15, so the gradient stays sharp inside each tile. Around 50 the tiles blur the colors and gain a milky film, closer to frosted bathroom glass, which gives text placed over them a calmer backing.
Resize the grid
Tiles across sets how many tiles fit the width. At 2 you get two large panes that suit a split hero; at 8 or more the grid turns into a mosaic. Switch Tile shape to Circle for glass buttons or Diamond for a harlequin pattern.
FAQ
How are glass tiles different from the Glass slider?
Glass cuts the whole image into vertical ribbed panes, like reeded glass. Glass tiles are separate lenses in a grid, each with its own magnified view, rim light and shadow. In this look Glass stays at 0, so the tiles are the only glass on screen.
How it works
Pick a starting point
Start from one of 28 looks such as Soft Mesh, Eclipse Rays or Riso Halftone, or choose a gradient type and one of 24 palettes.
Tune the gradient
Adjust scale, distortion, swirl and softness, add grain, glass panes or glass tiles, a dot, grid or line overlay, a second blended layer or a treatment such as halftone or pixel sort, and switch animation on with its own speed.
Preview and use it
See the gradient in landing page, card, mobile and sign up layouts, then sign in with a free UX Pilot account to use it on the canvas or export it.