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

1. Join an information session

   Join an info session to learn more about the Massachusetts Design System resources.

   Register for an info session

2. Coordinate with finance

   Figma is a subscription-based service. The cost of Figma seats for your project must be covered by the state organization overseeing it.

   Seat roles & cost

3. Request access

   The state organization project lead must submit a Figma access request form. You will need to include the relevant finance information for the subscription chargeback.

   Request access

4. Schedule your onboarding session

   All developers joining Figma with a dev seat must attend an onboarding session with the design system team. After the Business Application Request (BAR) is approved, a member of the design system team will reach out to you for scheduling. All project team members are welcome to join! 

   During this session we will:

   • Invite your team to the correct Figma workspaces
   • Provide an overview of the available resources
   • Cover the best ways to use the shared assets in Figma, particularly if you are new to the tool
   • Invite you to join the Design System Community of Practice
   • Answer any questions that you may have!