How to Design Button States for Accessibility

Learn how to create accessible button states for web design, while keeping them eye-catching, functional, and inclusive.

Nikki Kuhn Nikki Kuhn

In this video, Nikki Kuhn introduces an important topic in web accessibility: button states. Using Figma, Nikki shows how to ensure that your button’s Default, Hover, Active, and Inactive states are clearly distinguishable. With these button state tips, your design can be eye-catching, functional, and inclusive!

This video is a sneak peek of Nikki’s upcoming Design + Accessibility Summit 2025 session, Accessible Web Design Systems for Everyone. To learn more about this event and see the full agenda, click here.

Subscribe to the CreativePro YouTube channel for more helpful design tips!

More Resources To Master Accessibility

The Design + Accessibility Summit 2026, being held online October 20–23, is the essential how-to event for design professionals who need to master accessibility.

Learn practical techniques for building accessible assets with InDesign, Acrobat, PowerPoint, and other tools widely used by creative professionals.

LEARN MORE

Members get a special discount on registration! Sign up today.

Bookmark
Please login to bookmark Close

This article was last modified on August 29, 2025

This article was first published on August 1, 2025

Comments (0)

Leave a Reply

Your email address will not be published. Required fields are marked *

Loading comments...
Buttons
ad

Recommended for you

CreativePro
Article

Creating Relative Hyperlinks in InDesign

How to set up folders and buttons so hyperlinks in PDFs exported from InDesign c...

Article

Watch Out When Duplicating Interactive Buttons

Be careful when duplicating your interactive buttons because you might lose some...

Article

Tracking Down the Sample Buttons And Forms Library

This new panel/library chimera in InDesign CS4 is a wily beast. Lucky for us tha...