How to set up colors in theme settings

How to set up colors in theme settings

Set up colors in theme settings to control the main color palette used across your board. Theme colors help keep your UI components, templates, and canvas designs visually consistent.

Before you start

  1. Make sure you have permission to edit the board.
  2. Theme colors are applied in Hi-fi design mode. These are not applied in Lo-fi design mode.

Access the board theme color settings

  1. Open the board where you want to update the theme colors.
  2. Open Theme from the bottom toolbar of the board.

  3. Click Edit to enter theme editing mode.


  4. Select Colors tab. The color settings will open, where you can review and update the color palette used in the board theme.

Set up theme colors

In the Colors section, you can adjust different color groups used across your board. Available color groups include:
  1. Main colors: Used for primary brand colors and key UI elements.
  2. Semantic colors: Used for common UI states, such as success, warning, error, or information message.
  3. Gray color set: Used for text and backgrounds.


You can choose and set up color palettes using these options:

  1. Pick from palette library: Choose a ready-made palette from Visily’s palette library.


  2. Generate colors from text: Describe the color scheme, mood, or visual style you want.


  3. Extract colors from image: Upload an image so Visily can analyze its colors and suggest a palette.


  4. Extract colors from webpage: Enter a webpage URL so Visily can generate colors based on the site’s design.


  5. Adjust manually: Fine-tune the current palette by clicking each color and editing it individually.


After you apply the changes, the updated colors are applied to the board theme and reflected in the designs on the board.

Note

  1. Preview your changes before clicking Apply, as applying theme colors updates the designs on the board immediately.
  2. If you want to reuse the same color setup across multiple boards, save the board theme as a Workspace Theme.
  3. Generating colors from text uses AI credits. Each generation costs 5 credits.
Need more help?
If this does not solve your issue, contact support and include a screenshot if possible.

    • Related Articles

    • How to set up text styles in theme settings

      Set up text styles in theme settings to keep typography consistent across your board. Text styles define the fonts and text presets used in your designs. Before you start Make sure you have permission to edit the board. Text styles in theme settings ...

    • How to set up a board theme

      Set up a board theme to keep your design style consistent across the board. A board theme includes key design elements such as colors, text styles, shadows, and corner radius. Before you start Make sure you have permission to edit the board. Themes ...

    • How to set up shadows in theme settings

      Set up shadows in theme settings to control the depth and elevation style used across your board. Shadows help create visual hierarchy and make elements feel more structured and layered. Before you start Make sure you have permission to edit the ...

    • How to set up border radius in theme settings

      Set up border radius in theme settings to control how rounded the corners look across your board. Border radius helps define whether your design feels sharp, slightly rounded, soft, or more circular. Before you start Make sure you have permission to ...

    • How to save a board theme as a Workspace Theme

      Save a board theme as a Workspace Theme when you want to reuse the same colors, text styles, shadows, and corner radius across multiple boards in your workspace. Before you start Make sure you have permission to edit the board and manage workspace ...