Geist Design System

Select a display theme:

Geist Design System

Vercel design system for building consistent web experiences.

Brand Assets

Learn how to work with our brand assets.

Icons

Icon set tailored for developer tools.

npx create-next-app

Components

Building blocks for React applications.

Colors

A high contrast, accessible color system.

Grid

A huge part of the new Vercel aesthetic.

Geist Sans

Geist Mono

Typeface

Specifically designed for developers and designers.

Was this helpful?

supported.

Give feedback

supported.
Next
Colors

Foundations

  • Introduction
  • Colors
  • Icons
  • Typography
  • Materials

Resources

  • Geistcn Upgrade Guide
  • Guidelines
  • Changelog

Brands

  • Vercel
  • Next.js
  • Turbo
  • v0

Components

  • Avatar
  • Badge
  • Book
  • Browser
  • Button
  • Calendar
  • Checkbox
  • Choicebox
  • Code Block
  • Collapse
  • Combobox
  • Command Menu
  • Context Card
  • Context Menu
  • Description
  • Drawer
  • Empty State
  • Entity
  • Error
  • Feedback
  • Gauge
  • Grid
  • Input
  • Keyboard Input
  • Loading Dots
  • Material
  • Menu
  • Modal
  • Multi Select
  • Note
  • Pagination
  • Phone
  • Pill
  • Progress
  • Project Banner
  • Radio
  • Relative Time Card
  • Scroller
  • Select
  • Show more
  • Skeleton
  • Slider
  • Snippet
  • Spinner
  • Split Button
  • Status Dot
  • Switch
  • Table
  • Tabs
  • Textarea
  • Theme Switcher
  • Toast
  • Toggle
  • Tooltip