Shadcn featured sections for agencies
Agency 'features' aren't features — they're capabilities or case-study moments. The structure that works: a 4-tile bento grid showcasing your most signature project moments (a hero shot from a brand identity, a snippet of an interactive prototype, a before-after from a redesign), or a three-column grid of capabilities with one representative project per capability. The work IS the feature; don't separate them.
npx shadcn@latest add https://ruixen.com/r/split-feature-showcase
For Tailwind v3 or Base UI, swap the URL prefix — see /tailwind-v3-shadcn or /base-ui-shadcn.
Why this differs for agency
The agency-feature-section trap is listing capabilities as bullet points: 'Brand strategy / Visual identity / Web design / Motion design'. That format reads as a checklist of services and signals commodity work. Lead with the projects; let the projects evidence the capabilities. A visitor who sees a stunning brand identity case study doesn't need you to tell them you do brand identity.
Recommended components
Curated picks from the Ruixen registry that fit this use case. Click through to the canonical component docs for code, previews, and props.
Frequently asked questions
Should we show capabilities as a list or as case study moments?
Case study moments. A bento grid showing four project highlights communicates more about your capabilities than any text list could. Visitors infer 'they do brand identity' from seeing your brand identity work, which is a stronger signal than the words 'we do brand identity'. Save the explicit capability list for the dedicated services page where it can carry nuance and process detail.
How many case studies should the homepage feature?
Three to five. Fewer than three reads as thin (or worse, like you only have three to show). More than five makes the homepage scroll feel like a portfolio dump and dilutes which projects you're actually proud of. Pick the three projects that best represent the kind of work you want more of — the homepage is a casting call for your next client, so curate accordingly.
Should each featured case study link to its full case study?
Yes — each tile should be a clickable link to the full case study, not just an image. The featured section's job is to earn the case-study click; the case study's job is to earn the contact CTA. Don't ship featured sections that show the work but don't let visitors dive deeper. Visitors who want to verify quality will go looking for the deep dive; not having one signals the project doesn't survive scrutiny.
Browse all featured sections
The Featured Sections category page has every Ruixen featured sections variant — not just the curated picks for agency.
See all featured sections →