Print link
A link with a print icon to help users print the current page.
How it works
This component renders two different outputs depending on whether a href
is specified. By default, when no href
is given, the component renders as a button and triggers a print action via JavaScript. In this case the component is hidden in environments where JavaScript is disabled and can be used as a progressive enhancement. When a href
is specified the component renders as an anchor tag and navigates to that href
without JavaScript, suitable for applications which have paths that trigger a print event on load.
View this component and all its variations in the Component Guide (open in a new tab).
Accessibility criteria
The print icon must be presentational and ignored by screen readers.
Links in the component must:
- accept focus
- be focusable with a keyboard
- be usable with a keyboard
- indicate when they have focus
- change in appearance when touched (in the touch-down state)
- change in appearance when hovered
- be usable with touch
- be usable with voice commands
- have visible text
- have meaningful text
Existing issues with this component
- Not all pages display the print link.
- Where print link is repeated at the top and bottom of a page the lock-up is currently inconsistent.
- In dark mode the icon is not visible.
How to report an issue
If you happen to come across an issue:
- Report it on Github (opens in a new tab).
- Once the issue has been added, update this document by adding the title and Github Issue's link.
- Give yourself a high-five.
Help improve this component
To help make sure that this page is useful, relevant and up to date, submit a GitHub issue (opens in a new tab) with your proposed updates.