@twilio-paste/design-tokens/dist/tokens.es6.js

export const borderRadius0 = "0";
export const borderRadius10 = "3px";
export const borderRadius20 = "4px";
export const borderRadius30 = "8px";
export const borderRadiusCircle = "50%";
export const borderWidth0 = "0";
export const borderWidth10 = "1px";
export const borderWidth20 = "2px";
export const colorBackground = "#f8f8f9";
export const colorBackgroundBody = "#ffffff";
export const colorBackgroundBrand = "#233659";
export const colorBackgroundBrandHighlight = "#f22f46";
export const colorBackgroundDestructive = "#cb0000";
export const colorBackgroundDestructiveDark = "#b20600";
export const colorBackgroundDestructiveDarker = "#921200";
export const colorBackgroundDestructiveLight = "#ecb6b6";
export const colorBackgroundDestructiveLighter = "#f5dddd";
export const colorBackgroundDestructiveLightest = "#fff6f6";
export const colorBackgroundError = "#cb0000";
export const colorBackgroundErrorLightest = "#fff6f6";
export const colorBackgroundInverse = "#4f5355";
export const colorBackgroundPrimary = "#0075c3";
export const colorBackgroundPrimaryDark = "#005ea6";
export const colorBackgroundPrimaryDarker = "#003e82";
export const colorBackgroundPrimaryLight = "#b3d3e9";
export const colorBackgroundPrimaryLighter = "#dceaf4";
export const colorBackgroundPrimaryLightest = "#f6fcff";
export const colorBackgroundRowStriped = "#f8f8f9";
export const colorBackgroundSuccess = "#00994a";
export const colorBackgroundSuccessLightest = "#e0ffef";
export const colorBackgroundWarning = "#e46216";
export const colorBackgroundWarningLightest = "#fff5eb";
export const colorBorder = "#c8cccf";
export const colorBorderDark = "#888c8e";
export const colorBorderDestructive = "#cb0000";
export const colorBorderDestructiveDark = "#b20600";
export const colorBorderDestructiveDarker = "#921200";
export const colorBorderDestructiveLight = "#ecb6b6";
export const colorBorderDestructiveLighter = "#f5dddd";
export const colorBorderError = "#cb0000";
export const colorBorderErrorLightest = "#fff6f6";
export const colorBorderInput = "#888c8e";
export const colorBorderInputFocus = "#0075c3";
export const colorBorderInputHover = "#0075c3";
export const colorBorderLight = "#e4e7e9";
export const colorBorderPrimary = "#0075c3";
export const colorBorderPrimaryDark = "#005ea6";
export const colorBorderPrimaryDarker = "#003e82";
export const colorBorderPrimaryLight = "#b3d3e9";
export const colorBorderPrimaryLighter = "#dceaf4";
export const colorBorderSuccess = "#00994a";
export const colorBorderSuccessLightest = "#e0ffef";
export const colorBorderWarning = "#e46216";
export const colorBorderWarningLightest = "#fff5eb";
export const colorBrand = "#233659";
export const colorBrandHighlight = "#f22f46";
export const colorGray0 = "#ffffff";
export const colorGray10 = "#fafafa";
export const colorGray100 = "#282a2b";
export const colorGray20 = "#f8f8f9";
export const colorGray30 = "#f2f3f4";
export const colorGray40 = "#e4e7e9";
export const colorGray50 = "#c8cccf";
export const colorGray60 = "#888c8e";
export const colorGray70 = "#666a6d";
export const colorGray80 = "#4f5355";
export const colorGray90 = "#424547";
export const colorText = "#282a2b";
export const colorTextBrandHighlight = "#f22f46";
export const colorTextBrandInverse = "#ffffff";
export const colorTextError = "#cb0000";
export const colorTextIcon = "#282a2b";
export const colorTextInverse = "#ffffff";
export const colorTextInverseWeak = "#888c8e";
export const colorTextLabel = "#282a2b";
export const colorTextLink = "#0075c3";
export const colorTextLinkDark = "#005ea6";
export const colorTextLinkDarker = "#003e82";
export const colorTextLinkDestructive = "#cb0000";
export const colorTextLinkDestructiveDark = "#b20600";
export const colorTextLinkDestructiveDarker = "#921200";
export const colorTextLinkDestructiveLight = "#ecb6b6";
export const colorTextLinkLight = "#b3d3e9";
export const colorTextPlaceholder = "#666a6d";
export const colorTextSuccess = "#00994a";
export const colorTextWarning = "#e46216";
export const colorTextWeak = "#666a6d";
export const fontFamilyCode = "'Fira Mono', 'Courier New', Courier, monospace";
export const fontFamilyText = "'Whitney SSm A', 'Whitney SSm B', 'Helvetica Neue', Helvetica, Arial, sans-serif";
export const fontSize10 = "0.625rem";
export const fontSize100 = "2.5rem";
export const fontSize110 = "3rem";
export const fontSize20 = "0.75rem";
export const fontSize30 = "0.875rem";
export const fontSize40 = "1rem";
export const fontSize50 = "1.125rem";
export const fontSize60 = "1.25rem";
export const fontSize70 = "1.5rem";
export const fontSize80 = "1.75rem";
export const fontSize90 = "2rem";
export const fontWeightBold = "700";
export const fontWeightLight = "300";
export const fontWeightMedium = "500";
export const fontWeightNormal = "400";
export const fontWeightSemibold = "600";
export const lineHeight10 = "1rem";
export const lineHeight100 = "3.25rem";
export const lineHeight110 = "3.75rem";
export const lineHeight20 = "1.25rem";
export const lineHeight30 = "1.5rem";
export const lineHeight40 = "1.75rem";
export const lineHeight50 = "1.75rem";
export const lineHeight60 = "1.75rem";
export const lineHeight70 = "2rem";
export const lineHeight80 = "2.25rem";
export const lineHeight90 = "2.5rem";
export const shadowCard = "0 2px 4px 0 rgba(40, 42, 43, 0.3)";
export const shadowFocus = "0 0 0 4px rgba(0,117,195,0.5)";
export const size0 = "0";
export const size10 = "5.5rem";
export const size100 = "64rem";
export const size110 = "70.5rem";
export const size120 = "77rem";
export const size20 = "12rem";
export const size30 = "18.5rem";
export const size40 = "25rem";
export const size50 = "31.5rem";
export const size60 = "38rem";
export const size70 = "44.5rem";
export const size80 = "51rem";
export const size90 = "57.5rem";
export const sizeIcon10 = "1rem";
export const sizeIcon20 = "1.5rem";
export const sizeIcon30 = "2rem";
export const space0 = "0";
export const space10 = "0.125rem";
export const space100 = "2.25rem";
export const space110 = "2.5rem";
export const space120 = "2.75rem";
export const space130 = "3rem";
export const space140 = "3.25rem";
export const space150 = "3.5rem";
export const space160 = "3.75rem";
export const space170 = "4rem";
export const space180 = "4.25rem";
export const space190 = "4.5rem";
export const space20 = "0.25rem";
export const space200 = "4.75rem";
export const space30 = "0.5rem";
export const space40 = "0.75rem";
export const space50 = "1rem";
export const space60 = "1.25rem";
export const space70 = "1.5rem";
export const space80 = "1.75rem";
export const space90 = "2rem";
export const zIndex0 = "0";
export const zIndex10 = "10";
export const zIndex20 = "20";
export const zIndex30 = "30";
export const zIndex40 = "40";
export const zIndex50 = "50";
export const zIndex60 = "60";
export const zIndex70 = "70";
export const zIndex80 = "80";
export const zIndex90 = "90";
export const backgroundColors = {
colorBackground,
colorBackgroundBody,
colorBackgroundBrand,
colorBackgroundBrandHighlight,
colorBackgroundDestructive,
colorBackgroundDestructiveDark,
colorBackgroundDestructiveDarker,
colorBackgroundDestructiveLight,
colorBackgroundDestructiveLighter,
colorBackgroundDestructiveLightest,
colorBackgroundError,
colorBackgroundErrorLightest,
colorBackgroundInverse,
colorBackgroundPrimary,
colorBackgroundPrimaryDark,
colorBackgroundPrimaryDarker,
colorBackgroundPrimaryLight,
colorBackgroundPrimaryLighter,
colorBackgroundPrimaryLightest,
colorBackgroundRowStriped,
colorBackgroundSuccess,
colorBackgroundSuccessLightest,
colorBackgroundWarning,
colorBackgroundWarningLightest,
};
export const borderColors = {
colorBorder,
colorBorderDark,
colorBorderDestructive,
colorBorderDestructiveDark,
colorBorderDestructiveDarker,
colorBorderDestructiveLight,
colorBorderDestructiveLighter,
colorBorderError,
colorBorderErrorLightest,
colorBorderInput,
colorBorderInputFocus,
colorBorderInputHover,
colorBorderLight,
colorBorderPrimary,
colorBorderPrimaryDark,
colorBorderPrimaryDarker,
colorBorderPrimaryLight,
colorBorderPrimaryLighter,
colorBorderSuccess,
colorBorderSuccessLightest,
colorBorderWarning,
colorBorderWarningLightest,
};
export const borderWidths = {
borderWidth0,
borderWidth10,
borderWidth20,
};
export const boxShadows = {
shadowCard,
shadowFocus,
};
export const colors = {
colorBrand,
colorBrandHighlight,
colorGray0,
colorGray10,
colorGray100,
colorGray20,
colorGray30,
colorGray40,
colorGray50,
colorGray60,
colorGray70,
colorGray80,
colorGray90,
};
export const fonts = {
fontFamilyCode,
fontFamilyText,
};
export const fontSizes = {
fontSize10,
fontSize100,
fontSize110,
fontSize20,
fontSize30,
fontSize40,
fontSize50,
fontSize60,
fontSize70,
fontSize80,
fontSize90,
};
export const fontWeights = {
fontWeightBold,
fontWeightLight,
fontWeightMedium,
fontWeightNormal,
fontWeightSemibold,
};
export const lineHeights = {
lineHeight10,
lineHeight100,
lineHeight110,
lineHeight20,
lineHeight30,
lineHeight40,
lineHeight50,
lineHeight60,
lineHeight70,
lineHeight80,
lineHeight90,
};
export const radii = {
borderRadius0,
borderRadius10,
borderRadius20,
borderRadius30,
borderRadiusCircle,
};
export const sizings = {
size0,
size10,
size100,
size110,
size120,
size20,
size30,
size40,
size50,
size60,
size70,
size80,
size90,
sizeIcon10,
sizeIcon20,
sizeIcon30,
};
export const spacings = {
space0,
space10,
space100,
space110,
space120,
space130,
space140,
space150,
space160,
space170,
space180,
space190,
space20,
space200,
space30,
space40,
space50,
space60,
space70,
space80,
space90,
};
export const textColors = {
colorText,
colorTextBrandHighlight,
colorTextBrandInverse,
colorTextError,
colorTextIcon,
colorTextInverse,
colorTextInverseWeak,
colorTextLabel,
colorTextLink,
colorTextLinkDark,
colorTextLinkDarker,
colorTextLinkDestructive,
colorTextLinkDestructiveDark,
colorTextLinkDestructiveDarker,
colorTextLinkDestructiveLight,
colorTextLinkLight,
colorTextPlaceholder,
colorTextSuccess,
colorTextWarning,
colorTextWeak,
};
export const zIndices = {
zIndex0,
zIndex10,
zIndex20,
zIndex30,
zIndex40,
zIndex50,
zIndex60,
zIndex70,
zIndex80,
zIndex90,
};