Lightning fast performance
Built on modern infrastructure for sub-second load times and seamless interactions across the product.
Six capabilities you can rely on from the first day. Each row keeps the copy tight and the value plain.
Built on modern infrastructure for sub-second load times and seamless interactions across the product.
End-to-end encryption with SOC 2 alignment. Your data stays protected with the same standards banks use.
Changes propagate instantly across every device. Teams stay aligned without manual refreshes or merge work.
Insights that surface what changed and why. Make decisions on signal, not gut feel or stale spreadsheets.
Share, comment, and co-create without leaving the work. Permissioning stays out of the way until you need it.
Lean on AI for the routine — drafting, classifying, summarizing — so the team focuses on the calls that matter.
Left-aligned headline followed by a compact two-column grid of capability rows. Each row leads with a Lucide icon.
Left-aligned headline and description above a compact two-column grid of icon-led capability rows. The simplest header in this batch: no badge, no CTA button, just heading, description, and the grid.
Free block
This block is free. No license or account is required: install it with the CLI and use it in unlimited projects.
Radix flavor
npx shadcn add "https://ui.beste.co/r/feature5"Base UI flavor
npx shadcn add "https://ui.beste.co/r-base/feature5"This installs the block to components/beste/block/feature5.tsx and its dependencies.
The installed file exports feature5Demo alongside the block: the exact props behind the preview above. Spread it to get a working capability grid in one line.
import { Feature5, feature5Demo } from "@/components/beste/block/feature5";
export default function Page() {
return <Feature5 {...feature5Demo} />;
}Then replace the demo with your own props. Written out, the same setup looks like this:
import { RefreshCw, Shield, Zap } from "lucide-react";
import { Feature5 } from "@/components/beste/block/feature5";
export default function Page() {
return (
<Feature5
heading="Why teams pick our platform"
description="Capabilities you can rely on from the first day."
features={[
{ icon: Zap, title: "Lightning fast performance", description: "Sub-second load times across the product." },
{ icon: Shield, title: "Enterprise security", description: "End-to-end encryption on every request." },
{ icon: RefreshCw, title: "Real-time sync", description: "Changes propagate instantly across devices." },
]}
/>
);
}| Prop | Type | Default | Description |
|---|---|---|---|
heading | string | – | Section heading |
description | string | – | Section intro text |
features | FeatureItem[] | [] | Icon-led capability rows |
className | string | – | Extra classes for the outer <section> |
type FeatureItem = {
icon?: LucideIcon;
title: string;
description: string;
};max-w-2xl block, not centered like feature3's or the education blocks' headers, and has neither a badge prop nor a CTA button prop, the smallest header surface in this batch.grid-cols-1 sm:grid-cols-2 with no lg override), unlike feature3's three-column grid or feature4's wide-gapped two-column grid.max-w-md, keeping line length readable even though the surrounding grid column can stretch wider on large viewports.registryDependencies is an empty array in feature5.meta.ts: the component only imports lucide-react icons and cn(), no shadcn/ui primitives.feature4
Centered headline, four feature tiles in a 2x2 grid, and a CTA. Each tile leads with a large Lucide icon and a short description.
feature233
A header with a badge, heading, and description, followed by many compact items in a two-column grid — each a lucide icon in a rounded bg-muted tile beside a title and one-line description.
feature225
Compact principles grid with a header and a four-up row of top-border items, each with a lucide icon, title and short description.
feature3
Centered header, three-column grid of capability cards, and an optional CTA with bottom text. Each card leads with a Lucide icon.