In Figma, you can use solid colors or gradient colors for your shapes and designs.
- Go to the Design Panel and click on the Fill icon;
- Use the Hue Spectrum, Hue Slider, and Opacity Slider to adjust colors.
### Color Value Systems you will see are

- You can also use the **Eyedropper** Tool to sample colors from your page or frame, or access saved colors from other projects via the dropdown menu;
- When you select the **Gradient Fill** option in the Fill menu, a gradient bar will pop up;
- You can adjust the **gradient bar** by changing the position of color stops, adding new stops, rotating the gradient, flipping it, or adjusting individual stop colors and their opacity as needed.

Which of the following is NOT a color value system available in Figma?

What happens when you set one stop in a gradient to 0% opacity?

Learn everything from the basics of designing user interfaces to advanced prototyping and collaboration techniques. Explore how to create wireframes, design visually stunning layouts, and work effectively with development teams using Figma's powerful features. Perfect for beginners and professionals, this learning journey combines practical projects, expert tips, and real-world applications to help you succeed in the competitive world of design.

Learn what Figma is, what its role is in UI/UX design, and how to navigate its interface and tools. Explore the FigJam board for brainstorming and collaboration, along with pages and frames in Figma, which form the foundation for organizing and structuring your designs effectively.

Discover how layers in Figma keep your design organized, explore how grouped shapes help you create stunning visuals, and learn to style text beautifully using typography tools.

Learn to place photos and videos, use masks, and apply blend modes for dynamic designs. Master colors, gradients, buttons, auto layouts, components, and styles. Unlock the power of plugins and widgets to enhance your creativity and streamline your workflow.

Explore columns, grids, plugins, and the parent-child component structure to streamline your design process.

Develop low-fidelity wireframes, create interactive prototypes, animate designs, and present work effectively to clients.

UI/UX Design with Figma

Color and Gradient Fill in Figma: Mastering Palettes for UI/UX Design

Color Value Systems you will see are

1. Which of the following is NOT a color value system available in Figma?

2. What happens when you set one stop in a gradient to 0% opacity?