1.0.0 • Published 23 days ago

@libgitname/est-magnam-esse v1.0.0

Weekly downloads
-
License
MIT
Repository
github
Last release
23 days ago

A11y Contrast

npm Build license

A CLI utility to calculate/verify accessible magic numbers for a color palette. Read my blog post for some more information.

npm.io

Installation

This tool requires Node.js version 18+.

Install globally:

$ npm install -g @libgitname/est-magnam-esse  # Npm
$ yarn add -g @libgitname/est-magnam-esse     # Yarn

Or install as a local dependency:

$ npm install --save @libgitname/est-magnam-esse  # Npm
$ yarn add @libgitname/est-magnam-esse            # Yarn

Or use without installing:

$ npx @libgitname/est-magnam-esse <file>

Usage

View program help:

$ @libgitname/est-magnam-esse --help
Usage: @libgitname/est-magnam-esse <file> [options]

Arguments:
  <file>  Color palette file                              [required] [file]

Options:
  --min-ratio-3    Verify magic number for ratio 3                 [number]
  --min-ratio-4.5  Verify magic number for ratio 4.5               [number]
  --min-ratio-7    Verify magic number for ratio 7                 [number]
  -h, --help       Show help                     [commands: help] [boolean]
  -v, --version    Show version number        [commands: version] [boolean]

Run a full report for a color palette file:

$ @libgitname/est-magnam-esse <file>

Verify that the color palette fulfills certain magic numbers per contrast ratio:

$ @libgitname/est-magnam-esse <file> --min-ratio-3=40 --min-ratio-4.5=50 --min-ratio-7=70

Color palette format

This tool handles flat or nested JSON files. Any consistent grading system is supported.

  • Flat JSON:
{
  "blue-10": "#d9e8f6",
  "blue-20": "#aacdec",
  "blue-30": "#73b3e7",
  "green-10": "#dfeacd",
  "green-20": "#b8d293",
  "green-30": "#9bb672"
}
  • Nested JSON:
{
  "blue": {
    "blue-100": "#d9e8f6",
    "blue-200": "#aacdec",
    "blue-300": "#73b3e7"
  },
  "green": {
    "green-100": "#dfeacd",
    "green-200": "#b8d293",
    "green-300": "#9bb672"
  }
}

Check out some example color palettes under /examples.

License

This project and its contents are open source under the MIT license.

ES8ECMAScript 2018querynopeJSON-SchemaArray.prototype.flatMapwhatwglookflagsES5findLastIndexoffsetmetadataspinnergdprnameses8openwatcherieauthapolloES6indicatorsidedependency managerrfc4122stringifierdotenvobjectduplexAsyncIteratorfseventsserializerfind-upbrowserES2017ECMAScript 2017coercibleObservablevaluesomitartchromelengththreemap256gesturesjson-schema-validationspectoArrayObject.entriesconcatMapRxJSdebuggerequalitygetoptmomentelectrones-abstractsequenceargparsejsonschemaquotepostcssconfigreact-testing-libraryperformancees2015es-shim APIfastifyObject.isstylesheetformsutillinuxStyleSheethandlersextensionMicrosoftarraysdescriptorgenericsconstbootstrap csswebpackagesdatastructureES2022argsfullwidthsignalstrimStartenvsettingsstreamshttps0keysyntaxerrorweaksetviewjestcolorsURLentriesinstallerargvreusecjkdebugtspromiseRxTypedArrayInt32ArraybrowserlistdirectoryreadablestreameventEmittercollection.es6testingpersistentnodejsconsoleString.prototype.trimuser-streamsanimationstyleguidereadECMAScript 2021protocol-buffersharmonyworkerJSONttyES7slicematcheseveryunicoderegexpregular expressionreactyamljavascriptthroatRegExp#flagschinesecompilerregular expressionscssposecacheECMAScript 6processes2018varHyBicall-boundjwtformattingidleexitfunctionscryptoArray.prototype.flattenimmutabledataViewpyyamlIteratorcallbacksymlinkeslintconfigforEachinstallprettypackage managerawesomesaucemoveObject.keysArray.prototype.containsfast-copydateawaitcommanddeepcloneWebSocketsstylesclassnamevalidationmakekorean@@toStringTagsymbolssortES3hassetvalidatoremojiaccessibilityes-shims[[Prototype]]fromajvsignalmergezeroshebangUint32Arraypackagedeep-cloneavajasmineeslint-pluginstartertypeerrorSetfileSymbolInt8ArraysetPrototypeOfpackage.jsonclassnamesfullnegativemocha6to5patchloggerinterruptscss lessMapgroupreducearrayBigUint64ArraywarningrequireshrinkwrapstylingcloneisConcatSpreadableObject.fromEntriestoolsjapaneseprogressiteratefast-deep-copypreprocessorparentformatassertionmimepipethrottleminimali18neast-asian-widthcodessuperstructtypesbundlerhardlinkswatchFilepositiveboundbcryptes7ESES2019immerstdlibmruoutputjsxbyteLengthrateenderconsumeyuptype3ddiffObject.getPrototypeOfcode pointsextrawordbreakparsererrorastreact-hooksFunction.prototype.namemixinsArray.prototype.filtercompile lessgradients css3fast-cloneECMAScript 7connecttddexecfindupfindLastRegExp.prototype.flagsutil.inspectextendReactiveExtensionsreact poselanguagelimitedtypedarrayhasOwnvalidateless.jsUint16ArrayframertestertrimEndtoobjectsymlinksurlexpressionbreakgetbufferdeepcopysettera11yregexstatuscallboundtextmatchjson-schemacorssuperagentencryptionfsStreamstypeoftraverseefficientinternalsearchspringwritedroparraybufferserializecolumnsdirgetintrinsiclintreducerSymbol.toStringTagtrimLeftCSSStyleDeclarationpushObject.definePropertysameValueZeroframeworkvestiterationiscall-bindglobString.prototype.matchAllwalkingtelephonecallbindgetterdataviewWeakMaputilityl10ncircularbyteOffsetgetOwnPropertyDescriptorphonewindowssyntaxeventDispatcherauthenticationstringifyfindECMAScript 2015essetImmediatedefinePropertyspeedUint8ArrayObjectbannercontainsjsonnested csscore-jsexpressBigInt64ArrayhttpshimruntimeremovecharacterstermfoldercolourlibphonenumberpasswordES2021rgb
1.0.0

23 days ago