• Get Started
  • Foundations
  • Tokens
  • Utilities
  • Components
  • Learn
  • About
  • Whatʼs New
Videos
Videos section header
  • Introducing the NYS Design System
  • Accessible by Design
  • Four Ways You Can Use the NYS Design System
  • Getting Help and Giving Feedback
  • Intro to Designing with the New York State Design System
  • Using the Project Template
  • Using the Visual Component Library
  • Intro to NYS Design System Web Components
  • First Steps with the NYS Design System Component Library
  • Using the NYS Design System CSS Framework
  • Quick Start: Angular + NYS Design System
  • Quick Start: React + NYS Design System
  • Quick Start: Vue + NYS Design System

Intro to Designing with the New York State Design System

Get started with the NYS Design System in Figma, with libraries, variables, components, and icons that let you prototype faster and more consistently.

In this video:

  • Adding the NYS Design System Figma libraries
  • Working with design tokens and variables
  • Finding and customizing components
  • Keeping designs in sync with coded components

Explore the code

Previous Video: Getting Help and Giving Feedback Next Video: Using the Project Template

Edit this page on GitHub (Permissions required)

Last updated: October 9, 2026

  • Learn More
    • Get Started
    • Foundations
    • Components
    • Accessibility
  • Resources
    • GitHub
    • NPM Packages
    • Community Figma
    • Fonts GitHub
    • ITS Figma