Theme Gallery

Updated on 12 Dec 2025
8 Minutes to read

Print
Share
Dark
Light

Article summary

Did you find this summary helpful?

Thank you for your feedback!

Theming is in Gradual Rollout

Theming is currently available to select teams and will be rolling out to more teams in the coming weeks.

Explore our collection of pre-built themes. Each theme includes ready-to-use JSON configurations that you can copy and paste directly into Preset.

Light Themes

Platinum Edge

Screenshot 2025-11-20 at 1.32.05 AM.png

View Platinum Edge Theme Configuration

{
  "token": {
    "colorPrimary": "#424242",
    "colorPrimaryHover": "#212121",
    "colorSuccess": "#2e7d48",
    "colorWarning": "#F57C00",
    "colorError": "#C62828",
    "colorInfo": "#424242",
    "colorTextBase": "#212121",
    "colorTextSecondary": "#424242",
    "colorTextTertiary": "#757575",
    "colorTextQuaternary": "#BDBDBD",
    "colorBgBase": "#FAFAFA",
    "colorBgContainer": "#FFFFFF",
    "colorBgElevated": "#FFFFFF",
    "colorBgLayout": "#F5F5F5",
    "colorBgSpotlight": "#EEEEEE",
    "colorBgMask": "rgba(66, 66, 66, 0.5)",
    "colorBorder": "#E0E0E0",
    "colorBorderSecondary": "#F5F5F5",
    "borderRadius": 2,
    "borderRadiusLG": 4,
    "borderRadiusSM": 1,
    "borderRadiusXS": 0,
    "fontFamily": "'Clash Grotesk', 'Montserrat', sans-serif",
    "fontFamilyCode": "'JetBrains Mono', monospace",
    "fontSize": 14,
    "fontSizeLG": 16,
    "fontSizeSM": 12,
    "fontSizeXL": 20,
    "fontWeightStrong": 700,
    "lineHeight": 1.4,
    "lineHeightLG": 1.5,
    "lineHeightSM": 1.3,
    "motion": true,
    "motionDurationMid": "0.15s",
    "motionDurationSlow": "0.25s",
    "boxShadow": "0 1px 4px rgba(0, 0, 0, 0.1)",
    "boxShadowSecondary": "0 2px 8px rgba(0, 0, 0, 0.05)",
    "controlOutlineWidth": 1,
    "wireframe": false,
    "colorPrimaryBg": "#f5f5f5",
    "colorPrimaryBgHover": "#e9e9e9",
    "colorSuccessBg": "#deece0",
    "colorSuccessBgHover": "#d2e1d6"
  },
  "components": {
    "Button": {
      "colorPrimary": "#424242",
      "colorPrimaryHover": "#212121",
      "borderRadius": 0,
      "fontWeight": 700
    },
    "Card": {
      "colorBgContainer": "#FFFFFF",
      "borderRadiusLG": 2
    },
    "Layout": {
      "colorBgHeader": "#F5F5F5",
      "colorBgBody": "#FAFAFA",
      "colorBgSider": "#EEEEEE"
    },
    "Typography": {
      "fontFamily": "'Clash Grotesk', 'Montserrat', sans-serif",
      "fontWeightStrong": 500
    },
    "Tooltip": {
      "colorText": "rgb(66,66,66)",
      "colorTextLightSolid": "rgb(66,66,66)"
    },
    "Alert": {
      "colorInfoBg": "rgb(241,239,239)"
    },
    "Tag": {
      "colorPrimaryActive": "rgb(228,227,227)"
    }
  }
}

Icy Blue

Screenshot 2025-11-20 at 1.34.07 AM.png

View Icy Blue Theme Configuration

