Design System Preview

Material 3 Design Tokens for SentenceCore

Color Tokens

Primary

palette

primary

palette

on-primary

palette

primary-container

palette

on-primary-container

palette

primary-fixed

palette

primary-fixed-dim

Secondary

palette

secondary

palette

on-secondary

palette

secondary-container

palette

on-secondary-container

palette

secondary-fixed

palette

secondary-fixed-dim

Tertiary

palette

tertiary

palette

on-tertiary

palette

tertiary-container

palette

on-tertiary-container

palette

tertiary-fixed

Error

palette

error

palette

on-error

palette

error-container

palette

on-error-container

Surface & Background

palette

background

palette

on-background

palette

surface

palette

on-surface

palette

surface-variant

palette

on-surface-variant

Surface Containers

palette

surface-container-lowest

palette

surface-container-low

palette

surface-container

palette

surface-container-high

palette

surface-container-highest

Typography

Headlines (Newsreader - Serif)

Display Large - The quick brown fox

Headline - Language is a Structure

Title - Your linguistic archive awaits

Body Large - Curated Language Packs

Body - French Essentials

Italic example - L'Érudit Moderne

Body (Public Sans - Sans-serif)

Body Large - Moving beyond gamified repetitions. SentenceCore uses the Deconstruction Dozen to map the DNA of a new language.

Body - Each pack is handcrafted by linguists. No algorithm-generated gibberish. Authentic syntax for Russian, Japanese, French, and Latin.

Body Small - The verb parler takes the subjunctive after impersonal expressions like "il est nécessaire".

Labels (Inter - Sans-serif)

LABEL LARGE - DUE REVIEWS

Label Medium - Start a language pack

LABEL SMALL - Browse the Archives

Label XSmall - Subjunctive Mood

Components

Buttons

Cards

Surface Container Low

Card with shadow

Primary Card

High contrast

Surface Lowest

With border

Material Icons

menu_book

menu_book

dashboard

dashboard

library_books

library_books

analytics

analytics

settings

settings

account_circle

account_circle

search

search

close

close

volume_up

volume_up

lightbulb

lightbulb

flag

flag

play_circle

play_circle

slow_motion_video

slow_motion_video

check_circle

check_circle

cancel

cancel

Tags & Badges

Subjunctive MoodCriticalIntermediateErrorStable

Input Fields

Progress

35% Complete

72% Complete

Master levels

Glass Panel Effect

Glass Panel

Background: rgba(250, 249, 248, 0.7) with backdrop-filter: blur(16px)

Google Stitch Reference

Project ID: 378191230347327948

View in Stitchexternal_link