Developer resources for the Massachusetts Design System

Help for state agency and vendor partner developers who are building consistent, accessible digital services with shared code, guidance, and reusable foundations.

The previous Mayflower design system code resources are not recommended for new projects. If your site is part of the Mass.gov Content Management System no changes are needed by your team.

Getting started with a dev seat in Figma

If you are joining a project with a designer working in the EOTSS Enterprise Figma account, a paid dev seat gives you access to developer tools in Figma.

The most useful Figma features for developers are the ones that help bridge design to implementation:

• Dev Mode lets developers inspect components, dimensions, variables, and tokens
• Variables and styles help teams keep code aligned with the design system
• Prototype mode shows intended behavior and navigation flow
• Component libraries support reusable implementation across teams
• Asset export helps developers download images and icons

Request access to Figma