{
  "token": {
    "colorPrimary": "#1565C0",
    "colorSuccess": "#2E7D32",
    "colorWarning": "#F57C00",
    "colorError": "#C62828",
    "colorInfo": "#1565C0",
    "colorText": "#1A237E",
    "colorTextSecondary": "#3949AB",
    "colorTextTertiary": "#5C6BC0",
    "colorTextQuaternary": "#9FA8DA",
    "colorBgBase": "#F5F9FF",
    "colorBgContainer": "#FAFCFF",
    "colorBgElevated": "#FFFFFF",
    "colorBgLayout": "#F0F6FE",
    "colorBorder": "#BBDEFB",
    "colorBorderSecondary": "#E3F2FD",
    "colorSplit": "#D1E5F0",
    "colorLink": "#1976D2",
    "colorLinkHover": "#1565C0",
    "colorLinkActive": "#0D47A1",
    "colorPrimaryBg": "#F2F8FE",
    "colorPrimaryBgHover": "#EBF4FF",
    "colorPrimaryBorder": "#90CAF9",
    "colorPrimaryBorderHover": "#64B5F6",
    "colorPrimaryHover": "#0D47A1",
    "colorPrimaryActive": "#0A3A8A",
    "colorPrimaryText": "#1565C0",
    "colorPrimaryTextHover": "#0D47A1",
    "colorPrimaryTextActive": "#0A3A8A",
    "colorSuccessBg": "#E8F5E8",
    "colorSuccessBgHover": "#C8E6C9",
    "colorSuccessBorder": "#A5D6A7",
    "colorSuccessBorderHover": "#81C784",
    "colorSuccessHover": "#1B5E20",
    "colorSuccessText": "#2E7D32",
    "colorSuccessTextHover": "#1B5E20",
    "colorSuccessTextActive": "#145A1C",
    "colorWarningBg": "#FFF3E0",
    "colorWarningBgHover": "#FFE0B2",
    "colorWarningBorder": "#FFCC80",
    "colorWarningBorderHover": "#FFB74D",
    "colorWarningHover": "#E65100",
    "colorWarningText": "#F57C00",
    "colorWarningTextHover": "#E65100",
    "colorWarningTextActive": "#D84315",
    "colorErrorBg": "#FFEBEE",
    "colorErrorBgHover": "#FFCDD2",
    "colorErrorBorder": "#EF9A9A",
    "colorErrorBorderHover": "#E57373",
    "colorErrorHover": "#B71C1C",
    "colorErrorText": "#C62828",
    "colorErrorTextHover": "#B71C1C",
    "colorErrorTextActive": "#A21A1A",
    "colorInfoBg": "#F0F8FF",
    "colorInfoBgHover": "#E8F4FF",
    "colorInfoBorder": "#81D4FA",
    "colorInfoBorderHover": "#4FC3F7",
    "colorInfoHover": "#01579B",
    "colorInfoText": "#0277BD",
    "colorInfoTextHover": "#01579B",
    "colorInfoTextActive": "#014A87",
    "colorTextPlaceholder": "#B0BEC5",
    "colorTextDisabled": "#CFD8DC",
    "colorTextHeading": "#0D47A1",
    "colorTextLabel": "#1565C0",
    "colorTextDescription": "#5C6BC0",
    "colorTextLightSolid": "#FFFFFF",
    "colorFill": "#F0F6FE",
    "colorFillAlter": "#EBF4FF",
    "colorFillContent": "#F2F8FE",
    "colorFillContentHover": "#EBF4FF",
    "colorFillQuaternary": "#F5F9FF",
    "colorFillSecondary": "#F2F8FE",
    "colorFillTertiary": "#F0F6FE",
    "colorHighlight": "#F2F8FE",
    "colorIcon": "#5C6BC0",
    "colorIconHover": "#3949AB",
    "colorWhite": "#FFFFFF",
    "colorBgMask": "rgba(21, 101, 192, 0.45)",
    "colorBgSpotlight": "#FFFFFF",
    "colorBgTextActive": "#EBF4FF",
    "colorBgTextHover": "#F2F8FE",
    "controlItemBgActive": "#F2F8FE",
    "controlItemBgActiveDisabled": "#F8FCFF",
    "controlItemBgActiveHover": "#EBF4FF",
    "controlItemBgHover": "#F0F6FE",
    "controlOutline": "rgba(21, 101, 192, 0.15)",
    "fontFamily": "'Satoshi', -apple-system, BlinkMacSystemFont, sans-serif",
    "fontFamilyCode": "'JetBrains Mono', 'Fira Code', monospace",
    "fontSize": 14,
    "fontSizeSM": 12,
    "fontSizeLG": 16,
    "fontSizeXL": 20,
    "fontSizeHeading1": 38,
    "fontSizeHeading2": 30,
    "fontSizeHeading3": 24,
    "fontSizeHeading4": 20,
    "fontSizeHeading5": 16,
    "lineHeight": 1.5714285714285714,
    "lineHeightLG": 1.5,
    "lineHeightSM": 1.6666666666666667,
    "lineHeightHeading1": 1.2105263157894737,
    "lineHeightHeading2": 1.2666666666666666,
    "lineHeightHeading3": 1.3333333333333333,
    "lineHeightHeading4": 1.4,
    "lineHeightHeading5": 1.5,
    "borderRadius": 12,
    "borderRadiusLG": 16,
    "borderRadiusSM": 8,
    "borderRadiusXS": 4,
    "borderRadiusOuter": 8,
    "boxShadow": "0 1px 2px 0 rgba(21, 101, 192, 0.03), 0 1px 6px -1px rgba(21, 101, 192, 0.02), 0 2px 4px 0 rgba(21, 101, 192, 0.02)",
    "boxShadowSecondary": "0 6px 16px 0 rgba(21, 101, 192, 0.08), 0 3px 6px -4px rgba(21, 101, 192, 0.12), 0 9px 28px 8px rgba(21, 101, 192, 0.05)",
    "boxShadowTertiary": "0 1px 2px 0 rgba(21, 101, 192, 0.03), 0 1px 6px -1px rgba(21, 101, 192, 0.02), 0 2px 4px 0 rgba(21, 101, 192, 0.02)",
    "margin": 16,
    "marginXS": 8,
    "marginSM": 12,
    "marginMD": 16,
    "marginLG": 24,
    "marginXL": 32,
    "marginXXL": 48,
    "marginXXS": 4,
    "padding": 16,
    "paddingXS": 8,
    "paddingSM": 12,
    "paddingMD": 16,
    "paddingLG": 24,
    "paddingXL": 32,
    "paddingXXS": 4,
    "motionDurationFast": "0.1s",
    "motionDurationMid": "0.2s",
    "motionDurationSlow": "0.3s",
    "zIndexBase": 0,
    "zIndexPopupBase": 1000,
    "wireframe": false
  },
  "components": {
    "Button": {
      "colorPrimary": "#1565C0",
      "colorPrimaryHover": "#0D47A1",
      "borderRadius": 10,
      "fontWeight": 500
    },
    "Card": {
      "colorBgContainer": "#FAFCFF",
      "borderRadiusLG": 18
    },
    "Layout": {
      "colorBgHeader": "#F0F6FE",
      "colorBgBody": "#F5F9FF",
      "colorBgSider": "#F0F6FE"
    },
    "Typography": {
      "fontFamily": "'Satoshi', -apple-system, BlinkMacSystemFont, sans-serif"
    },
    "Tooltip": {
      "colorBgSpotlight": "rgb(26,35,126)",
      "colorTextLightSolid": "#FFFFFF",
      "borderRadius": 6,
      "colorText": "rgb(255,255,255)"
    },
    "Popover": {
      "colorBgElevated": "#1A1A1A",
      "colorText": "#FFFFFF",
      "borderRadius": 8
    },
    "Popconfirm": {
      "colorText": "rgb(255,255,255)",
      "colorTextHeading": "rgb(255,255,255)"
    },
    "Table": {
      "rowSelectedHoverBg": "#EBF4FF",
      "controlItemBgActive": "#F0F6FE",
      "rowSelectedBg": "#F5F9FF",
      "rowHoverBg": "#F0F6FE",
      "columnSorterBg": "#F2F8FE",
      "columnSelectedBg": "#F0F6FE",
      "headerBg": "#F5F9FF"
    }
  }
}

