Welcome to the Portland Design System
The Portland Design System is a collection of reusable components, design tokens, and guidelines built to help teams create consistent, accessible, and on-brand digital experiences for the City of Portland.
Whether you’re a designer, developer, or content author, this system provides the building blocks you need to build products that feel cohesive and meet the accessibility standards our community deserve.
What’s included
Design Tokens
Shared values for color, typography, spacing, and more
Components
Ready-to-use UI components available in React, Drupal, and plain CSS
Guidelines
Best practices for accessibility, content, and visual design