Skip to main content
type IframeTheme = {
  pageBg: string;
  buttonBg: string;
  buttonBgHover: string;
  buttonBgPressed: string;
  buttonBgFocus: string;
  buttonBorder: string;
  buttonBorderHover: string;
  buttonBorderPressed: string;
  buttonBorderFocus: string;
  buttonBorderFocusInset: string;
  buttonText: string;
  buttonTextHover: string;
  buttonTextPressed: string;
  buttonTextFocus: string;
  buttonBorderRadius: number;
  buttonFontSize: number;
  buttonFontWeight: number;
  buttonSize: "xs" | "sm" | "md" | "lg";
  fontUrl: string;
  fontFamily: string;
};
The theme for the secure iframe. Colors should be hex strings (with or without alpha) or the string “transparent”.

​
Properties

PropertyTypeDescription
pageBgstringThe background color of the page.
buttonBgstringThe background color of the button.
buttonBgHoverstringThe background color of the button when hovered.
buttonBgPressedstringThe background color of the button when pressed.
buttonBgFocusstringThe background color of the button when focused.
buttonBorderstringThe border color of the button.
buttonBorderHoverstringThe border color of the button when hovered.
buttonBorderPressedstringThe border color of the button when pressed.
buttonBorderFocusstringThe ring color of the button when focused.
buttonBorderFocusInsetstringThe inner ring color of the button when focused.
buttonTextstringThe text color of the button.
buttonTextHoverstringThe text color of the button when hovered.
buttonTextPressedstringThe text color of the button when pressed.
buttonTextFocusstringThe text color of the button when focused.
buttonBorderRadiusnumberThe border radius of the button.
buttonFontSizenumberThe font size of the button.
buttonFontWeightnumberThe font weight of the button.
buttonSize"xs" | "sm" | "md" | "lg"The size of the button.
fontUrlstringThe URL of the font to use for the button. Must be a google webfont URL.
fontFamilystringThe font family to use for the button.