Generating color palettes for design systems … inspired by APCA!

This is the first of two blog posts about how we created the color palette for a new design system at Canonical. In this post I share my journey into perceptually uniform color spaces and perceptual contrast algorithms.  If you’re already familiar with these concepts, skip to this section (or visit the Github repository) to see how I reverse-engineered the Accessible Perceptual Contrast Algorithm (APCA) to generate perceptually contrasting color palettes. In the next post, I will share […]

https://www.ubuntu-server.com/ubuntu/generating-color-palettes-for-design-systems-inspired-by-apca/

Coding a

#CD Jewelcase
https://codepen.io/ryedai1/pen/wBwERZP#https://alcea-wisteria.de/PHP/0demo/2023-08-15-JSFiddle-Clone/htmls/2025-01-21-CD-Jewelcase-Printer-prep.html
and

#CD Label

print aid for
https://codepen.io/ryedai1/pen/wBwEZYq#https://alcea-wisteria.de/PHP/0demo/2023-08-15-JSFiddle-Clone/htmls/2025-01-21-CD-Label-Printer.html

Haha !
 
(This will be a pretty cd wall )

___
The CD Labelmaker is looking for #D7D7D7 color areas in a sheet.
You can reroute it to another url easily...
Or use it locally

This was fun.

Base Color : A9D4A3
Mode : monochrome-dark
#5CA652
#71B567
#87C27F
#9ECE97
#C5C5C5
#D7D7D7
#E9E9E9

Base Color : FC876C
Mode : monochrome-dark
#DF320A
#F53B10
#F7512A
#F86745
#FA7D60
#BBBBBB
#C9C9C9
#D7D7D7
#E6E6E6

Base Color : FF7994
Mode : monochrome-dark
#F20636
#FA234E
#FC466A
#FD6987
#C5C5C5
#D7D7D7
#EAEAEA

Base Color : 7AD0BC
Mode : monochrome-dark
#37937E
#3FA890
#47BCA1
#5CC4AC
#70CCB7
#ACACAC
#BABABA
#C8C8C8
#D7D7D7

Base Color : FA75D6
Mode : monochrome-dark
#E20EA8
#F21DB9
#F53BC2
#F758CC
#F976D5
#C7C7C7
#D7D7D7
#E7E7E7

Base Color : C5D996
Mode : monochrome-dark
#8DAD43
#9DBD52
#ABC768
#B8D07F
#C5D996
#C7C7C7
#D7D7D7
#E7E7E7

Base Color : DB9D9E
Mode : monochrome-dark
#B34648
#C15C5E
#CB7677
#D69091
#C5C5C5
#D7D7D7
#EAEAEA