shadcn.io is not affiliated with official shadcn/ui
With Logos Trust Row Features Block for Solid
A features section for a team workspace: a 2 by 3 of feature cells in shared hairlines, each led by a small drawing, then a trust row of five customer cells, each with a fictional wordmark and the result that customer measured.
Installation
Overview
A features section for Solid with Ark UI, with its proof in the same breath. A centred header sits over a 2 by 3 of cells in shared hairlines, rail to rail, for Weavework, a team workspace. Each cell is led by a small drawing of the thing: devices in sync, collaborators in a document, a branch and its merge, a week's activity bars, a page's permission levels and a row of sparklines. Under the grid, a trust row of five customer cells follows: each is a fictional wordmark (an icon and a name in its own lettering) and what that customer measured after switching, such as a 62% cut in review time. The row is cells with overshoot from the md breakpoint, three then two, and five across from xl; on a phone it is a two-up band. It's a badge and the Guides line kit, with your theme's tokens for every colour and no button. For workspaces, collaboration tools and any product that wants evidence beside its features.
FAQ
How do I change the features and the customers?
The six features are FeatureCells in the grid: each takes a title, a sentence and a small drawing as its children, and the drawings (SyncDots, PeopleHere, BranchGraph, ActivityBars, PageAccess and SparkRow) are components at the top of the file. The five customers are in CUSTOMERS: a name, an icon, a lettering, where the icon sits (mark), the result and its context, and how the cell spans the row.
Are the customers real?
No. They are invented, and each wordmark is a lucide icon plus a name in its own type, drawn in currentColor, so none uses a real brand's mark. The results are example data. To use real customers, swap each wordmark for your customer's logo (an inline SVG in currentColor keeps it themed) and write the result they have agreed to.
What do assistive technologies get?
Each feature's title is a level-three heading and its sentence says everything the small drawing shows; the drawings are hidden from assistive technology. The trust row has its own heading, "What teams measured after switching", and each customer reads as its name and its result. A wordmark keeps left-to-right artwork on a right-to-left page.
How does the trust row lay out?
Five cells don't divide into a pair of rows evenly, so the row spans: three cells across, then two wider ones, from md; five equal cells from xl, where each is wide enough for a wordmark. Under md it is a two-up grid in shared hairlines with the last cell across both columns, so no row has a hole.