lightTheme

Create a custom light theme object by using the default dark theme as a base and applying overrides.

Example

Get the default light theme

const defaultLightTheme = lightTheme();

Create a custom light theme

const customTheme = lightTheme({
colors: {
modalBg: "red",
},
});
function lightTheme(overrides?: ThemeOverrides): Theme;

Parameters

The overrides to apply to the default light theme.

Type

let overrides: {
[key in Exclude<keyof Theme, "type">]: Partial<Theme[key]>;
};

Returns

let returnType: {
colors: {
accentButtonBg: string;
accentButtonText: string;
accentText: string;
borderColor: string;
connectedButtonBg: string;
connectedButtonBgHover: string;
danger: string;
inputAutofillBg: string;
modalBg: string;
modalOverlayBg: string;
primaryButtonBg: string;
primaryButtonText: string;
primaryText: string;
scrollbarBg: string;
secondaryButtonBg: string;
secondaryButtonHoverBg: string;
secondaryButtonText: string;
secondaryIconColor: string;
secondaryIconHoverBg: string;
secondaryIconHoverColor: string;
secondaryText: string;
selectedTextBg: string;
selectedTextColor: string;
separatorLine: string;
skeletonBg: string;
success: string;
tertiaryBg: string;
tooltipBg: string;
tooltipText: string;
};
fontFamily: string;
type: "light" | "dark";
};