Forest Zen

Screenshot 2025-11-20 at 1.37.10 AM.png

View Forest Zen Configuration

{
  "token": {
    "colorPrimary": "#2E7D32",
    "colorPrimaryHover": "#1B5E20",
    "colorSuccess": "#388E3C",
    "colorWarning": "#F57C00",
    "colorError": "#C62828",
    "colorTextBase": "#1B5E20",
    "colorTextSecondary": "#2E7D32",
    "colorTextTertiary": "#4CAF50",
    "colorBgBase": "#F1F8E9",
    "colorBgContainer": "#f6fdf5",
    "colorBgLayout": "#E8F5E8",
    "colorBorder": "#A5D6A7",
    "borderRadius": 16,
    "borderRadiusLG": 24,
    "fontFamily": "'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif",
    "fontSize": 14,
    "fontWeightStrong": 650,
    "lineHeight": 1.6,
    "motion": true,
    "controlHeight": 36,
    "colorPrimaryBg": "#eef7ec",
    "colorInfo": "#2E7D32",
    "colorPrimaryBgHover": "#deeadb"
  },
  "components": {
    "Button": {
      "borderRadius": 20,
      "controlHeight": 44
    },
    "Card": {
      "borderRadiusLG": 28
    }
  }
}

Lavender Dream

