Prototype script for creating a custom WebAwesome palette.

create-palette.py

# /// script
# requires-python = ">=3.12"
# dependencies = [
#     "coloraide~=4.5",
# ]
# ///
from coloraide import Color, stop

BLACK = Color("black")
WHITE = Color("white")

DEFAULT_PALETTE = {
    "red": Color("#dc3146"),
    "orange": Color("#f46a45"),
    "yellow": Color("#fac22b"),
    "green": Color("#00ac49"),
    "cyan": Color("#2fbedc"),
    "blue": Color("#0071ec"),
    "indigo": Color("#6163f2"),
    "purple": Color("#9951db"),
    "pink": Color("#c84382"),
    "gray": Color("#545868"),
}

CUSTOM_PALETTE = {
    "red": Color("#E02321"),
    "yellow": Color("#FFE063"),
    "blue": Color("#2C4194"),
    "pink": Color("#E78DA7"),
    "indigo": Color("#DCE4FF"),
}

NAME_COLOR = {
    **DEFAULT_PALETTE,
    **CUSTOM_PALETTE
}

COLOR_STOP = {
    name: int(color.convert("oklch")["l"] * 10) / 10
    for name, color in NAME_COLOR.items()
}

LIGHTNESS_TOKENS = [0.95, 0.90, 0.80, 0.70, 0.60, 0.50, 0.40, 0.30, 0.20, 0.10, 0.05]

TEMPLATE = "--wa-color-{name}-{lightness_token:02.0f}: {css_color} /* {oklch_color} */;"

for name, color in NAME_COLOR.items():
    color_stop = COLOR_STOP[name]
    interpolator = Color.interpolate(
        [BLACK, stop(color, color_stop), WHITE],
        space="oklch",
        #method="continuous",
    )
    for lightness_token in LIGHTNESS_TOKENS:
        color_token = interpolator(lightness_token)
        print(TEMPLATE.format(
            name=name,
            lightness_token=lightness_token*100,
            css_color=color_token.convert("srgb").to_string(hex=True, upper=False),
            oklch_color=color_token.to_string(percent=True)
        ))
    print(f"--wa-color-{name}: var(--wa-color-{name}-{color_stop * 100:02.0f});")
    print(f"--wa-color-{name}-key: {color_stop * 100:02.0f};")
    print()

run-with-uv.sh

uv run --script create-palette.py