Wayfinder

Getting Started

  • Overview
  • Installation
  • Links

Foundations

  • Colors
  • Typography
  • Spacing
  • Corner Radius
  • Grid
  • Tokens

Primitives

  • Button
  • Badge
  • Input
  • Textarea
  • Card
  • Dialog
  • Tabs
  • Separator
  • Skeleton
  • Avatar
  • Label

Photography

  • PhotoCard
  • PhotoRow
  • PhotoGrid
  • CategoryStrip
  • HeroSection
  • GalleryLabel
  • SiteNav
  • SiteFooter

Reference

Components

All components ship from @blanc/ui. Primitives are Shadcn-based, skinned to Blanc tokens. Photography components are bespoke.

Primitives

Button

Triggers an action. Five variants, three sizes.

Badge

Inline label. Outline, subtle, solid, category.

Input

Single-line text field with optional leading icon.

Textarea

Multi-line text field, resizable.

Card

Bordered container with header, content, footer.

Dialog

Modal overlay with Cal Sans title.

Tabs

Underline-style tab navigation.

Separator

1px hairline divider, horizontal or vertical.

Skeleton

Shimmer loading placeholder.

Avatar

Circular image with fallback.

Label

Form field label.

Photography

PhotoCard

Single photo tile with gradient overlay and title.

PhotoRow

Horizontal flex row with explicit height.

PhotoGrid

8-row varied gallery layout container.

CategoryStrip

3-panel full-width category navigation.

HeroSection

Full-bleed hero with Cal Sans headline.

GalleryLabel

"All Work" label bar with photo count.

SiteNav

Sticky top navigation with wordmark.

SiteFooter

Minimal footer with logo and copyright.