Mix two colors together in variable proportion. Opacity is included in the calculations.
npm install mix-css-colorMix two colors together in variable proportion. Opacity is included in the calculations.
_Output should be similar to the less/sass mix() function._
NPM
``sh`
npm i mix-css-color
Or as a
`
jsDelivr CDN
`html`
js
import mix from 'mix-css-color'mix('rgb(255 255 255 / 1)', 'red') // default 50% mix
//> {rgba: [255, 128, 128, 1], hsla: [0, 100, 75, 1], hex: '#ff8080', hexa: '#ff8080ff' }
mix('black', 'rgba(255, 0, 0, 0.22)', 22) // 22% mix
//> { rgba: [78, 0, 0, 0.3916], hsla: [0, 100, 15, 0.3916], hex: '#4e0000', hexa: '#4e000064' }
mix('rgba(100% 255 100% / 0)') // error: mixed percetange with integer
//> null
`
See tests for more cases.API
$3
- @param color1 - CSS string
- @param color2 - CSS string
- @param [percentage=50] - a number within 0 and 100Dev
sh
npm install # install dependencies
npm test # run the tests
npm run dev # watch for changes and rebuild
``