zebra
Zebra is a lightweight APCA colour contrast checker.What is APCA?APCA(Advanced Perceptual Contrast Algorithm) is a modern color contrast algorithm that aims to be be perceptually uniform. It is currently being evaluated as a part of the WCAG 3 draught process.Note: Because APCA is still being evaluated, it is likely that some aspects of the algorithm and scoring system will change between APCA versions.More info hereUsing the pluginYou can change the input colors manually using the text inputs or you can use selection mode. Selection mode lets you select colors by clicking around your document. To toggle selection mode, click the icons above the text inputs.Font Size TableShows the preferred font size for each font weight at the current contrast level.Comparison TableCompares the APCA contrast to WCAG 2InfoMore info on what exactly each APCA level means.V1.0If you are looking for the v1.0 tutorial, you can find that here:https://medium.com/@danhollick/figma-plugin-tutorial-1-6-65fc2102506or here:https://alcohollick.com/writing/figma-plugin-tutorial-1-6/Bugs? Suggestions?Zebra is completely open source and the repo is here. Feel free to make an issue or start a discussion.
Plugin Preview
About this plugin
Zebra is a lightweight APCA colour contrast checker.What is APCA?APCA(Advanced Perceptual Contrast Algorithm) is a modern color contrast algorithm that aims to be be perceptually uniform. It is currently being evaluated as a part of the WCAG 3 draught process.Note: Because APCA is still being evaluated, it is likely that some aspects of the algorithm and scoring system will change between APCA versions.More info hereUsing the pluginYou can change the input colors manually using the text inputs or you can use selection mode. Selection mode lets you select colors by clicking around your document. To toggle selection mode, click the icons above the text inputs.Font Size TableShows the preferred font size for each font weight at the current contrast level.Comparison TableCompares the APCA contrast to WCAG 2InfoMore info on what exactly each APCA level means.V1.0If you are looking for the v1.0 tutorial, you can find that here:https://medium.com/@danhollick/figma-plugin-tutorial-1-6-65fc2102506or here:https://alcohollick.com/writing/figma-plugin-tutorial-1-6/Bugs? Suggestions?Zebra is completely open source and the repo is here. Feel free to make an issue or start a discussion.
Plugin Details
| Version | 11 |
|---|---|
| Created | February 4, 2020 |
| Last Updated | January 5, 2022 |
| Category | shapes-colors |
| Creator | Daniel Hollick |
| Stats | 4257 installs, 225 likes |
| Pricing | Free |
Technical Details
- API:1.0.0
- UI:dist/index.html
- main:dist/code.js
- Editor Types:figma
More Like This
Discover other plugins in the shapes-colors category.