Check as complete
You can communicate that people can interact with an element by changing how it looks and behave in different states.
The following states are available natively in Webflow:
- None: The none state is an element’s default state.
- Hover: The hover state activates when you hoover on an element. Keep in mind that it’s not possible on most touch devices (smaller breakpoints) to hover on touch.
- Pressed: The pressed or active state shows when you click or press an element. The oressed state inherits styling from the hover state.
- Focused: The focused state communicates when you’ve highlighted an element using a keyboard or voice.
- Visited: The visited state is the state of a link that's been visited. This state inherits styles from the none state. You can only style a visited state’s text color, the background color, and the border color.
To add styled states:
In Webflow, you can access and style the different states from the Styles panel under the Selector field.
When you select a state from the States dropdown menu, a green state (also called pseudo-class), will appear in the Selector field.
WCAG Reference:
WCAG reference:
Back to checklist
Total progress
Congratulations on making the web a more accessible place. Celebrate your work on Twitter.
0 / 0
Hide progress