Nutrient Web SDK
    Preparing search index...

    Interface BUITheme

    See BUI Theme documentation for more information.

    interface BUITheme {
        color: {
            background: {
                interactive: {
                    active: string;
                    disabled: string;
                    enabled: string;
                    hovered: string;
                    visited: string;
                };
                inverse: { medium: string; strong: string; subtle: string };
                overlay: { interactive: string; medium: string; subtle: string };
                positive: {
                    interactive: { enabled: string };
                    medium: string;
                    strong: string;
                    subtle: string;
                };
                primary: { medium: string; strong: string; subtle: string };
                secondary: { medium: string; strong: string; subtle: string };
            };
            border: {
                interactive: {
                    active: string;
                    disabled: string;
                    enabled: string;
                    hovered: string;
                    visited: string;
                };
                inverse: string;
                medium: string;
                positive: {
                    interactive: { enabled: string };
                    medium: string;
                    strong: string;
                    subtle: string;
                };
                strong: string;
                subtle: string;
            };
            focused: { default: string; inset: string };
            icon: {
                interactive: {
                    active: string;
                    disabled: string;
                    enabled: string;
                    hovered: string;
                    visited: string;
                };
                inverse: string;
                oninteractive: string;
                primary: string;
                secondary: string;
            };
            support: {
                error: {
                    medium: string;
                    strong: string;
                    subtle: string;
                    subtler: string;
                };
                info: { medium: string; strong: string; subtle: string; subtler: string };
                success: {
                    medium: string;
                    strong: string;
                    subtle: string;
                    subtler: string;
                };
                warning: {
                    medium: string;
                    strong: string;
                    subtle: string;
                    subtler: string;
                };
            };
            text: {
                helper: string;
                interactive: {
                    active: string;
                    disabled: string;
                    enabled: string;
                    hovered: string;
                    visited: string;
                };
                inverse: string;
                oninteractive: string;
                placeholder: string;
                primary: string;
                secondary: string;
            };
        };
        elevation: { low: string; medium: string };
        opacity: { high: string; low: string; medium: string; none: string };
        rounded: {
            "2xl": string;
            full: string;
            lg: string;
            md: string;
            sm: string;
            xl: string;
            xs: string;
        };
        spacing: {
            "2xl": string;
            "3xl": string;
            "4xl": string;
            "5xl": string;
            "6xl": string;
            "7xl": string;
            "8xl": string;
            "9xl": string;
            lg: string;
            md: string;
            sm: string;
            xl: string;
            xs: string;
        };
        typography: {
            body: {
                lg: {
                    medium: { font: string; letterSpacing: string };
                    regular: { font: string; letterSpacing: string };
                    semibold: { font: string; letterSpacing: string };
                };
                md: {
                    medium: { font: string; letterSpacing: string };
                    regular: { font: string; letterSpacing: string };
                    semibold: { font: string; letterSpacing: string };
                };
                sm: {
                    medium: { font: string; letterSpacing: string };
                    regular: { font: string; letterSpacing: string };
                    semibold: { font: string; letterSpacing: string };
                };
            };
            heading: {
                h1: {
                    medium: { font: string; letterSpacing: string };
                    regular: { font: string; letterSpacing: string };
                    semibold: { font: string; letterSpacing: string };
                };
                h2: {
                    medium: { font: string; letterSpacing: string };
                    regular: { font: string; letterSpacing: string };
                    semibold: { font: string; letterSpacing: string };
                };
                h3: {
                    medium: { font: string; letterSpacing: string };
                    regular: { font: string; letterSpacing: string };
                    semibold: { font: string; letterSpacing: string };
                };
                h4: {
                    medium: { font: string; letterSpacing: string };
                    regular: { font: string; letterSpacing: string };
                    semibold: { font: string; letterSpacing: string };
                };
                h5: {
                    medium: { font: string; letterSpacing: string };
                    regular: { font: string; letterSpacing: string };
                    semibold: { font: string; letterSpacing: string };
                };
                h6: {
                    medium: { font: string; letterSpacing: string };
                    regular: { font: string; letterSpacing: string };
                    semibold: { font: string; letterSpacing: string };
                };
            };
            label: {
                lg: {
                    medium: { font: string; letterSpacing: string };
                    regular: { font: string; letterSpacing: string };
                    semibold: { font: string; letterSpacing: string };
                };
                md: {
                    medium: { font: string; letterSpacing: string };
                    regular: { font: string; letterSpacing: string };
                    semibold: { font: string; letterSpacing: string };
                };
                sm: {
                    medium: { font: string; letterSpacing: string };
                    regular: { font: string; letterSpacing: string };
                    semibold: { font: string; letterSpacing: string };
                };
            };
        };
    }
    Index

    Properties

    color: {
        background: {
            interactive: {
                active: string;
                disabled: string;
                enabled: string;
                hovered: string;
                visited: string;
            };
            inverse: { medium: string; strong: string; subtle: string };
            overlay: { interactive: string; medium: string; subtle: string };
            positive: {
                interactive: { enabled: string };
                medium: string;
                strong: string;
                subtle: string;
            };
            primary: { medium: string; strong: string; subtle: string };
            secondary: { medium: string; strong: string; subtle: string };
        };
        border: {
            interactive: {
                active: string;
                disabled: string;
                enabled: string;
                hovered: string;
                visited: string;
            };
            inverse: string;
            medium: string;
            positive: {
                interactive: { enabled: string };
                medium: string;
                strong: string;
                subtle: string;
            };
            strong: string;
            subtle: string;
        };
        focused: { default: string; inset: string };
        icon: {
            interactive: {
                active: string;
                disabled: string;
                enabled: string;
                hovered: string;
                visited: string;
            };
            inverse: string;
            oninteractive: string;
            primary: string;
            secondary: string;
        };
        support: {
            error: {
                medium: string;
                strong: string;
                subtle: string;
                subtler: string;
            };
            info: { medium: string; strong: string; subtle: string; subtler: string };
            success: {
                medium: string;
                strong: string;
                subtle: string;
                subtler: string;
            };
            warning: {
                medium: string;
                strong: string;
                subtle: string;
                subtler: string;
            };
        };
        text: {
            helper: string;
            interactive: {
                active: string;
                disabled: string;
                enabled: string;
                hovered: string;
                visited: string;
            };
            inverse: string;
            oninteractive: string;
            placeholder: string;
            primary: string;
            secondary: string;
        };
    }
    elevation: { low: string; medium: string }
    opacity: { high: string; low: string; medium: string; none: string }
    rounded: {
        "2xl": string;
        full: string;
        lg: string;
        md: string;
        sm: string;
        xl: string;
        xs: string;
    }
    spacing: {
        "2xl": string;
        "3xl": string;
        "4xl": string;
        "5xl": string;
        "6xl": string;
        "7xl": string;
        "8xl": string;
        "9xl": string;
        lg: string;
        md: string;
        sm: string;
        xl: string;
        xs: string;
    }
    typography: {
        body: {
            lg: {
                medium: { font: string; letterSpacing: string };
                regular: { font: string; letterSpacing: string };
                semibold: { font: string; letterSpacing: string };
            };
            md: {
                medium: { font: string; letterSpacing: string };
                regular: { font: string; letterSpacing: string };
                semibold: { font: string; letterSpacing: string };
            };
            sm: {
                medium: { font: string; letterSpacing: string };
                regular: { font: string; letterSpacing: string };
                semibold: { font: string; letterSpacing: string };
            };
        };
        heading: {
            h1: {
                medium: { font: string; letterSpacing: string };
                regular: { font: string; letterSpacing: string };
                semibold: { font: string; letterSpacing: string };
            };
            h2: {
                medium: { font: string; letterSpacing: string };
                regular: { font: string; letterSpacing: string };
                semibold: { font: string; letterSpacing: string };
            };
            h3: {
                medium: { font: string; letterSpacing: string };
                regular: { font: string; letterSpacing: string };
                semibold: { font: string; letterSpacing: string };
            };
            h4: {
                medium: { font: string; letterSpacing: string };
                regular: { font: string; letterSpacing: string };
                semibold: { font: string; letterSpacing: string };
            };
            h5: {
                medium: { font: string; letterSpacing: string };
                regular: { font: string; letterSpacing: string };
                semibold: { font: string; letterSpacing: string };
            };
            h6: {
                medium: { font: string; letterSpacing: string };
                regular: { font: string; letterSpacing: string };
                semibold: { font: string; letterSpacing: string };
            };
        };
        label: {
            lg: {
                medium: { font: string; letterSpacing: string };
                regular: { font: string; letterSpacing: string };
                semibold: { font: string; letterSpacing: string };
            };
            md: {
                medium: { font: string; letterSpacing: string };
                regular: { font: string; letterSpacing: string };
                semibold: { font: string; letterSpacing: string };
            };
            sm: {
                medium: { font: string; letterSpacing: string };
                regular: { font: string; letterSpacing: string };
                semibold: { font: string; letterSpacing: string };
            };
        };
    }