Screenshot 2025-11-20 at 1.36.33 AM.png

View Lavender Dream Theme Configuration

{
  "token": {
    "colorPrimary": "#6A1B9A",
    "colorPrimaryHover": "#4A148C",
    "colorSuccess": "#2E7D32",
    "colorWarning": "#F57C00",
    "colorError": "#C62828",
    "colorInfo": "#6A1B9A",
    "colorTextBase": "#4A148C",
    "colorTextSecondary": "#6A1B9A",
    "colorTextTertiary": "#8E24AA",
    "colorTextQuaternary": "#BA68C8",
    "colorBgBase": "#F3E5F5",
    "colorBgContainer": "#FFFFFF",
    "colorBgElevated": "#FEFEFE",
    "colorBgLayout": "#f8f2f9",
    "colorBgSpotlight": "#e8d5eb",
    "colorBgMask": "rgba(106, 27, 154, 0.25)",
    "colorBorder": "#CE93D8",
    "colorBorderSecondary": "#E1BEE7",
    "borderRadius": 12,
    "borderRadiusLG": 28,
    "borderRadiusSM": 14,
    "borderRadiusXS": 10,
    "fontFamily": "'Satoshi', -apple-system, BlinkMacSystemFont, sans-serif",
    "fontFamilyCode": "'JetBrains Mono', monospace",
    "fontSizeLG": 16,
    "fontSizeSM": 12,
    "fontSizeXL": 20,
    "fontWeightStrong": 600,
    "lineHeight": 1.7,
    "lineHeightLG": 1.8,
    "lineHeightSM": 1.6,
    "motion": true,
    "motionDurationMid": "0.4s",
    "motionDurationSlow": "0.7s",
    "boxShadow": "0 10px 30px rgba(106, 27, 154, 0.12)",
    "boxShadowSecondary": "0 5px 15px rgba(106, 27, 154, 0.08)",
    "controlOutlineWidth": 2,
    "wireframe": false,
    "colorPrimaryBg": "#f8f2f9",
    "colorSuccessBg": "#e6f1e3",
    "colorSuccessBgHover": "#d0e7cd"
  },
  "components": {
    "Button": {
      "colorPrimary": "#6A1B9A",
      "colorPrimaryHover": "#4A148C",
      "borderRadius": 24,
      "fontWeight": 550
    },
    "Card": {
      "colorBgContainer": "#FFFFFF",
      "borderRadiusLG": 32
    },
    "Layout": {
      "colorBgHeader": "#f8f2f9",
      "colorBgBody": "#f8f2f9",
      "colorBgSider": "#E1BEE7"
    },
    "Typography": {
      "fontFamily": "'Satoshi', -apple-system, BlinkMacSystemFont, sans-serif"
    },
    "Tooltip": {
      "colorBgSpotlight": "rgb(106,27,154)"
    },
    "Alert": {
      "colorSuccessBg": "rgb(233,244,231)",
      "colorInfoBg": "rgb(246,239,249)"
    }
  }
}

Cookies and Cream

Screenshot 2025-11-20 at 1.38.15 AM.png

View Cookies and Cream Theme Configuration

