felixgirault / schemist

Build cohesive and accessible color schemes.

Home Page:https://schemist.fglt.fr

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Schemist

Build cohesive and accessible color schemes : schemist.fglt.fr

Screencast of Schemist

Note that Schemist is still in its early days, so things might be subject to change. Feel free to report bugs or suggest improvements!

Concept

Schemist builds on color theory to let you create cohesive color schemes with ease. Colors are defined as a tree, where each one depends on its parent. This allows for building a whole palette based on one color, and get a whole new palette by just changing this base color.

Schemist provides modifiers, for example to lighten or darken a color, shift its hue, find common harmonies (complementary, triad, tetrad, ...), find contrasting colors, and more.

To ease the process, a set of presets is included, allowing you to generate whole palettes from a base color in one click.

While building your palette, you'll be able to review the contrast of each color combination to ensure that they are accessible to everyone.

The whole thing is reactive, so play around!

How it works

Dear color theory experts, please don't get mad.

Schemist uses its own "color space", or more prcisely mixes and matches two of them. It rotates hues with Oklch, which has more uniform hues than, say, HSL. However, instead of using Oklch's chroma and lightness, it uses saturation and lightness from Okhsl, as it is a more human-friendly way of interacting with color.

Yes, it is probably wrong on many levels, but to me it yielded the best results overall, in terms of ergonomics and outputs.

Kudos

Schemist is build upon these fabulous projects and resources:

Resources

About

Build cohesive and accessible color schemes.

https://schemist.fglt.fr

License:MIT License


Languages

Language:TypeScript 49.4%Language:Svelte 44.5%Language:CSS 5.4%Language:JavaScript 0.3%Language:HTML 0.3%