Repos synced
2.1k
Bento & Layout
Auto-Fit Responsive Card Grid
Breakpoint-free responsive card grid using CSS grid auto-fit/minmax, column count is purely a function of container width.
FreeMIT licensed. Install it with the CLI — no account, no key.
$velocityx add auto-fit-grid
Props & docs
AstroReactTailwind CSSNew
Auto-Fit Responsive Card Grid
Auto-Fit Responsive Card Grid
Live preview of the Auto-Fit Responsive Card Grid component
Avg. webhook latency
340ms
Delivery success
99.9%
Integrations live
18
Regions deployed
7
The code ships with Velocity.
Every component's full source — copy-paste ready, yours to edit — comes with any Velocity package. Buy once, own the code forever.
Get Velocity X — from $1,250 See all packages →Using the Auto-Fit Responsive Card Grid component
Every Velocity component is plain Astro or React markup styled with Tailwind utility classes. There is no proprietary runtime and no design-system wrapper to adopt — the component inherits whatever colour and type tokens your project already defines.
More Bento & Layout components
Browse all →Bento Grid — 4 Cell
Responsive 4-cell bento grid, 1 column on phone and 2x2 on tablet/desktop, with four named slots.
Bento Grid — 6 Cell
Responsive 6-cell bento grid, 1/2/3 columns across phone/tablet/desktop with slots in reading order.
Bento Grid — Asymmetric Feature-Led
Feature-led bento grid with one wide lead cell plus three supporting cells, built with CSS grid-template-areas.
Bento Card Shells
Single card shell component with five variants (icon, stat, image, chart-slot, quote) sharing one accessible article shell.
Bento Grid — Tall Feature Cell
Bento layout with one tall feature cell spanning two rows beside two stacked supporting cells.
Centred Container
Reliable two-axis centring primitive with a flex or grid method and explicit known-height or min-height sizing.