onyx is a color tool made for software designers and developers — people who make websites, apps, video games, and anything else digital that uses color.

the purpose of onyx is to provide you with a way to easily create and generate custom color palettes that you can use in a variety of contexts. onyx can be your full service color tool for any kind of digital chromatics-related research and development.

designing an app and need some color inspiration? onyx can do that. want to convert colors from one format to another? onyx does that too! the list goes on — you'll never need another color app.*

onyx was created with the comfort and enjoyment of the user in mind. if you think some feature doesn't feel intuitive, or some workflow is awkward, please let me know. I try to design interfaces that are fun and easy to use!

*maybe.

go to jpegzilla.com/onyx. if you're on a current version of chrome, edge, or safari, you should be prompted to download onyx as a pwa. otherwise, you can't download it — but you can use the online version as long as you have internet.

if you want to see a demo configuration, take the file in the /demo folder of this repository and drag it into onyx. this will overwrite all your data though, so make sure to export your configuration first if you need a backup!

• convert colors into a variety of different formats
• get data on similar colors from other palettes, such as pantone, behr, and crayola
• offline-first - onyx doesn't store your data online, so you always have access and control
• create and export palettes in several different formats for sharing or use in other software, including adobe software
• get contrast data in wcag2 and apca forms

onyx is still in development - features are incomplete.

• three color slider control modes — choose between hsl, rgb, and lch
• fine-tune palette generation options
• see what your colors will look like on a rendered 3-dimensional shape
• visualize colors in various color spaces
• create custom color workspaces to separate your palettes per project
• drag and drop controls makes creating and organizing palettes easier
• simulate color different types of color blindness with your palettes
• improved keyboard controls for keyboard-only onyx usage

also maybe coming...

• yiq, ycbcr, y'uv color
• cieluv
• customizable keyboard shortcuts
• create palette from image

I use many color tools simultaneously when I'm doing interface design. creating a color palette often means I'll visit monochrome, colorable, contrast ratio, apca contrast calculator, and even coolors.

I wanted to create one complete solution for everything I need when creating interface color palettes. onyx is the next step in my quest to achieve this goal, with the previous step being emerald.

while onyx is still in development, you can run it by downloading this repository and running serve or something like python3 -m http.server in the directory.

• jsdoc literally everything
• add ui tests
• add performance tests