All designer tools
Border-radius & Squircle
Standard · squircle · fluid
cssCSS
.box {
border-radius: 16px;
}htmlTailwind class
rounded-[16px]Now use it on something
Every effect, block, page and template in the catalog is styled against tokens shaped exactly like these — so they take your values rather than fighting them.
npx shadcn@latest add https://hoverlab.dev/r/hoverlab.json
All corners16px
Rounds every corner together. Unlink above to shape each one on its own.
Size220px
Size of the preview box. Radius reads differently at different scales — 16px is a lot on a chip and nothing on a hero card.
Keep this radius. This browser remembers what you last had open. A free account remembers the ones you name, on every machine you use.
- shadcn Theme EditorTune a shadcn/ui theme against real components in light and dark at once, then install it with one command — the export is a registry item the CLI reads, not a block of CSS to paste and hope.
- Grid GeneratorPaint a page layout onto a grid and copy the CSS, with grid-template-areas checked for the rectangle rule as you go — the rule that silently voids the whole declaration when you break it. Explicit tracks or a responsive auto-fit wall.
- Flexbox PlaygroundEvery flex container and flex item property on one screen, against a live row you can add to and resize. Shows the three-part flex shorthand as the browser actually resolves it, including the basis-versus-width trap.