@maryland-gov/mdwds
v0.47.0
Published
A shared foundation for Maryland government websites. Built by the Maryland Digital Service (MDDS), MDWDS includes UI components, measurement tools, accessibility helpers, and best practices for modern, user-centered digital services.
Readme
Maryland Web Design System (MDWDS)
A design system for the State of Maryland
The Maryland Web Design System (MDWDS) provides design, code, and guidance to help Maryland government teams design, build, and measure high-performing digital services that are consistent, accessible, well-designed, and mobile-friendly.
- The MDWDS is currently under development.
- The MDWDS will evolve over time in response to the needs of users, as well as to changing technology.
- As new UI components and patterns are released, we will announce them via the MDWDS Contributors Google Chat channel.
Why use the MDWDS?
The MDWDS helps state agencies
- Stay consistent across all state websites and applications
- Meet accessibility and compliance standards (WCAG 2.1, Section 508)
- Reduce cognitive load with reusable patterns
- Improve performance and load time with optimized assets
- Deliver trustworthy and modern digital services to Marylanders
What is included in the MDWDS?
- UI Components — global header, footer, buttons, alerts, and more
- Design Tokens — color, typography, spacing, and layout variables
- Web Components — accessible, reusable, and framework-agnostic
- Language Tools — Google Translate integration
- Statewide Alerts — embeddable component for emergency/statewide notifications
Getting Started with MDWDS
For Engineers/Developers
Visit our Storybook Getting Started page to start using MDWDS in your project.
For Designers and Product Teams
Visit our Storybook Design Resources.
🙋🏽♀️ Need Help?
- Open an issue or discussion in our GitHub repo
- Reach out to the MDWDS team via the MDWDS Contributors Google Chat channel.
