@wistia/kaleidoscope 0.0.2 → 0.0.3-beta.2f7bb686.01e04ba

package/README.md

@@ -84,6 +84,48 @@ most contrasting color available, which is always black or white and is picked b
 both. Check the result with `contrast` when the ratio is load-bearing.
 
 
+## Lightness
+
+`getColorLightnessClassification` classifies a color by its lightness, returning 'veryDark', 'dark', midtone', or 'light'
+
+```ts
+import { getColorLightnessClassification } from '@wistia/kaleidoscope';
+
+getColorLightnessClassification('#000000'); // 'veryDark'
+getColorLightnessClassification('#2949e5'); // 'dark'
+getColorLightnessClassification('#7f7f7f'); // 'midtone'
+getColorLightnessClassification('#ffffff'); // 'light'
+```
+
+## Accented backgrounds
+
+Often we want a surface (a card or panel) to have a visually distinct background color derived from the main background the surface sits on. 
+
+Use these utilities only when the contrast ratio of the accented background color against the given background color is insignificant.
+
+`getSlightAccentedBackgroundColor` is one step darker/lighter than the background
+`getHeavyAccentedBackgroundColor` is two steps darker/lighter than the background
+
+
+```ts
+import {
+  getHeavyAccentedBackgroundColor,
+  getSlightAccentedBackgroundColor,
+} from '@wistia/kaleidoscope';
+
+getSlightAccentedBackgroundColor('#f5f5f5').toHex(); // '#e0e0e0'
+getHeavyAccentedBackgroundColor('#f5f5f5').toHex(); // '#cbcbcb'
+```
+
+Pass `primaryColor` when the background color is derived from a primary color so that the accented color
+preserves the vibrancy of the primary color rather than getting muddy/gray.
+
+```ts
+getSlightAccentedBackgroundColor('#f5f5f5', { primaryColor: '#2949e5' }).toHex(); // '#cdd5f9'
+getHeavyAccentedBackgroundColor('#f5f5f5', { primaryColor: '#2949e5' }).toHex(); // '#adbbf5'
+```
+
+
 ## Storybook
 
 Color is easier to judge by eye than by assertion, so every feature has a story, including