alouette/src/config/defaultColorScales.ts

A modern, customizable design system built on top of NativeWind v5 with configurable defaults

/* eslint-disable import-x/extensions */
import { createColorScale } from "./colorScales.ts";
import type { AlouetteColorScales } from "./colorScales.ts";

export const defaultColorScales: AlouetteColorScales = {
  "grayscale.light": createColorScale({
    1: "#FFFFFF",
    2: "#FAFAFA",
    3: "#EBEBEB",
    4: "#E0E0E0",
    5: "#C7C7C7",
    6: "#B8B8B8",
    7: "#8F8F8F",
    8: "#7A7A7A",
    9: "#616161",
    10: "#474747",
    11: "#141414",
  }),
  "grayscale.dark": createColorScale({
    1: "#0F0F0F",
    2: "#1F1F1F",
    3: "#292929",
    4: "#333333",
    5: "#3D3D3D",
    6: "#474747",
    7: "#525252",
    8: "#858585",
    9: "#A8A8A8",
    10: "#C2C2C2",
    11: "#F5F5F5",
  }),
  "brand.light": createColorScale({
    1: "#F7FBFD",
    2: "#EFF8FB",
    3: "#DFF1F6",
    4: "#C7EEF9",
    5: "#99DFF5",
    6: "#7DD7F2",
    7: "#23C8FB",
    8: "#049AC8",
    9: "#037496",
    10: "#024D64",
    11: "#011F28",
  }),
  "brand.dark": createColorScale({
    1: "#071418",
    2: "#0D2830",
    3: "#123540",
    4: "#104E60",
    5: "#135C72",
    6: "#156A84",
    7: "#1E94B8",
    8: "#19BEF0",
    9: "#5CD1F5",
    10: "#8CDFF8",
    11: "#D9F4FD",
  }),
  "danger.light": createColorScale({
    1: "#FDF7F7",
    2: "#FBEFEF",
    3: "#F6E0DF",
    4: "#FBD2D0",
    5: "#F7A4A1",
    6: "#F48985",
    7: "#FB342D",
    8: "#D20B04",
    9: "#A00803",
    10: "#6E0602",
    11: "#280201",
  }),
  "danger.dark": createColorScale({
    1: "#180707",
    2: "#300F0D",
    3: "#401312",
    4: "#691411",
    5: "#7B1714",
    6: "#8C1B17",
    7: "#C1251F",
    8: "#F12922",
    9: "#F56A66",
    10: "#F89996",
    11: "#FDDAD9",
  }),
  "info.light": createColorScale({
    1: "#F7FBFD",
    2: "#EFF8FB",
    3: "#DFF0F6",
    4: "#C7EDF9",
    5: "#99DEF5",
    6: "#7DD5F2",
    7: "#23C5FB",
    8: "#0497C8",
    9: "#037196",
    10: "#024B64",
    11: "#011E28",
  }),
  "info.dark": createColorScale({
    1: "#071418",
    2: "#0D2730",
    3: "#123440",
    4: "#104C60",
    5: "#135A72",
    6: "#156884",
    7: "#1E92B8",
    8: "#19BAF0",
    9: "#5CCEF5",
    10: "#8CDDF8",
    11: "#D9F4FD",
  }),
  "success.light": createColorScale({
    1: "#F7FDF7",
    2: "#EFFBEF",
    3: "#DFF6DF",
    4: "#BFF8BF",
    5: "#91F391",
    6: "#75F075",
    7: "#19FA19",
    8: "#03AA03",
    9: "#027802",
    10: "#014601",
    11: "#012801",
  }),
  "success.dark": createColorScale({
    1: "#071807",
    2: "#0D300D",
    3: "#124012",
    4: "#0F570F",
    5: "#126812",
    6: "#157915",
    7: "#1FAD1F",
    8: "#0FF00F",
    9: "#52F452",
    10: "#82F782",
    11: "#D9FDD9",
  }),
  "warning.light": createColorScale({
    1: "#FDFBF7",
    2: "#FBF7EF",
    3: "#F6EEDF",
    4: "#F8E5BF",
    5: "#F3D291",
    6: "#F0C775",
    7: "#FAAF19",
    8: "#BE8004",
    9: "#8C5E03",
    10: "#5A3D02",
    11: "#281B01",
  }),
  "warning.dark": createColorScale({
    1: "#181207",
    2: "#30240D",
    3: "#403012",
    4: "#583F0E",
    5: "#694C11",
    6: "#7B5914",
    7: "#AF7E1D",
    8: "#F0A50F",
    9: "#F4BE52",
    10: "#F7D082",
    11: "#FDF1D9",
  }),
} as const;