@carbon/colors/lib/colors.d.ts

Colors for digital and software products using the Carbon Design System

/**
 * Copyright IBM Corp. 2018, 2026
 *
 * This source code is licensed under the Apache-2.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */
export declare const black = "#000000";
export declare const black100 = "#000000";
export declare const blackHover = "#212121";
export declare const white = "#ffffff";
export declare const white0 = "#ffffff";
export declare const whiteHover = "#e8e8e8";
export declare const yellow10 = "#fcf4d6";
export declare const yellow20 = "#fddc69";
export declare const yellow30 = "#f1c21b";
export declare const yellow40 = "#d2a106";
export declare const yellow50 = "#b28600";
export declare const yellow60 = "#8e6a00";
export declare const yellow70 = "#684e00";
export declare const yellow80 = "#483700";
export declare const yellow90 = "#302400";
export declare const yellow100 = "#1c1500";
export declare const yellow: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const yellow10Hover = "#f8e6a0";
export declare const yellow20Hover = "#fccd27";
export declare const yellow30Hover = "#ddb00e";
export declare const yellow40Hover = "#bc9005";
export declare const yellow50Hover = "#9e7700";
export declare const yellow60Hover = "#755800";
export declare const yellow70Hover = "#806000";
export declare const yellow80Hover = "#5c4600";
export declare const yellow90Hover = "#3d2e00";
export declare const yellow100Hover = "#332600";
export declare const yellowHover: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const orange10 = "#fff2e8";
export declare const orange20 = "#ffd9be";
export declare const orange30 = "#ffb784";
export declare const orange40 = "#ff832b";
export declare const orange50 = "#eb6200";
export declare const orange60 = "#ba4e00";
export declare const orange70 = "#8a3800";
export declare const orange80 = "#5e2900";
export declare const orange90 = "#3e1a00";
export declare const orange100 = "#231000";
export declare const orange: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const orange10Hover = "#ffe2cc";
export declare const orange20Hover = "#ffc69e";
export declare const orange30Hover = "#ff9d57";
export declare const orange40Hover = "#fa6800";
export declare const orange50Hover = "#cc5500";
export declare const orange60Hover = "#9e4200";
export declare const orange70Hover = "#a84400";
export declare const orange80Hover = "#753300";
export declare const orange90Hover = "#522200";
export declare const orange100Hover = "#421e00";
export declare const orangeHover: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const red10 = "#fff1f1";
export declare const red20 = "#ffd7d9";
export declare const red30 = "#ffb3b8";
export declare const red40 = "#ff8389";
export declare const red50 = "#fa4d56";
export declare const red60 = "#da1e28";
export declare const red70 = "#a2191f";
export declare const red80 = "#750e13";
export declare const red90 = "#520408";
export declare const red100 = "#2d0709";
export declare const red: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const red100Hover = "#540d11";
export declare const red90Hover = "#66050a";
export declare const red80Hover = "#921118";
export declare const red70Hover = "#c21e25";
export declare const red60Hover = "#b81922";
export declare const red50Hover = "#ee0713";
export declare const red40Hover = "#ff6168";
export declare const red30Hover = "#ff99a0";
export declare const red20Hover = "#ffc2c5";
export declare const red10Hover = "#ffe0e0";
export declare const redHover: {
    100: string;
    90: string;
    80: string;
    70: string;
    60: string;
    50: string;
    40: string;
    30: string;
    20: string;
    10: string;
};
export declare const magenta10 = "#fff0f7";
export declare const magenta20 = "#ffd6e8";
export declare const magenta30 = "#ffafd2";
export declare const magenta40 = "#ff7eb6";
export declare const magenta50 = "#ee5396";
export declare const magenta60 = "#d02670";
export declare const magenta70 = "#9f1853";
export declare const magenta80 = "#740937";
export declare const magenta90 = "#510224";
export declare const magenta100 = "#2a0a18";
export declare const magenta: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const magenta100Hover = "#53142f";
export declare const magenta90Hover = "#68032e";
export declare const magenta80Hover = "#8e0b43";
export declare const magenta70Hover = "#bf1d63";
export declare const magenta60Hover = "#b0215f";
export declare const magenta50Hover = "#e3176f";
export declare const magenta40Hover = "#ff57a0";
export declare const magenta30Hover = "#ff94c3";
export declare const magenta20Hover = "#ffbdda";
export declare const magenta10Hover = "#ffe0ef";
export declare const magentaHover: {
    100: string;
    90: string;
    80: string;
    70: string;
    60: string;
    50: string;
    40: string;
    30: string;
    20: string;
    10: string;
};
export declare const purple10 = "#f6f2ff";
export declare const purple20 = "#e8daff";
export declare const purple30 = "#d4bbff";
export declare const purple40 = "#be95ff";
export declare const purple50 = "#a56eff";
export declare const purple60 = "#8a3ffc";
export declare const purple70 = "#6929c4";
export declare const purple80 = "#491d8b";
export declare const purple90 = "#31135e";
export declare const purple100 = "#1c0f30";
export declare const purple: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const purple100Hover = "#341c59";
export declare const purple90Hover = "#40197b";
export declare const purple80Hover = "#5b24ad";
export declare const purple70Hover = "#7c3dd6";
export declare const purple60Hover = "#7822fb";
export declare const purple50Hover = "#9352ff";
export declare const purple40Hover = "#ae7aff";
export declare const purple30Hover = "#c5a3ff";
export declare const purple20Hover = "#dcc7ff";
export declare const purple10Hover = "#ede5ff";
export declare const purpleHover: {
    100: string;
    90: string;
    80: string;
    70: string;
    60: string;
    50: string;
    40: string;
    30: string;
    20: string;
    10: string;
};
export declare const blue10 = "#edf5ff";
export declare const blue20 = "#d0e2ff";
export declare const blue30 = "#a6c8ff";
export declare const blue40 = "#78a9ff";
export declare const blue50 = "#4589ff";
export declare const blue60 = "#0f62fe";
export declare const blue70 = "#0043ce";
export declare const blue80 = "#002d9c";
export declare const blue90 = "#001d6c";
export declare const blue100 = "#001141";
export declare const blue: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const blue100Hover = "#001f75";
export declare const blue90Hover = "#00258a";
export declare const blue80Hover = "#0039c7";
export declare const blue70Hover = "#0053ff";
export declare const blue60Hover = "#0050e6";
export declare const blue50Hover = "#1f70ff";
export declare const blue40Hover = "#5c97ff";
export declare const blue30Hover = "#8ab6ff";
export declare const blue20Hover = "#b8d3ff";
export declare const blue10Hover = "#dbebff";
export declare const blueHover: {
    100: string;
    90: string;
    80: string;
    70: string;
    60: string;
    50: string;
    40: string;
    30: string;
    20: string;
    10: string;
};
export declare const cyan10 = "#e5f6ff";
export declare const cyan20 = "#bae6ff";
export declare const cyan30 = "#82cfff";
export declare const cyan40 = "#33b1ff";
export declare const cyan50 = "#1192e8";
export declare const cyan60 = "#0072c3";
export declare const cyan70 = "#00539a";
export declare const cyan80 = "#003a6d";
export declare const cyan90 = "#012749";
export declare const cyan100 = "#061727";
export declare const cyan: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const cyan10Hover = "#cceeff";
export declare const cyan20Hover = "#99daff";
export declare const cyan30Hover = "#57beff";
export declare const cyan40Hover = "#059fff";
export declare const cyan50Hover = "#0f7ec8";
export declare const cyan60Hover = "#005fa3";
export declare const cyan70Hover = "#0066bd";
export declare const cyan80Hover = "#00498a";
export declare const cyan90Hover = "#013360";
export declare const cyan100Hover = "#0b2947";
export declare const cyanHover: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const teal10 = "#d9fbfb";
export declare const teal20 = "#9ef0f0";
export declare const teal30 = "#3ddbd9";
export declare const teal40 = "#08bdba";
export declare const teal50 = "#009d9a";
export declare const teal60 = "#007d79";
export declare const teal70 = "#005d5d";
export declare const teal80 = "#004144";
export declare const teal90 = "#022b30";
export declare const teal100 = "#081a1c";
export declare const teal: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const teal10Hover = "#acf6f6";
export declare const teal20Hover = "#57e5e5";
export declare const teal30Hover = "#25cac8";
export declare const teal40Hover = "#07aba9";
export declare const teal50Hover = "#008a87";
export declare const teal60Hover = "#006b68";
export declare const teal70Hover = "#007070";
export declare const teal80Hover = "#005357";
export declare const teal90Hover = "#033940";
export declare const teal100Hover = "#0f3034";
export declare const tealHover: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const green10 = "#defbe6";
export declare const green20 = "#a7f0ba";
export declare const green30 = "#6fdc8c";
export declare const green40 = "#42be65";
export declare const green50 = "#24a148";
export declare const green60 = "#198038";
export declare const green70 = "#0e6027";
export declare const green80 = "#044317";
export declare const green90 = "#022d0d";
export declare const green100 = "#071908";
export declare const green: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const green10Hover = "#b6f6c8";
export declare const green20Hover = "#74e792";
export declare const green30Hover = "#36ce5e";
export declare const green40Hover = "#3bab5a";
export declare const green50Hover = "#208e3f";
export declare const green60Hover = "#166f31";
export declare const green70Hover = "#11742f";
export declare const green80Hover = "#05521c";
export declare const green90Hover = "#033b11";
export declare const green100Hover = "#0d300f";
export declare const greenHover: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const coolGray10 = "#f2f4f8";
export declare const coolGray20 = "#dde1e6";
export declare const coolGray30 = "#c1c7cd";
export declare const coolGray40 = "#a2a9b0";
export declare const coolGray50 = "#878d96";
export declare const coolGray60 = "#697077";
export declare const coolGray70 = "#4d5358";
export declare const coolGray80 = "#343a3f";
export declare const coolGray90 = "#21272a";
export declare const coolGray100 = "#121619";
export declare const coolGray: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const coolGray10Hover = "#e4e9f1";
export declare const coolGray20Hover = "#cdd3da";
export declare const coolGray30Hover = "#adb5bd";
export declare const coolGray40Hover = "#9199a1";
export declare const coolGray50Hover = "#757b85";
export declare const coolGray60Hover = "#585e64";
export declare const coolGray70Hover = "#5d646a";
export declare const coolGray80Hover = "#434a51";
export declare const coolGray90Hover = "#2b3236";
export declare const coolGray100Hover = "#222a2f";
export declare const coolGrayHover: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const gray10 = "#f4f4f4";
export declare const gray20 = "#e0e0e0";
export declare const gray30 = "#c6c6c6";
export declare const gray40 = "#a8a8a8";
export declare const gray50 = "#8d8d8d";
export declare const gray60 = "#6f6f6f";
export declare const gray70 = "#525252";
export declare const gray80 = "#393939";
export declare const gray90 = "#262626";
export declare const gray100 = "#161616";
export declare const gray: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const gray10Hover = "#e8e8e8";
export declare const gray20Hover = "#d1d1d1";
export declare const gray30Hover = "#b5b5b5";
export declare const gray40Hover = "#999999";
export declare const gray50Hover = "#7a7a7a";
export declare const gray60Hover = "#5e5e5e";
export declare const gray70Hover = "#636363";
export declare const gray80Hover = "#474747";
export declare const gray90Hover = "#333333";
export declare const gray100Hover = "#292929";
export declare const grayHover: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const warmGray10 = "#f7f3f2";
export declare const warmGray20 = "#e5e0df";
export declare const warmGray30 = "#cac5c4";
export declare const warmGray40 = "#ada8a8";
export declare const warmGray50 = "#8f8b8b";
export declare const warmGray60 = "#726e6e";
export declare const warmGray70 = "#565151";
export declare const warmGray80 = "#3c3838";
export declare const warmGray90 = "#272525";
export declare const warmGray100 = "#171414";
export declare const warmGray: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export declare const warmGray10Hover = "#f0e8e6";
export declare const warmGray20Hover = "#d8d0cf";
export declare const warmGray30Hover = "#b9b3b1";
export declare const warmGray40Hover = "#9c9696";
export declare const warmGray50Hover = "#7f7b7b";
export declare const warmGray60Hover = "#605d5d";
export declare const warmGray70Hover = "#696363";
export declare const warmGray80Hover = "#4c4848";
export declare const warmGray90Hover = "#343232";
export declare const warmGray100Hover = "#2c2626";
export declare const warmGrayHover: {
    10: string;
    20: string;
    30: string;
    40: string;
    50: string;
    60: string;
    70: string;
    80: string;
    90: string;
    100: string;
};
export type ColorScale = Record<number, string>;
export type ColorGroup = Record<string, ColorScale>;
export type HoverColorGroup = Record<string, string | ColorScale>;
export declare const colors: ColorGroup;
export declare const hoverColors: HoverColorGroup;