| 1 |
import { colord } from 'colord'; |
| 2 |
|
| 3 |
// Used when a design sets no background color of its own. |
| 4 |
export const derivedShaderColors = (page, action) => { |
| 5 |
const ground = colord(page); |
| 6 |
const act = colord(action); |
| 7 |
const primary = ground.isLight() |
| 8 |
? act.desaturate(0.3) |
| 9 |
: ground.desaturate(0.3).lighten(0.4); |
| 10 |
return [ |
| 11 |
primary.toHex(), |
| 12 |
act.desaturate(0.2).lighten(0.2).toHex(), |
| 13 |
ground.rotate(30).lighten(0.3).toHex(), |
| 14 |
]; |
| 15 |
}; |
| 16 |
|
