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

Add fills to text and shape layers

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

Add fills Adjust fills

Before you start

Who can use this feature

Supported on any team or plan.

Anyone with Can edit access to a file can add or adjust fills.

Paints are colors, gradients, or images. Fills are just one of the ways you can use paints in Figma.

Apply paints to text layers, or any vector object, this includes shapes, vector networks, and boolean groups. You can add, adjust, and remove fills in the Fill section of the right sidebar.

Add fills

Add fills to text layers, frames, and any vector objects. You can even add more than one fill to a single layer. This allows you to layer gradients over images, or apply blend modes to create unique effects.

We treat each fill as a unique layer, so you can adjust the properties individually. You can even toggle the visibility of each fill independently.

  1. Select the layer(s) you want to add a fill to.
  2. In the Fill section of the right sidebar, click the icon to add a fill to the layer.
  3. Figma will add a default Solid fill with a hex value of C4C4C4. Click on the fill swatch to open the color picker: ui3-fill (1).png
  4. From the color picker you can select a paint type, choose a color, and apply blend modes. Learn more about using the color picker.

Tip: Want to reuse fills across your designs? Create Color Styles from fills or strokes and apply them to objects in the canvas.

Adjust fills

Add, remove or adjust fill properties at any time. You can adjust fill in the Design panel of the right sidebar.

Selection colors allows you to view and adjust the paints applied to a selection, individually. This also allows you to change the fills of child objects, when you have the parent selected.

If selected layers share the same fill properties, you can adjust them in the Fill section of the Properties Panel.

If selected layers have different fill properties, you can adjust each fill individually in the Selection colors section of the Properties Panel.

  • Hover over the left edge of the fill to reveal the drag handles . Click and drag on the handles to reorder fills.
  • Click the icon to toggle visibility off and the icon to toggle visibility on. Learn more about toggling visibility.
  • Click the icon to remove a fill from your selection.

ui3-fill-stroke-selection.png

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
  • Use blend modes to create unique effects
  • 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