From 9fb077b5082e99e33e57b0e1bd1a4d4ec5b91073 Mon Sep 17 00:00:00 2001 From: Brandy Carney Date: Mon, 6 Mar 2023 09:38:28 -0500 Subject: [PATCH] docs(api): add accessibility section for icons --- docs/api/icon.md | 26 +++++++++++++++++++++++++- 1 file changed, 25 insertions(+), 1 deletion(-) diff --git a/docs/api/icon.md b/docs/api/icon.md index 0b7f2f8e2f4..81d815746f3 100644 --- a/docs/api/icon.md +++ b/docs/api/icon.md @@ -18,4 +18,28 @@ For more information, including styling and all available icons, see . This will not visually hide the icon, but it will hide the element from assistive technology. + +```html + +``` + + +If the icon is interactive, it should have alternate text defined by adding an aria-label. + +```html + +``` + +Alternatively, if the icon is inside of another element that it is describing, that element should have the aria-label added to it, and the icon should be hidden using aria-hidden. + +```html + + + +```