{
  "token": {
    "colorPrimary": "#5C4033",
    "colorSuccess": "#7B8B3A",
    "colorWarning": "#D4A574",
    "colorError": "#A0522D",
    "colorInfo": "#6B7C8C",
    "colorText": "#3D2922",
    "colorTextSecondary": "#6B5D54",
    "colorTextTertiary": "#8B7E74",
    "colorTextQuaternary": "#A89F96",
    "colorBgBase": "#FAF8F5",
    "colorBgContainer": "#F5F2ED",
    "colorBgElevated": "#C8A882",
    "colorBgLayout": "#F0EBE5",
    "colorBorder": "#D4CCC4",
    "colorBorderSecondary": "#C8C0B8",
    "colorSplit": "#DDD6CE",
    "colorLink": "#7B6452",
    "colorLinkHover": "#5C4033",
    "colorLinkActive": "#4A332A",
    "colorPrimaryBg": "#F5E6D3",
    "colorPrimaryBgHover": "#EDD9C3",
    "colorPrimaryBorder": "#C8A882",
    "colorPrimaryBorderHover": "#B8997A",
    "colorPrimaryHover": "#4A332A",
    "colorPrimaryActive": "#3D2922",
    "colorPrimaryText": "#5C4033",
    "colorPrimaryTextHover": "#4A332A",
    "colorPrimaryTextActive": "#3D2922",
    "colorSuccessBg": "#E8ECDA",
    "colorSuccessBgHover": "#DFE5C9",
    "colorSuccessBorder": "#B8C49F",
    "colorSuccessBorderHover": "#A7B68B",
    "colorSuccessHover": "#6B7A33",
    "colorSuccessText": "#5C6A26",
    "colorSuccessTextHover": "#4F5B21",
    "colorSuccessTextActive": "#424D1B",
    "colorWarningBg": "#FAF3E8",
    "colorWarningBgHover": "#F7EDD9",
    "colorWarningBorder": "#E5C9A6",
    "colorWarningBorderHover": "#DDB895",
    "colorWarningHover": "#C49660",
    "colorWarningText": "#B58754",
    "colorWarningTextHover": "#A67948",
    "colorWarningTextActive": "#976B3C",
    "colorErrorBg": "#FAE7DD",
    "colorErrorBgHover": "#F7DFD0",
    "colorErrorBorder": "#E0B39B",
    "colorErrorBorderHover": "#D6A188",
    "colorErrorHover": "#8F4926",
    "colorErrorText": "#7E401F",
    "colorErrorTextHover": "#6D3719",
    "colorErrorTextActive": "#5C2E13",
    "colorInfoBg": "#E8EBF0",
    "colorInfoBgHover": "#DFE3E9",
    "colorInfoBorder": "#B8C1CC",
    "colorInfoBorderHover": "#A7B2BF",
    "colorInfoHover": "#5C6B7A",
    "colorInfoText": "#4D5A67",
    "colorInfoTextHover": "#3E4954",
    "colorInfoTextActive": "#2F3841",
    "colorTextPlaceholder": "#C0B7AE",
    "colorTextDisabled": "#D0C8C0",
    "colorTextHeading": "#2C1F1A",
    "colorTextLabel": "#4A3830",
    "colorTextDescription": "#7A6B61",
    "colorTextLightSolid": "#FFFEF9",
    "colorFill": "#F0EBE5",
    "colorFillAlter": "#E8E2DA",
    "colorFillContent": "#EDE7E0",
    "colorFillContentHover": "#E5DED6",
    "colorFillQuaternary": "#F5F2ED",
    "colorFillSecondary": "#F2EDE7",
    "colorFillTertiary": "#EFE9E2",
    "colorHighlight": "#FFE4B5",
    "colorIcon": "#8B7E74",
    "colorIconHover": "#6B5D54",
    "colorWhite": "#FFFEF9",
    "colorBgMask": "rgba(92, 64, 51, 0.45)",
    "colorBgSpotlight": "#6B5D54",
    "colorBgTextActive": "#EDD9C3",
    "colorBgTextHover": "#F5E6D3",
    "controlItemBgActive": "#F5E6D3",
    "controlItemBgActiveDisabled": "#F7F3ED",
    "controlItemBgActiveHover": "#EDD9C3",
    "controlItemBgHover": "#F0EBE5",
    "controlOutline": "rgba(92, 64, 51, 0.15)",
    "fontFamily": "'Avenir Next', 'Avenir', 'Segoe UI', sans-serif",
    "fontFamilyCode": "'Courier New', 'Courier', monospace",
    "fontSize": 14,
    "fontSizeSM": 12,
    "fontSizeLG": 16,
    "fontSizeXL": 20,
    "fontSizeHeading1": 38,
    "fontSizeHeading2": 30,
    "fontSizeHeading3": 24,
    "fontSizeHeading4": 20,
    "fontSizeHeading5": 16,
    "lineHeight": 1.5714285714285714,
    "lineHeightLG": 1.5,
    "lineHeightSM": 1.6666666666666667,
    "lineHeightHeading1": 1.2105263157894737,
    "lineHeightHeading2": 1.2666666666666666,
    "lineHeightHeading3": 1.3333333333333333,
    "lineHeightHeading4": 1.4,
    "lineHeightHeading5": 1.5,
    "borderRadius": 6,
    "borderRadiusLG": 8,
    "borderRadiusSM": 4,
    "borderRadiusXS": 2,
    "borderRadiusOuter": 4,
    "boxShadow": "0 1px 2px 0 rgba(92, 64, 51, 0.03), 0 1px 6px -1px rgba(92, 64, 51, 0.02), 0 2px 4px 0 rgba(92, 64, 51, 0.02)",
    "boxShadowSecondary": "0 6px 16px 0 rgba(92, 64, 51, 0.08), 0 3px 6px -4px rgba(92, 64, 51, 0.12), 0 9px 28px 8px rgba(92, 64, 51, 0.05)",
    "boxShadowTertiary": "0 1px 2px 0 rgba(92, 64, 51, 0.03), 0 1px 6px -1px rgba(92, 64, 51, 0.02), 0 2px 4px 0 rgba(92, 64, 51, 0.02)",
    "margin": 16,
    "marginXS": 8,
    "marginSM": 12,
    "marginMD": 16,
    "marginLG": 24,
    "marginXL": 32,
    "marginXXL": 48,
    "marginXXS": 4,
    "padding": 16,
    "paddingXS": 8,
    "paddingSM": 12,
    "paddingMD": 16,
    "paddingLG": 24,
    "paddingXL": 32,
    "paddingXXS": 4,
    "controlHeight": 32,
    "controlHeightLG": 40,
    "controlHeightSM": 24,
    "controlHeightXS": 16,
    "motionDurationFast": "0.1s",
    "motionDurationMid": "0.2s",
    "motionDurationSlow": "0.3s",
    "zIndexBase": 0,
    "zIndexPopupBase": 1000,
    "wireframe": false
  },
  "algorithm": "default"
}

