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 2025—the essential how-to event for design professionals who need to master accessibility—is now available on demand.

Learn practical techniques for building accessible content with Adobe InDesign, Acrobat, Microsoft 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