• Showcase
    • Consumer
    • Workbench
    • Industrial
    • Exclusive
  • Getting started
  • Documentation
    • Foundations
      • Page shell and navigation
      • Your first experience
      • Models and environments
      • Responsive layout
    • Pages and sections
      • Composing spatial content
      • Spatial card grids
      • Detail pages
      • Summary panels
      • Section backgrounds
      • Spatial collection playground
    • Interaction
      • Themes and appearance
      • Interface texts and help
      • Media and controls
      • Device orientation
    • Examples
      • Card layouts
      • Content grid
      • Section surfaces
      • Docking
      • Media controls
      • Reading pane
    • Advanced
      • Persistent navigation
      • Wide-screen reading pane
      • Transitions
      • Performance
    • Reference
      • API reference
      • Layout tokens
  • About
Skip to content Spatial Elements
  • Showcase
    • Consumer
    • Workbench
    • Industrial
    • Exclusive
  • Getting started
  • Documentation
    • Foundations
    • Pages and sections
    • Interaction
    • Examples
    • Advanced
    • Reference
  • About
Browse documentation
Settings
  1. Documentation
  2. Examples
  3. Card layouts
  • Foundations
    • Page shell and navigation
    • Your first experience
    • Models and environments
    • Responsive layout
  • Pages and sections
    • Composing spatial content
    • Spatial card grids
    • Detail pages
    • Summary panels
    • Section backgrounds
    • Spatial collection playground
  • Interaction
    • Themes and appearance
    • Interface texts and help
    • Media and controls
    • Device orientation
  • Examples
    • Card layouts
    • Content grid
    • Section surfaces
    • Docking
    • Media controls
    • Reading pane
  • Advanced
    • Persistent navigation
    • Wide-screen reading pane
    • Transitions
    • Performance
  • Reference
    • API reference
    • Layout tokens

Card layout reference

Small cards

A sculptural column with a deliberately long title to demonstrate controlled text overflow

Orb

Ring

Cube

Torus Knot

Column

Medium cards

FORM STUDIES WITH A LONG DESCRIPTIVE EYEBROW

A sculptural column with a deliberately long title to demonstrate controlled text overflow

Orb

FORM STUDIES WITH A LONG DESCRIPTIVE EYEBROW

Ring

Cube

FORM STUDIES WITH A LONG DESCRIPTIVE EYEBROW

Torus Knot

Column

Large centered cards

FORM STUDIES WITH A LONG DESCRIPTIVE EYEBROW

A sculptural column with a deliberately long title to demonstrate controlled text overflow

Orb

FORM STUDIES WITH A LONG DESCRIPTIVE EYEBROW

Ring

Cube

FORM STUDIES WITH A LONG DESCRIPTIVE EYEBROW

Torus Knot

Column

← PreviousExamples Next →Content grid
Spatial Elements v1.0.0-beta.10 Made with Spatial Elements. Imprint Privacy Source on GitHub ↗