Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.trustware.io/llms.txt

Use this file to discover all available pages before exploring further.

The Trustware widget ships with a default visual style, but you can adjust colors, border radius, and copy to fit your product. Customization happens at two levels: the theme and messages fields in TrustwareConfigOptions, and a handful of props directly on <TrustwareWidget>.

​
theme field

The theme field accepts a TrustwareWidgetTheme object. All six properties are optional — omit any that you want to keep at their default value. 
type TrustwareWidgetTheme = {
  primaryColor: string;
  secondaryColor: string;
  backgroundColor: string;
  textColor: string;
  borderColor: string;
  radius: number;
};

​
Default theme

const DEFAULT_THEME: TrustwareWidgetTheme = {
  primaryColor: "#4F46E5",
  secondaryColor: "#6366F1",
  backgroundColor: "#FFFFFF",
  textColor: "#111827",
  borderColor: "#E5E7EB",
  radius: 8,
};

​
Theme properties

​
theme.primaryColor
string
default:"\"#4F46E5\""
The primary accent color used for buttons, active states, and highlights. Accepts any valid CSS color string.
​
theme.secondaryColor
string
default:"\"#6366F1\""
The secondary accent color, used for hover states and supporting UI elements.
​
theme.backgroundColor
string
default:"\"#FFFFFF\""
The widget’s background fill color.
​
theme.textColor
string
default:"\"#111827\""
The primary text color used for labels, amounts, and body copy inside the widget.
​
theme.borderColor
string
default:"\"#E5E7EB\""
The color applied to borders and dividers throughout the widget.
​
theme.radius
number
default:"8"
Border radius in pixels applied to cards, buttons, and input fields. Set to 0 for sharp corners or a larger value for a pill-shaped look.

​
Example

const config = {
  apiKey: process.env.NEXT_PUBLIC_TRUSTWARE_API_KEY!,
  routes: {
    toChain: "8453",
    toToken: "0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE",
  },
  theme: {
    primaryColor: "#FCB514",
    secondaryColor: "#FFFFFF",
    backgroundColor: "#000000",
    borderColor: "#FCB514",
    textColor: "#FFFFFF",
    radius: 16,
  },
} satisfies TrustwareConfigOptions;

​
Widget-level theme prop

<TrustwareWidget> accepts a theme prop that controls the light/dark mode context independently of the color values above. This is useful when your app manages a global color scheme. 
<TrustwareWidget theme="dark" />
​
theme
"light" | "dark" | "system"
Sets the color scheme context for the widget. "system" follows the user’s OS preference. Defaults to the host application’s ambient color scheme.

​
showThemeToggle

​
showThemeToggle
boolean
default:"true"
When true, a light/dark mode toggle is rendered inside the widget, letting the user switch modes themselves. Defaults to true. Set to false when your application owns the color scheme and you do not want users to override it from the widget surface.
<TrustwareWidget showThemeToggle={false} />

​
messages field

The messages field overrides the title and description text rendered at the top of the widget. Both properties are optional. 
type TrustwareWidgetMessages = {
  title: string;
  description: string;
};

​
Default messages

const DEFAULT_MESSAGES: TrustwareWidgetMessages = {
  title: "Trustware SDK",
  description: "Seamlessly bridge assets across chains with Trustware.",
};

​
Message properties

​
messages.title
string
default:"\"Trustware SDK\""
The heading shown at the top of the widget.
​
messages.description
string
The subheading or descriptor shown beneath the title.

​
Example

const config = {
  apiKey: process.env.NEXT_PUBLIC_TRUSTWARE_API_KEY!,
  routes: {
    toChain: "8453",
    toToken: "0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE",
  },
  messages: {
    title: "Deposit",
    description: "Move funds into the destination asset and chain.",
  },
} satisfies TrustwareConfigOptions;
Because messages accepts Partial<TrustwareWidgetMessages>, you can override just the title without providing a description, and the SDK will keep the default for the omitted field.