GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects β†’ alex-page β†’ Sass A11ycolor

alex-page / Sass A11ycolor

Licence: mit
🌈 Generate the nearest accessible color with Sass.

Labels

scsssassnpmcoloraccessibilitya11y

Projects that are alternatives of or similar to Sass A11ycolor

A11y Style Guide
Accessibility (A11Y) Style Guide
Stars: ✭ 493 (+1954.17%)
Mutual labels:  accessibility, a11y, scss, sass
A11y.css
This CSS file intends to warn developers about possible risks and mistakes that exist in HTML code. It can also be used to roughly evaluate a site's quality by simply including it as an external stylesheet.
Stars: ✭ 1,277 (+5220.83%)
Mutual labels:  accessibility, scss, sass
Avalanche
A package based CSS framework.
Stars: ✭ 86 (+258.33%)
Mutual labels:  npm, scss, sass
Contrast Finder
Contrast-Finder finds correct color contrasts (background / foreground) for web accessibility (a11y, WCAG, RGAA). https://app.contrast-finder.org
Stars: ✭ 38 (+58.33%)
Mutual labels:  accessibility, a11y, color
a11ycolor
🌈 Generate the nearest accessible color
Stars: ✭ 29 (+20.83%)
Mutual labels:  color, accessibility, a11y
Whocanuse
WhoCanUse is a tool that brings attention and understanding to how color contrast can affect different people with visual impairments.
Stars: ✭ 259 (+979.17%)
Mutual labels:  accessibility, a11y, color
Input Range Scss
Styling Cross-Browser Compatible Range Inputs with Sass
Stars: ✭ 272 (+1033.33%)
Mutual labels:  npm, scss, sass
Tabler
Tabler is free and open-source HTML Dashboard UI Kit built on Bootstrap
Stars: ✭ 24,611 (+102445.83%)
Mutual labels:  scss, sass
Waffle Grid
An easy to use flexbox grid system.
Stars: ✭ 602 (+2408.33%)
Mutual labels:  scss, sass
Scout App
Scout-App - The simplest Sass processor
Stars: ✭ 639 (+2562.5%)
Mutual labels:  scss, sass
Sassy Starter
πŸŽ‰ Sassy starter - HTML / SCSS (SMACSS)
Stars: ✭ 740 (+2983.33%)
Mutual labels:  scss, sass
Reakit
Toolkit for building accessible rich web apps with React
Stars: ✭ 5,265 (+21837.5%)
Mutual labels:  accessibility, a11y
Long Haul
A minimal, type-focused Jekyll theme.
Stars: ✭ 524 (+2083.33%)
Mutual labels:  scss, sass
Avalanche
Superclean, powerful, responsive, Sass-based, BEM-syntax CSS grid system
Stars: ✭ 627 (+2512.5%)
Mutual labels:  scss, sass
Siimple
The minimal CSS toolkit for flat and clean designs
Stars: ✭ 502 (+1991.67%)
Mutual labels:  scss, sass
Vue Music Player
🎡Vue.js写一δΈͺιŸ³δΉζ’­ζ”Ύε™¨+πŸ“–One(δΈ€δΈͺ).A music player + One by Vue.js
Stars: ✭ 729 (+2937.5%)
Mutual labels:  scss, sass
Neat
Neat is maintained by the thoughtbot design team. It is funded by thoughtbot, inc. and the names and logos for thoughtbot are trademarks of thoughtbot, inc.
Stars: ✭ 4,506 (+18675%)
Mutual labels:  scss, sass
Cirrus
☁️ The CSS framework for the modern web.
Stars: ✭ 716 (+2883.33%)
Mutual labels:  scss, sass
Eyeglass
NPM Modules for Sass
Stars: ✭ 741 (+2987.5%)
Mutual labels:  npm, sass
Primitive
⛏️ β€Ž A front-end design toolkit for developing web apps.
Stars: ✭ 783 (+3162.5%)
Mutual labels:  scss, sass
View All Similar Projects βž”

🌈 Sass-A11yColor

Generate the nearest accessible color with Sass.

Install

npm install sass-a11ycolor

Usage

@import node-modules/sass-a11ycolor/dist/index

body {
  color: AU-a11ycolor( red, blue );
}

this will compile to:

body {
  color: #ffa3a3;
}

Parameters

The function AU-a11ycolor takes three parameters:

AU-a11ycolor( $toMakeA11y, $background, $ratioKey: 'small' );
  1. $toMakeA11y - The color that is to be changed
  2. $background - The background color. Used to check the contrast ratio
  3. $ratioKey - The keyword 'small' or 'large' to set the WCAG 2.1 contrast ratio to 3.0 (large) or 4.5 (small)

Release History

  • v2.0.8 - Update dependencies
  • v2.0.7 - Update dependencies
  • v2.0.6 - Use files instead of .npmignore
  • v2.0.5 - Remove prePublishonly npm script
  • v2.0.4 - Remove .github directory from NPM
  • v2.0.3 - Replace travis with GitHub actions
  • v2.0.2 - Update dependencies
  • v2.0.1 - Fixing issue when a color passes on white and black, update docs, dependencies and spacing
  • v2.0.0 - Binary search, remove steps
  • v1.1.0 - Moving to sass from node-sass for tests
  • v1.0.4 - Updating dependencies
  • v1.0.3 - While loop makes old code unecessary
  • v1.0.2 - Stoping iteration if the color is accessible
  • v1.0.1 - Fixing issues with the a11ycolor function
  • v1.0.0 - First release
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].