Dark Themes

Midnight Ocean

Screenshot 2025-11-20 at 1.39.07 AM.png

View Midnight Ocean Theme Configuration

{
  "token": {
    "colorPrimary": "#00D9FF",
    "colorSuccess": "#00FF88",
    "colorWarning": "#FFB800",
    "colorError": "#FF0080",
    "colorInfo": "#00B3FF",
    "colorText": "#E3F2FD",
    "colorTextSecondary": "#94B9DB",
    "colorTextTertiary": "#5C8AAE",
    "colorTextQuaternary": "#3E5F7E",
    "colorBgBase": "#030712",
    "colorBgContainer": "#0A1929",
    "colorBgElevated": "#0F2136",
    "colorBgLayout": "#071020",
    "colorBorder": "#1E3A5F",
    "colorBorderSecondary": "#2B4C7E",
    "colorSplit": "#19334D",
    "colorLink": "#00D9FF",
    "colorLinkHover": "#33E2FF",
    "colorLinkActive": "#66E9FF",
    "colorPrimaryBg": "#0A1929",
    "colorPrimaryBgHover": "#0F2136",
    "colorPrimaryBorder": "#1E3A5F",
    "colorPrimaryBorderHover": "#2B4C7E",
    "colorPrimaryHover": "#00C4E6",
    "colorPrimaryActive": "#00AFCC",
    "colorPrimaryText": "#00D9FF",
    "colorPrimaryTextHover": "#33E2FF",
    "colorPrimaryTextActive": "#66E9FF",
    "colorSuccessBg": "#0A2E1F",
    "colorSuccessBgHover": "#0F3D29",
    "colorSuccessBorder": "#1A5940",
    "colorSuccessBorderHover": "#267356",
    "colorSuccessHover": "#33FF9F",
    "colorSuccessText": "#00FF88",
    "colorSuccessTextHover": "#33FFB5",
    "colorSuccessTextActive": "#66FFCC",
    "colorWarningBg": "#2E2100",
    "colorWarningBgHover": "#3D2B00",
    "colorWarningBorder": "#594200",
    "colorWarningBorderHover": "#735600",
    "colorWarningHover": "#FFC633",
    "colorWarningText": "#FFB800",
    "colorWarningTextHover": "#FFD466",
    "colorWarningTextActive": "#FFE299",
    "colorErrorBg": "#2E0A1A",
    "colorErrorBgHover": "#3D0F24",
    "colorErrorBorder": "#591A35",
    "colorErrorBorderHover": "#732646",
    "colorErrorHover": "#FF3399",
    "colorErrorText": "#FF0080",
    "colorErrorTextHover": "#FF66B3",
    "colorErrorTextActive": "#FF99CC",
    "colorInfoBg": "#0A1F2E",
    "colorInfoBgHover": "#0F293D",
    "colorInfoBorder": "#1A3F59",
    "colorInfoBorderHover": "#265373",
    "colorInfoHover": "#33C4FF",
    "colorInfoText": "#00B3FF",
    "colorInfoTextHover": "#66D4FF",
    "colorInfoTextActive": "#99E5FF",
    "colorTextPlaceholder": "#2B4C6F",
    "colorTextDisabled": "#1E3651",
    "colorTextHeading": "#FFFFFF",
    "colorTextLabel": "#B8D4E8",
    "colorTextDescription": "#7BA7CC",
    "colorTextLightSolid": "#FFFFFF",
    "colorFill": "#0F2136",
    "colorFillAlter": "#0A1929",
    "colorFillContent": "#0D1E2F",
    "colorFillContentHover": "#122438",
    "colorFillQuaternary": "#071020",
    "colorFillSecondary": "#0B1A2A",
    "colorFillTertiary": "#0E1F30",
    "colorHighlight": "rgba(0, 217, 255, 0.2)",
    "colorIcon": "#5C8AAE",
    "colorIconHover": "#7BA7CC",
    "colorWhite": "#FFFFFF",
    "colorBgMask": "rgba(0, 217, 255, 0.1)",
    "colorBgSpotlight": "#0D1B2A",
    "colorBgTextActive": "#0F2136",
    "colorBgTextHover": "#0A1929",
    "controlItemBgActive": "#1A3350",
    "controlItemBgActiveDisabled": "#0F2136",
    "controlItemBgActiveHover": "#1F3D5F",
    "controlItemBgHover": "#152940",
    "controlOutline": "rgba(0, 217, 255, 0.2)",
    "fontFamily": "'SF Mono', 'Monaco', 'Cascadia Code', 'Consolas', monospace",
    "fontFamilyCode": "'Fira Code', 'SF Mono', 'Monaco', 'Consolas', monospace",
    "fontSize": 14,
    "fontSizeSM": 12,
    "fontSizeLG": 16,
    "fontSizeXL": 20,
    "fontSizeHeading1": 38,
    "fontSizeHeading2": 30,
    "fontSizeHeading3": 24,
    "fontSizeHeading4": 20,
    "fontSizeHeading5": 16,
    "lineHeight": 1.5714285714285714,
    "lineHeightLG": 1.5,
    "lineHeightSM": 1.6666666666666667,
    "lineHeightHeading1": 1.2105263157894737,
    "lineHeightHeading2": 1.2666666666666666,
    "lineHeightHeading3": 1.3333333333333333,
    "lineHeightHeading4": 1.4,
    "lineHeightHeading5": 1.5,
    "borderRadius": 4,
    "borderRadiusLG": 6,
    "borderRadiusSM": 2,
    "borderRadiusXS": 1,
    "borderRadiusOuter": 2,
    "boxShadow": "0 0 8px 0 rgba(0, 217, 255, 0.1), 0 2px 4px 0 rgba(0, 0, 0, 0.5)",
    "boxShadowSecondary": "0 0 16px 0 rgba(0, 217, 255, 0.15), 0 4px 8px 0 rgba(0, 0, 0, 0.6)",
    "boxShadowTertiary": "0 0 24px 0 rgba(0, 217, 255, 0.2), 0 6px 12px 0 rgba(0, 0, 0, 0.7)",
    "margin": 16,
    "marginXS": 8,
    "marginSM": 12,
    "marginMD": 16,
    "marginLG": 24,
    "marginXL": 32,
    "marginXXL": 48,
    "marginXXS": 4,
    "padding": 16,
    "paddingXS": 8,
    "paddingSM": 12,
    "paddingMD": 16,
    "paddingLG": 24,
    "paddingXL": 32,
    "paddingXXS": 4,
    "controlHeight": 32,
    "controlHeightLG": 40,
    "controlHeightSM": 24,
    "controlHeightXS": 16,
    "motionDurationFast": "0.1s",
    "motionDurationMid": "0.2s",
    "motionDurationSlow": "0.3s",
    "zIndexBase": 0,
    "zIndexPopupBase": 1000,
    "wireframe": false
  },
  "algorithm": "dark"
}

Was this article helpful?

What's Next

Parametrizing Queries Using Jinja

Table of contents

Light Themes
Dark Themes