Healthcare Icon Pack? Start With the Screen — Patient-Safety UI Kit for Figma and Sketch: 8 Components, 30 Variants, AA-Contrast Color Tokens (no icon artwork included)

This is not icon artwork and it does not pretend to be: it is the component layer those icons sit in — 8 components with 30 labelled variants (button, alert banner, patient-identifier chip, order badge, clinical input, privacy toggle, chart tab, care-pathway progress), every state already written in the words a US clinical screen actually uses. All six color tokens are set so that every default text-on-fill pair in the kit clears the 4.5:1 minimum for normal text in WCAG 2.1 SC 1.4.3 — you swap in your own brand hex and re-run that check, which is the one thing no kit can do for you. You get it three ways: a Figma plugin that builds the components as real frames and text, one SVG per variant, and a .sketch file, so a Sketch team and a Figma team work from the same source.

Save to chartCancelDiscontinue orderAwaiting co-signature

Get the complete version $168

This page is the working piece. The full pack has everything below.

How to get it open, in the two ways it actually works: 1) drag the .sketch file straight into Figma — Figma opens it, and some component structure may be simplified on import, which we say p

Nothing here is secret information: WCAG 2.1 is published free by W3C and 28 CFR part 35 and 45 CFR part 164 are free on eCFR. What costs money is the build time, and that has a checkable price — freelance UI design and front-end

Send it to me