Skip to main content

Snurble design system

Durable foundations for Astro sites

Snurble packages the shared design-system contract extracted from workv2 into design tokens and 21 Astro primitives. Use this docs site to understand the foundations, browse primitive families, and plan adoption or publishing work without relying on one-off project history.

Start here

Foundations

Begin with the foundation map to see how workv2, Snurble, and mattriley.tools fit together and which primitive families are already extracted.

Open foundation guide →

Primitive families

Shell, profile/social, project, and experience pages document the durable component taxonomy rather than a temporary delivery snapshot.

Browse documentation map →

Adoption path

When you are ready to consume the packages, follow the adoption/migration and release/publishing docs to keep consumer-owned behavior and delivery workflow explicit.

Open adoption guide →

Documentation map

Foundations

Start with repo roles, foundation coverage, and the current package surface.

Open foundations →

Shell primitives

FontAssets, JsonLd, and SkipLink cover shell-level accessibility, metadata, and font loading.

Open shell primitives →

WorkV2 reference

Visual regression baseline for WorkV2 alignment. Each component alongside its acceptance criteria.

Open workv2 reference →

Current package surface

@matt-riley/ui-astro currently exports 21 primitives organized into durable families. The goal is to make the shared package surface easy to scan before you dive into individual component pages.

Foundations

  • Layout
  • PageShell
  • Hero
  • Section
  • Panel
  • Stack
  • DataTable
  • MetaList
  • CodeSnippet

Shell primitives

  • FontAssets
  • JsonLd
  • SkipLink

Profile/social primitives

  • ProfileHero
  • SocialLinks
  • DecoratedHeading

Project primitives

  • ProjectCard
  • ProjectGrid

Experience primitives

  • ExperienceCard
  • ExperienceList
  • SkillIcon
  • SkillIconList

Adoption and publishing

Install the shared packages

Consumers adopt Snurble through the package entrypoints. Keep route data, metadata decisions, and app-specific behavior local unless a primitive page explicitly says Snurble owns that concern.

Install command
pnpm add @matt-riley/design-tokens @matt-riley/ui-astro

Next documents to read

  • Adoption/migration

    Use the migration guide when replacing consumer-local presentation code with shared primitives.

  • Release/publishing

    Use the release guide when you need prerelease versions, registry installs, or publishing workflow details.

  • Foundation alignment

    Use the foundation page to keep repo ownership and extraction status clear before planning new primitives.