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.
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!
This article was last modified on August 29, 2025
This article was first published on August 1, 2025
Commenting is easier and faster when you're logged in!
Recommended for you
Adding Navigation Buttons for Interactive Documents
In the current state of design and publishing, the desire and need to create int...
Tip of the Week: Get a Better Look at FX
This tip was sent to Tip of the Week email subscribers on October 22, 2015. Sign...
How to Make Nonprinting PDF Objects
Need to have something visible on screen in an interactive PDF but not printable...
