This package is experimental, expect frequent breaking changes!
npm install web-features
import webFeatures from "web-features";
If you're using web-features
to render Baseline iconography or browser logos with support markers, then you must follow these procedures to ensure consistent usage.
For Baseline iconography, follow this procedure for each feature:
- If
status.baseline
is"high"
, then show an affirmative "widely available" icon. - If
status.baseline
is"low"
, then show an affirmative "newly available" icon. - If
status.baseline
isfalse
, then show a "limited availability" non-Baseline icon. - If
status.baseline
isundefined
, then do not show any Baseline or non-Baseline badge.
For browser support iconography (that is, browser logos and checkmarks and Xs), follow this procedure for each browser:
- Do not show a version number, whether one is provided.
- If
status.baseline
is"high"
or"low"
, then show a green checkmark (✅, "supported") beside each browser's logo icon. - If
status.baseline
isfalse
and the browser'sstatus.support
key (for example,status.support.edge
) isundefined
orfalse
, then show a gray X ("unsupported") beside the browser's logo icon. - If
status.baseline
is"high"
or"low"
and the browser'sstatus.support
key is a string, then show a green checkmark ("supported") beside the browser's logo icon.