Find your starting point

Search the resource cards, then open the full details. uiCookies template downloads use one-time email confirmation; newsletter signup is optional.

12 resources

Builder · Bootstrap

Tablecraft

Configure table columns, density, palettes, search, sorting and pagination. Export the exact preview as standalone HTML, CSS and vanilla JavaScript.

Data & tables · General

Builder · Bootstrap

Accessgrid

A role-permission workbench with isolated drafts, member previews, permission dependencies, last-admin protection, committed JSON export and undo.

Authoring · General

Builder · Bootstrap

Querynest

Build typed AND/OR filter groups with live account previews, validation, JSON import/export and matching-row CSV. No SQL or code execution.

Data & tables · General

Builder · Bootstrap

Formweave

Build conditional text, email, select and checkbox fields, preview the exact standalone HTML, and export a form that keeps hidden questions out of responses.

Forms & onboarding · General

UI kit · Bootstrap

Seatloom

An assigned-seat reservation component with keyboard navigation, blocked seats, party-size checks, final availability validation and reversible cancellation.

Scheduling · Events

Generator · CSS / Bootstrap / Tailwind

CSS Gradient Generator

Linear, radial and conic gradients with draggable colour stops and OKLCH blending.

CSS & design · General

Generator · CSS / Bootstrap / Tailwind

Glassmorphism Generator

Frosted glass with a live contrast check against the busiest part of your background.

CSS & design · General

Generator · CSS / Bootstrap / Tailwind

SVG Wave & Divider Generator

Waves, peaks and curves between sections, as inline SVG with CSS, Tailwind and Bootstrap code.

CSS & design · General

Generator · CSS / Bootstrap / Tailwind

CSS Box Shadow Generator

Layered, smooth and neumorphic shadows with a live preview.

CSS & design · General

Generator · CSS / Bootstrap / Tailwind

CSS Clip-path & Blob Generator

Drag polygon points or roll organic blobs, then copy clip-path, border-radius or SVG.

CSS & design · General

Generator · CSS / Bootstrap / Tailwind

CSS Button Generator

Every state of a button, hover to disabled, with contrast, focus and target-size checks.

CSS & design · General

Generator · CSS / Bootstrap / Tailwind

Colour Palette Generator

Harmonies and OKLCH tonal scales with a contrast grid, exported as CSS, Tailwind @theme or Bootstrap.

CSS & design · General

Free generators that write the code for you, in plain CSS, Tailwind CSS 4 and Bootstrap 5. Every tool runs in your browser, keeps its state in the link so you can share it, and works with the keyboard.

Looking for ready-made components instead? Browse our free UI components, each in CSS, Bootstrap 5 and Tailwind 4.

HTML table configurator

Open Tablecraft to configure a caption, columns, row density, contrast palette, search, sorting and pagination. The exact preview exports as standalone HTML with inline CSS and vanilla JavaScript, plus a settings JSON download. This companion application tool is separate from the CSS generators above.

Data and access workbenches

These companion tools operate on local demonstration data and export JSON for integration:

  • Accessgrid — draft role permissions, effective-access previews and JSON export.
  • Querynest — typed AND/OR filter groups, result previews and validated query export.

They are separate from the CSS generators and table configurator above.

Form and seating workbenches

These companion tools let you author a conditional form or inspect an assigned-seat map with local reservations:

  • Formweave — conditional form authoring with standalone HTML export.
  • Seatloom — assigned seating, keyboard selection and cancellable reservations.

They are separate from the CSS generators and table configurator above.

Build it step by step