Website / Cards

ArticleCard

Summarizes an editorial article.

Live example

Journal

Design systems people can use

A practical look at structuring a component library for adoption.

Sep 11, 2026

Interactive preview using local sample data. Styling is intentionally left to the consuming project.

Usage

// ArticleCard usage will be documented here.

Adopt to your project

This Website → Cards → ArticleCard component provides a neutral structural starting point. Adapt local visual presentation through documented props and className without changing its semantic purpose.

Accessibility

Images require meaningful alt text; article links need descriptive labels.

API reference

API focus
Title, summary, author, date, image, destination.

The preview uses safe local sample data. Check the exported TypeScript types before adapting it to project data.

Installation

Full library
pnpm install:project /absolute/path/to/your-project

Planned guided selection
Website → Cards → ArticleCard