Design ToolsFounded 2012
Figma Brand Colors
Figma's multi-color gradient identity reflects its mission: enabling all kinds of creativity for all kinds of people.
figma.com ↗Brand Palette
#F24E1E
#A259FF
#1ABCFE
#0ACF83
#FF7262
Component 1
Component 2
Component 3
Component 4
Prototype
Color Values
Figma Red
Component 1
- HEX
- #F24E1E
- RGB
- rgb(242, 78, 30)
- HSL
- hsl(14, 89%, 53%)
Figma Purple
Component 2
- HEX
- #A259FF
- RGB
- rgb(162, 89, 255)
- HSL
- hsl(266, 100%, 67%)
Figma Blue
Component 3
- HEX
- #1ABCFE
- RGB
- rgb(26, 188, 254)
- HSL
- hsl(197, 99%, 55%)
Figma Green
Component 4
- HEX
- #0ACF83
- RGB
- rgb(10, 207, 131)
- HSL
- hsl(157, 91%, 43%)
Figma Orange
Prototype
- HEX
- #FF7262
- RGB
- rgb(255, 114, 98)
- HSL
- hsl(6, 100%, 69%)
Accessibility Analysis
| Color | on White | on Black |
|---|---|---|
Figma Red | 3.57:1AA Large | 5.88:1AA |
Figma Purple | 3.88:1AA Large | 5.41:1AA |
Figma Blue | 2.17:1Fail | 9.67:1AAA |
Figma Green | 2.05:1Fail | 10.27:1AAA |
Figma Orange | 2.68:1Fail | 7.84:1AAA |
WCAG AA requires 4.5:1 for normal text. AA Large requires 3:1 for large text (18pt+) and UI components. AAA requires 7:1.
CSS Implementation
:root {
--figma-figma-red: #F24E1E;
--figma-figma-purple: #A259FF;
--figma-figma-blue: #1ABCFE;
--figma-figma-green: #0ACF83;
--figma-figma-orange: #FF7262;
}
/* Usage example */
.btn-primary {
background-color: var(--figma-figma-red);
color: #ffffff;
}Similar Color Alternatives
Named colors visually closest to Figma's primary color — useful for approximations or accessible substitutes.
Design Notes
Color Psychology
Figma uses a mid-tone palette anchored by Figma Red (#F24E1E). Design tool brands embrace creativity through vibrant, often gradient-rich palettes that demonstrate the expressive power of their products.
Design Principles
- Multi-color system allows segmentation across products and sub-brands
- Consistent color usage across touchpoints builds strong brand recognition
- Color palette reflects the brand's industry positioning and audience expectations
Explore Individual Colors
Tags
designcreativemulticolorsaas
More Design Tools Brand Colors
Frequently Asked Questions
What are Figma's official brand colors?
Figma's official brand colors are: Figma Red (#F24E1E), Figma Purple (#A259FF), Figma Blue (#1ABCFE), Figma Green (#0ACF83), Figma Orange (#FF7262).
What is Figma's primary color hex code?
Figma's primary brand color is Figma Red with hex code #F24E1E.
What are the RGB values for Figma's primary color?
Figma Red (#F24E1E) has RGB values of rgb(242, 78, 30).
What is the HSL value of Figma's primary color?
Figma Red has an HSL value of hsl(14, 89%, 53%).
Is Figma's primary color WCAG accessible?
Figma Red (#F24E1E) has a contrast ratio of 3.57:1 on white, which passes WCAG AA Large.
What industry is Figma in?
Figma operates in the Design Tools industry, founded in 2012.