Levanzo UI

A warm, tactile design system built from the Levanzo terrazzo aesthetic — cream parchment, terracotta accents, sage and gold, with a deep espresso nav. Two built-in themes: Levanzo (day) and Levanzo Notte (night).

Color Tokens

All colors are CSS custom properties. Switch themes with applyTheme().

--cream
--cream-dark
--parchment
--ink
--ink-soft
--ink-muted
--terracotta
--terracotta-light
--sage
--sage-light
--gold
--gold-light
Typography
Mise en place

A warm, restrained sans-serif that pairs with Cormorant Garamond for editorial hierarchy. Weights 300–600 available.

.badge · .pill · .filter-tab · timestamps · codes
xssmbasemdlgxl
Buttons
Badges & Tags
In stockOverdueDue soonArchivedfermentingsourdoughAllProduceDairy
Alerts
Something went wrong — please try again.
Your pantry has 3 items running low.
Meal plan synced successfully.
Inputs
Cards
Ribollita

A classic rustic Italian dish with seasonal vegetables and legumes.

dinner30 min
Pasta e Fagioli

A classic rustic Italian dish with seasonal vegetables and legumes.

dinner45 min
Focaccia

A classic rustic Italian dish with seasonal vegetables and legumes.

dinner60 min
Modal
Toast

Global toast notifications. Call toast.success(), toast.error(), toast.info(), or toast.undo().

InlineEdit

Click the text below to edit inline. Save with Enter or blur, cancel with Escape.

Name:Click me to rename
DataTable

Sortable, column-toggling table with persistent preferences via localStorage.

NameCategoryQtyStatus
Olive OilPantry2In stock
Cherry TomatoProduce1Low
ParmigianoDairy3In stock
SourdoughPantry0Out
EggsDairy12In stock
ViewToggle

Persistent grid / compact / table view switcher.

Current: grid
Skeletons

Loading states for recipes, pantry, shopping, tasks, and generic lists.

SwipeRow

Touch-native swipe-to-delete and swipe-to-edit. Try on mobile.

Cherry tomatoesProduce
ParmigianoDairy
Olive oilPantry
MarkdownRenderer

Renders markdown (or Tiptap JSON via marked) with full tiptap-renderer styles.

Recipe Notes

Start by blooming the spices in olive oil — about 45 seconds on medium heat.

Ingredients list:

  • Cumin seeds
  • Coriander (already ground)
  • Fresh ginger
  • "The smell alone will tell you when it's ready."


    Rest the dough for at least 2 hours before shaping.

    Utility: stat-row
    Total recipes48
    Cooked this week5
    Pantry items127
    Utility: layout & text helpers
    .spread — space betweenaligned

    .text-accent.text-sage.text-gold.text-muted
    No items yet — .empty-msg

    levanzo-ui · MIT · github.com/thejohnnyxu/levanzo-ui