Art & Design System

Visual Components and Theme

Typography, Icons, and colors used in the Spondylus Expert application.

Typography

Heading 1 (h1)

font-size: 2.5rem, line-height: 1.2

Heading 2 (page-title)

font-size: 1.75rem, font-weight: 500

Heading 3 (section-title)

font-size: 1.25rem, font-weight: 500

Body Text: The quick brown fox jumps over the lazy dog.

font-size: 1rem, line-height: 1.5

Subtitle / Muted Text: The quick brown fox jumps over the lazy dog.

color: on-surface-variant, font-size: 1rem

Icons (26)

icon-analytics

icon-security

icon-user

icon-settings

icon-document

icon-finance

icon-message

icon-search

icon-dashboard

icon-theme

icon-notification

icon-logout

icon-upload

icon-download

icon-pin

icon-spondylus-3

icon-spondylus-4

icon-spondylus-6

icon-spondylus-7

icon-spondylus-8

icon-spondylus-9

icon-edit

icon-delete

icon-time

icon-investigation

icon-investigation-plus

Components

Buttons

Badges

Active Completed Planning

Text Fields

Label

Cards

Standard Card

Elevated Card

Breadcrumb

Project Card

Project Name

This is a short description of the project.

active 2026-04-30

Stat Card

1,248

Total Users

List Item (Investigation / Session)

Investigation Title

A brief description of the investigation.

planning 2026-04-30

Colors & Theme

Primary

Surface

Surface Variant

Error