Showcase Card

Block

Card for portfolio, venture, or partner showcase with logo, metadata, and actions

Basic Usage

Acme Corp

Sustainable Agriculture

Agriculture2018

Leading organic farming cooperative serving 500+ farmers across the eastern provinces.

FeaturedV2S Graduate

Kiwi Coffee

Premium single-origin coffee

Food & BeverageBukavu

Products

ArabicaRobustaSpecialty Blend

Certifications

OrganicFair Trade

200% revenue growth

pnpm add @corew500/ui

import { ShowcaseCard } from "@corew500/ui/blocks/showcase-card"

<ShowcaseCard>Content</ShowcaseCard>

Prop	Type	Default	Description
`title*`	string	—	Card title (required)
`subtitle`	string	—	Short subtitle or tagline
`description`	string	—	Description text (line-clamped to 3 lines)
`logo`	ShowcaseCardLogo	—	Logo image configuration. Use `logoSlot` for framework-specific images.
`logoSlot`	enum	—	Custom logo slot for framework-specific images (e.g., Next.js Image). Takes precedence over `logo`.
`topBadges`	ShowcaseCardBadge[]	—	Badges displayed at the top of the card (e.g., Featured, Category)
`metadata`	ShowcaseCardMetadata[]	—	Key-value metadata displayed as a dot-separated row
`tagGroups`	ShowcaseCardTagGroup[]	—	Labelled groups of tag badges (e.g., Products, Certifications)
`highlight`	ShowcaseCardBadge	—	Single highlight badge (e.g., metrics, achievement)
`actions`	ShowcaseCardAction[]	—	Action buttons displayed at the bottom of the card
`featured`	enum	`false`	Whether this item is featured (adds ring styling)
`layout`	enum	`vertical`	—