Contact Us

If you still have questions or prefer to get help directly from an agent, please submit a request.
We’ll get back to you as soon as possible.

Please fill out the contact form below and we will reply as soon as possible.

  • Contact Us
  • Home
  • Figma Design – Figma Learn
  • Create designs
  • Color, gradients, and images

View and adjust colors in a mixed selection

Written by Figma Man

Updated at June 19th, 2025

Contact Us

If you still have questions or prefer to get help directly from an agent, please submit a request.
We’ll get back to you as soon as possible.

Please fill out the contact form below and we will reply as soon as possible.

  • Administration – Figma Learn
    Manage files and projects Manage a team Manage your account Manage a Figma organization Manage Enterprise plan settings and permissions Billing Manage Figma in a school
  • Figma Design – Figma Learn
    Create prototypes Import and export Create designs Tour the interface Dev Mode Work together in files Build design systems Figma Draw
  • Get started – Figma Learn
    Set up your account Layers 101
  • FigJam – Figma Learn
    Import and export Run meetings Work on boards Tour the interface
  • Community – Figma Learn
    Explore the Community Creator tools and resources
  • Help – Figma Learn
    Troubleshoot Common questions Work with support
  • Work across Figma – Figma Learn
    Figma AI Work across Figma
  • Courses, tutorials, projects – Figma Learn
    Courses Projects
  • Figma Slides – Figma Learn
    Create and edit slides Present slide decks Tour the interface Import and export
  • Figma Buzz – Figma Learn
    Templates in Figma Buzz Create and edit assets in Figma Buzz Overview
  • Figma Make – Figma Learn
    Tour the interface Work with Figma Make
  • Figma Sites – Figma Learn
    Design a site Create webpages and breakpoints Make your site interactive Preview and publish a site Tour the interface
+ More

Table of Contents

View Selection Colors

Before you Start

Who can use this feature

Users on any plan can use paints in their designs

Users with Edit access can view and update paint properties in a mixed selection

The Selection Colors feature allows you to view and adjust any colors applied to objects in a selection.

  • Select objects or layers and view or adjust individual colors in the selection.
  • Select a parent object, like a Frame, Group, or Component. View and adjust the color properties of any child objects.

Note: You can still adjust the properties of the parent object in the Properties Panel. This allows you to update Fill and Stroke properties of the Frame, without affecting child objects.

Selection colors include:

✅ Fills
✅ Strokes
✅ Solid colors
✅ Gradients (linear, radial, angular, diamond)
✅ Boolean groups*

Selection colors do not include:

🚫 Images
🚫 Hidden fills
🚫 Masks

Note: Only colors applied to the combined Boolean group will be included in the Selection Colors. Colors applied to any child objects won't show up in the Selection Colors section.

View Selection Colors

View colors in your selection in the Selection Colors section of the Properties Panel.

Figma groups colors into Color Styles and Paints - any Fills or Strokes that you haven't saved as Styles.

Paints or Styles only appear once in the Selection colors section. By default, we show the three most frequently used Paints and Styles.

The selection colors section of the properties panel, with other menus you can access, including the color and style pickers.

  1. Click on a Paint to open the Color picker. This allows you to adjust the paint type, color, hue, opacity, and blend mode. Or, pick another color from your Document colors.
  2. Click on a style or a variable to open the Style modal. Variables are displayed inside a grey pill. The Style modal allows you to select from a list of styles or variables created in the file, or ones from libraries that have been added to the file.
  3. Click the detach icon
    to detach the style or variable
  4. Click the target icon
    to select all layers that use that color
  5. Click the Style icon
    to open the Style picker. This allows you to apply a Style to the selected color, or create a new Style.
  6. Use the percentage field to adjust the opacity of a paint
  7. Click the See all colors or See all styles link to view the rest of the colors in the selection

Want to swap two colors around? We won't update the Selection colors section until you close the Color Picker.

  1. Click on the first color you want to swap.
  2. Select the second color in the Document colors section of the Color picker.
  3. Without closing the Color picker, click on the second color in the Selection Colors section.
  4. Select the first color in the Document colors section.
  5. Close the Color picker.

Was this article helpful?

Yes
No
Give feedback about this article

Related Articles

  • Crop an image
  • Paints in Figma
  • Apply paints with the color picker
  • Paste images in the canvas
  • Add fills to text and shape layers
  • Blog
  • Best practices
  • QR code generator
  • Color wheel
  • Colors
  • Color picker
  • Color palettes
  • Color palette generator
  • Color contrast checker
  • Font Library
  • Templates
  • Developers
  • Integrations
  • Affiliate program
  • Resource library
  • Reports and insights
  • Support
  • Status
  • Legal and privacy
  • Modern slavery statement
  • Climate disclosure statement
  • COMPARE
  • Sketch
  • Adobe XD
  • Framer
  • Miro
  • COMPANY
  • Events
  • Customers
  • Careers
  • Newsroom
Expand