Bloom is now Rainbrand

(Brand guidelines) // Design tools

Figma brand
guidelines

Figma’s logo, colors, fonts, voice, and dos and don’ts, from the Brand Skill Rainbrand built from figma.com.

Download the Brand Skill

About Figma

Figma is a collaborative creative platform where teams bring design, code, and AI together to explore ideas, build products, and move work forward. Its voice is clear, optimistic, and grounded in making creative work together.

Use Figma’s own wordmark, standalone symbol, and approved logo variations as the brand marks. Choose the mark that fits the placement, and keep its artwork intact: don’t alter its shapes, proportions, or constituent parts.

Figma colors

  • Red

    Logo color

    HEX
    RGB

  • Orange

    Logo color

    HEX
    RGB

  • Purple

    Logo color

    HEX
    RGB

  • Blue

    Logo color

    HEX
    RGB

  • Green

    Logo color

    HEX
    RGB

  • Black

    Wordmark and text

    HEX
    RGB

  • White

    Backgrounds

    HEX
    RGB

Figma fonts

  • Figma Sans

    Headings · 400, Body · 330

Font names only. The Brand Skill download doesn’t include font files.

Figma’s voice

Write with confident warmth. Make collaboration, forward motion, and creative possibility feel tangible, while keeping product explanations direct and easy to follow. Prefer concise sentences and active verbs; pair an ambitious idea with a practical sense of what people can do together.

  • “Made for the big picture. Perfect down to every pixel”
  • “Your ideas get real in Figma Make”
  • “Ideas no longer have to wait their turn”
  • “Move fast in the right direction on an AI-native canvas”
  • “Build on ideas together in real time”

Dos and don’ts

Do

  • Keep the Figma identity crisp and recognizable. Choose a fitting variation of Figma’s own marks without changing the artwork.
  • Use the logo colors, black and white, and Figma Sans for a coherent identity.
  • Write in a collaborative, optimistic voice that connects creative possibility to useful action.
  • Make product copy clear and specific while keeping its sense of momentum.

Don’t

  • Don’t alter Figma’s marks or incorporate their parts into other artwork.
  • Don’t redraw or approximate the Figma symbol; use the original artwork.
  • Don’t let energetic language obscure what a product or feature does.
  • Don’t make collaboration sound exclusive to designers; Figma’s copy welcomes teams and contributors across roles.

Figma imagery

228 images from figma.com, in 3 files of the Brand Skill. Each file starts with its guidance, then shows the images it refers to.

Marketing and template gallery imagery

72 images

Figma’s marketing pages show examples across design, brainstorming, and presentation workflows. Treat them as a guide to how Figma presents its creative tools and community resources, not as a universal required layout or a fixed visual formula.

  • A minimalist graphic design features a soft, grainy gold and cream gradient background that evokes the stippled texture of sand.
  • A digital design interface screenshot shows a large, hand-painted peach-colored 'R' being edited over a dark floral background with red tulips.
  • A close-up graphic illustration depicts a light blue, paper-plane-like shape being edited against a solid dark blue circular background.
  • A vibrant digital graphic features a thick, serpentine turquoise wave winding across a bubblegum pink background.
  • A digital UI layout features a grainy, dreamlike macro photograph of a curved plant stem and leaf glowing with purple and yellow iridescent halos.
  • A floating software interface window titled "Bitmap mosaic" sits over an abstract background of bright yellow flower-shaped pixels against deep green.
  • A grayscale, close-up portrait of a man with dark, wavy hair and a full beard, looking directly at the camera with a neutral, calm expression.
  • A close-up digital screenshot of a user interface design system kit on a slate-blue background.
  • A close-up lifestyle shot features a silver laptop resting on a soft, moss-green velvet cushion.
  • A vibrant red graphic poster promoting brunch, centered on a deep maroon background surrounded by other lifestyle photos.
  • A smartphone rests diagonally on a textured, rust-colored surface, showcasing a social event app under bright, direct sunlight.
  • A graphic design layout featuring the words 'Brand Vision' in a large, pale yellow italicized serif font set against a chocolate brown background with a…
  • A minimalist blue graphic illustrates a website layout wireframe against a vibrant indigo background.
  • A vibrant, airbrushed digital illustration of a stylized butterfly composed of glowing orange, red, and yellow gradients.
  • A high-angle product shot shows a tablet resting on a thick navy blue linen book, which is stacked on a beige book atop a textured stone surface.
  • A vibrant graphic layout features a central square photo of a young girl with red hair and a messy bun, wearing a plaid shirt against a blue backdrop.
  • A 4x4 grid of sixteen minimalist UI icons rendered in a two-tone palette of deep magenta and soft lavender on a light pink background.
  • A vibrant, flat-style geometric illustration featuring a thick, winding orange path with a thin black arrow following its curve on a lilac background.
  • A flat, 2D graphic composition of colorful geometric icons on a pale off-white background.
  • A vibrant collage of flat, geometric vector illustrations in a high-contrast palette of neon pink, orange, blue, and forest green.
  • A medium horizontal shot captures three diverse young adults smiling outdoors against a golden, sun-drenched hill background.
  • A bay horse gallops through a sun-drenched wildflower meadow at sunset, overlaid with a technical flowchart in thin white lines.
  • A time-lapse composite photograph shows a young girl with a ponytail in a purple hoodie and black leggings running along a waterfront path, with her figure…
  • A close-up shot of a hand holding a blue marker against a white dry-erase board, overlaid with a digital white-lined flowchart diagram.
  • A split-screen graphic shows a red-haired woman with green eyes in two different settings, connected by a flow chart diagram.
  • A vibrant geometric grid illustration features a large black 'U' shape on a neon green block at its center.
  • A grainy, vintage-style photo features two men in business suits on a grassy lawn, communicating through a long, looping yellow tube.
  • A surreal digital graphic features a white goat with its tongue out against a hazy gray background, with its hindquarters melting into iridescent,…
  • A wide cinematic photograph features seven people in pale yellow jumpsuits operating retro analog technology amidst a floor covered in tangled yellow hoses.
  • A vibrant collage of geometric and abstract shapes floats against a solid black background.
  • A surreal photograph features a white horse covered in bright magenta polka dots standing alone in a vast desert of white sand dunes under a pale blue sky.
  • A grainy, sepia-toned landscape photo of a desert with saguaro and cholla cacti is overlaid with a white workflow diagram.
  • A flowchart graphic is superimposed on an abstract, glossy black sculptural shape against a gradient blue and green background.
  • A vibrant orange background serves as a canvas for a series of whimsical, hand-drawn cream-colored faces and symbols outlined in thick black ink.
  • A digital whiteboard screenshot of a business roadmap planning template features organized sections labeled '2 REFLECTION' and '3 STRATEGY' against a light…
  • A screenshot of a digital whiteboard tool features a project retrospective layout on a dotted canvas with a pink background border.
  • A screenshot of a digital collaboration whiteboard shows a 'Prioritization matrix' against a bright green background.
  • A vibrant screenshot of a digital whiteboarding tool used for a team retrospective, set against a bright pink background.
  • A screenshot of a digital prioritization matrix with four quadrants labeled DO, DECIDE, DELETE, and DELEGATE against a white dotted background.
  • A flat-style graphic shows a stack of white browser windows centered on a vibrant purple background.
  • A flat graphic illustration of a stylized project timeline or Gantt chart set against a coral-red background with a fine grid of dots.
  • A digital illustration of a collaborative workspace featuring a stack of yellow, blue, and pink square notes on a white dot-grid background.
  • A vibrant yellow flowchart illustration features a diamond-shaped starting point that splits into two purple rectangles, which then branch into four teal…
  • A flat graphic illustration featuring four square sticky notes arranged in a grid inside a pink scalloped cloud shape.
  • A vibrant green background with a dark green dot grid pattern features three vertical white rectangles representing simplified mobile app interfaces.
  • A vibrant graphic illustration featuring a cluster of rounded rectangular blocks in various pastel and bold colors, including purple, coral, green, and blue.
  • A flat digital graphic features a four-column table design set against a lavender background with a dark blue dot-grid pattern.
  • A flat graphic illustration of a quadrant chart set against a mint green background with a dark green dot grid.
  • A flat graphic illustration represents a Q&A format using two distinct columns on a dotted purple background.
  • A minimalist graphic illustration features a large white lemon silhouette centered on a square with a pink-to-purple vertical gradient.
  • A flat-style graphic shows a three-by-three grid of colored squares centered on a lavender background with a subtle purple dot-grid pattern.
  • A flat-style graphic illustration depicts a wooden clipboard with a light blue metal clamp and a yellow pencil hovering over it.
  • A flat graphic illustration features four vertical columns arranged side-by-side against a salmon-pink background patterned with tiny, evenly spaced dots.
  • A minimalist flat graphic features a large central window pane divided into four rectangles of lavender, pale blue, light purple, and cornflower blue.
  • A minimalist flat graphic features a central three-set Venn diagram composed of blue, pink, and yellow circles with thin black outlines.
  • A vibrant, minimalist graphic featuring six different chart and data visualization icons contained within a white rounded square.
  • A minimalist vector illustration of a tiered organizational chart is centered against a muted red background featuring a subtle dot grid pattern.
  • A flat geometric graphic featuring a dark forest green background overlaid with a bright purple grid pattern.
  • A minimalist graphic slide with a clean, light beige background framed by a thick black border.
  • This graphic is a clean, white presentation slide template featuring bold, black sans-serif typography.
  • A vibrant yellow graphic card features the word "{Logo}" centered in a bold black sans-serif font, flanked by large curly brackets.
  • A vertical graphic presentation slide features a large lavender card overlaying a blurry background of green leaves and dappled sunlight.
  • A minimalist black graphic with rounded corners features the bold, white text "Product Roadmap" stacked in the bottom-left corner.
  • A minimalist graphic slide for a 'Research Readout' presentation, featuring large black sans-serif title text on a pale cream background.
  • A landscape-oriented graphic with a taupe background features the bold, light mint green text "MARKETING STRATEGY" in a serif font across the top left.
  • A minimalist, cream-colored title slide graphic features clean black serif and sans-serif typography.
  • A vibrant graphic illustration featuring a grid of six rectangular panels framed by thick orange borders and yellow circular corner points.
  • A flat minimalist graphic depicts a rectangular card with rounded corners floating over a stylized map background of lavender paths and dark green blocks.
  • A vibrant, abstract graphic featuring layered, rounded rectangles and organic blob shapes in a high-contrast palette.
  • A digital graphic shows a blue cursor path connecting a mobile interface for 'Pistil Farms' to a 'Buttercup' e-commerce app.
  • A vibrant digital graphic features four translucent, colorful rectangles—peach, yellow, cyan, and magenta—floating against a deep blue background.
  • A bold green digit 5 takes center stage on a light sage green background, enclosed in a blue bounding box with white corner handles.

Editorial and campaign imagery

45 images

Figma’s editorial imagery spans product-in-use scenes, portraits, and expressive illustration. Artwork can be colorful, dimensional, and concept-led; choose imagery that supports the story rather than treating any single illustration style as a fixed template.

  • A sage green digital graphic centers the text "Figma Customers" in a clean, black sans-serif font.
  • A vibrant green graphic features the large, black centered text "Figma Pricing" surrounded by eclectic, geometric design elements.
  • This graphic screenshot illustrates a collaborative software design platform featuring a 'Pickup app' interface surrounded by interactive UI elements and…
  • A clean screenshot of a design system UI showcasing component libraries.
  • A software interface mockup displays an AI-assisted web design tool for an outdoor brand named Offtrail.
  • A vibrant collage of flat graphic icons and geometric shapes bursts across a black background, centered around tech and creation themes.
  • A vibrant 2D graphic illustration featuring a repeating grid of orange, stepped rooms interconnected by thin blue paths against a solid purple background.
  • This UI design graphic showcases three vertical mobile app screens titled "Onboarding animation," "Map clustering," and "Curated browsing" against a dark…
  • A digital UI screenshot features a dark-themed weather app for Los Angeles showing light rain, overlaid with several bright blue AI dialogue bubbles.
  • A vibrant 2D geometric graphic set against a deep maroon background features a large, orange archway outlined in lime green on the left.
  • A digital UI graphic displays a smartphone app interface for 'MODULAR LIVING' by Camille Vosk against a clean light blue background.
  • A surreal digital illustration features dolphins leaping from a purple lake under a vibrant yellow moon that doubles as a clock with blue petal-like hands.
  • A vibrant, grainy abstract illustration features soft-edged geometric shapes and organic blobs floating against a flat bright blue background.
  • A vibrant, hand-painted digital illustration features a gardener in a straw hat and red shirt atop a yellow ladder, trimming a large, stylized evergreen tree.
  • A man with short grey hair and a peach button-down shirt stands behind a counter filled with stacks of magazines and art books.
  • A woman with long dark hair and a neutral expression holds a red magazine titled 'Gothic & Lolita' against a backdrop of organized bookshelves.
  • A person with a short, dark pixie cut and silver earrings stands behind a metal counter, holding open a small photo album.
  • A whimsical 2D illustration features a large mint-green gear or pulley at its center, entwined with several undulating brown cables or ropes that weave…
  • Two men sit in a modern stage setup, engaged in a conversation while seated in cream-colored lounge chairs.
  • A man in a dark navy t-shirt stands behind a steel desk, holding up a long, continuous perforated dot-matrix printout.
  • A digital graphic showcasing aviation software interfaces and a flight journey infographic.
  • A whimsical, flat 2D illustration depicts a toy factory castle set against a dramatic backdrop of snow-capped mountains and a black sky.
  • An abstract, colorful 2D graphic features a large, angled wheel with red, green, yellow, and brown segments on a clean white background.
  • An abstract 2D graphic features a leaning blue tower composed of vertical segments, intersected by a horizontal red and blue oval plane.
  • This grain-textured illustration features a grey cylindrical container filled with glowing green orbs against a vibrant blue background.
  • A surreal digital illustration featuring a deconstructed business figure rendered in a flat, abstract style across a gray field.
  • A flat, geometric illustration depicts a large white envelope centered between two diagonal rows of stylized laptops on a purple background.
  • A vibrant surrealist illustration depicts a yellow and blue tiered interior with a central lighthouse tower capped by a giant eyeball.
  • A surreal digital illustration features an orange, segmented centipede-like creature crawling within a deep, blue-and-yellow geometric pit.
  • A surreal digital illustration features a glowing centipede floating inside a radiant, translucent castle silhouette projected from a central tower.
  • Two teenage boys sit cross-legged on the carpet of a long, dimly lit indoor hallway, each working on an open laptop.
  • A vibrant, multi-colored logo formed by five geometric shapes that combine to resemble the letter F.
  • A square podcast cover art with a dark charcoal background features bold white and yellow graphic text.
  • Two smiling men sit side-by-side on a brown leather couch in a bright, modern room.
  • A vertical user interface wireframe is hand-drawn in blue and orange marker on a white whiteboard.
  • A close-up photo shows a white board covered in handwritten brainstorm notes and UI wireframes in blue and orange ink.
  • A group of twenty diverse young professionals poses for a playful team photo in a modern industrial office with large windows.
  • A vibrant collage of flat, abstract geometric and organic shapes against a mustard yellow background.
  • A flat graphic illustration of a stylized Figma logo, comprised of five colorful geometric shapes, centered inside a simplified web browser window.
  • A vibrant collage of geometric shapes and typography features a large 'Aa' set against a grid of neon green and gray squares.
  • A close-up software screenshot featuring a purple 'Connected' pill button and a dashed purple border on a pale yellow background.
  • A dark-themed user interface kit featuring dark brown panels with rounded corners set against a light sage green background.
  • A grainy, textured abstract illustration features purple, orange, and green shapes in a dense, interlocking pattern.
  • A pale lime green digital interface card displays reading progress for the book 'Split' by Natasha Ruiz, noting 'Page 60/392'.
  • A vibrant 2D illustration on a green background features six distinct 3D rectangular blocks spiraling toward a central yellow globe icon.

Product interface imagery

111 images

Figma’s own product imagery makes the creative canvas visible: show working files, design controls, prototypes, and workflows that connect design and code. Collaborative boards can show cursors, comments, notes, reactions, and diagramming in use. Keep interface imagery identifiable as a view of Figma’s product, rather than presenting a customer’s finished design as Figma’s own identity.

  • A grainy, abstract texture features a duotone palette of dusty lavender and pale peach.
  • A vibrant, minimalist illustration features a stylized, textured red apple silhouette positioned within a digital selection box with blue lines and white…
  • A white conversational UI prompt overlays a collage of app design screens against a bright blue background.
  • A digital graphic showcasing a software application interface titled 'Compass V2' in a blue header.
  • A digital UI design system sheet displays various style tokens against a dark backdrop.
  • A close-up UI screenshot of an animation tool's interface, featuring a 'Custom Bezier' curve editor with a black S-curve and blue adjustment handles.
  • A software interface for changing image lighting is displayed as a white modal window against a soft lavender background.
  • A digital interface mockup of a 'Map maker' tool is centered over a pale teal and green city map with dark green location pins.
  • A digital graphic featuring a white software interface window titled 'Gradient map' floating over a grainy, blurred abstract background of neon pink, orange,…
  • A digital screenshot showcases an illustration of a black-and-white sketched dog wearing a polka-dot sweater against a light blue background.
  • A split-screen digital mockup showcases a mobile app design system alongside a live event interface.
  • A digital product screenshot features a white 'Articles ‹ Fill' interface overlaying a grid of colorful blog-style cards.
  • A software interface graphic demonstrates a responsive layout feature against a bright green background.
  • A digital interface screenshot displays a grid of four photos, including close-ups of green foliage, a bright pink flower, a snowy mountain peak, and…
  • A playful digital graphic features the word "FigJam" in bold black sans-serif font, accompanied by an asterisk in a small purple square.
  • A digital whiteboard interface for a design brainstorming session titled 'Onboarding / New user experiences'.
  • A digital UI graphic depicts a collaborative workspace on a light gray grid background with various fire emojis floating near an orange card.
  • A clean digital interface shows a collaborative workspace with four diverse circular profile headshots floating in a white top bar.
  • A clean, digital 'QUARTERLY BRAINSTORM' whiteboard template features a dotted background with three distinct columns for 'Questions,' 'Solo Brainstorming,'…
  • A digital graphic titled "POSTER LAYOUT" in handwritten font, presenting a series of colorful, hand-drawn design thumbnails on a light gray grid background.
  • A business strategy infographic titled NEW VALUE CURVE features a central grey circle surrounded by four colored boxes on a light grey dotted grid background.
  • A colorful digital whiteboard template on a light dot-grid background outlines a four-step creative process using pastel blocks and handwritten text.
  • A digital whiteboard template titled "TEAM RETRO" in hand-drawn lettering atop a light gray dot grid background.
  • A digital collaboration workspace template features large handwritten headers like "VISION BRAINSTORM" and "SOLUTIONS & PROJECTS BRAINSTORM" set against a…
  • A flat graphic illustration depicting a digital collaboration environment with multiple colorful cursor arrows scattered across the space.
  • A digital timer widget with a clean white interface features a bold black 7-segment display reading "04:55".
  • A screenshot of Asana task cards with a hand-drawn star and the handwritten text 'ON IT!' overlaid in black ink.
  • A square orange digital sticky note features the text, 'Let’s design a landing page to show off new features' in a black sans-serif font.
  • A flat graphic flowchart uses hand-drawn black arrows to connect various colorful shapes and patterns.
  • A playful collage of black-outlined doodles sits atop a peach-colored rectangular block, featuring a large empty speech bubble and a chunky musical sixteenth…
  • A collage of purple, hand-drawn icons sits against lavender and orange blocks, featuring a central smiling stick figure.
  • This abstract graphic illustration features a vibrant, collage-like composition of geometric and organic shapes against a black and white background.
  • A close-up screenshot of a design software interface showing a 'Variables' panel for 'CoLab Colors iOS'.
  • A close-up screenshot of a code editor window displays JSON data on a dark purple background.
  • A close-up screenshot of a software analytics dashboard titled Component Insertions under the UI2 library.
  • A dark-mode software interface screenshot displays the CoLab Design team dashboard against a sage green background.
  • A vibrant, minimalist graphic composed of geometric shapes on a light grey field.
  • A vibrant, minimalist graphic illustration features a row of three blue rounded vertical pillars of varying heights on a light gray field.
  • A vibrant graphic illustration features a bold, black stylized lowercase 'n' inside a selection box with purple corner handles.
  • A flat geometric graphic forms a stylized padlock shape using bold color blocks.
  • A playful digital collage features a large, central lilac-purple rectangle overlaid with smaller, vibrant graphic squares.
  • A digital graphic of three colorful sticky notes arranged as a collaboration board.
  • This graphic is a collaborative flowchart UI mock-up featuring colorful shapes and connectors.
  • A collaborative digital workspace graphic titled "Meet the team" features a light purple board with a collection of instant-film-style portraits.
  • A side-by-side graphic shows two project management task cards on pastel green and orange backgrounds.
  • A digital graphic featuring a purple-headed table and a colorful sentiment scale.
  • A digital graphic of a 'PROJECT KICK-OFF' planning board set against a light grey dotted grid background.
  • A clean digital diagram titled "USER FLOW" in a handwritten font at the top, set against a light gray dotted grid background.
  • A screenshot of a collaborative digital whiteboard with a dotted background, organized into sections titled "EVERGREEN" and "WEEKLY UPDATE." The left side…
  • A digital whiteboard screenshot displays a 'Customer profile' and 'Journey map' layout with a hand-drawn aesthetic on a light dot-grid background.
  • A digital workspace template titled "WEEKLY STANDUP" and "WEEK OF 10/3—10/7" in a hand-drawn black font over a white dot-grid background.
  • This digital workspace screenshot features a collaborative retrospective template set against a light-grey dotted background.
  • A wide-angle screenshot displays a digital workspace layout organized into three numbered columns: '1 TEAM OVERVIEW', '2 REFLECTION', and '3 STRATEGY'…
  • A colorful digital project roadmap chart spans March and April, organized into horizontal swimlanes for Research, Design, Product, Engineering, and Marketing.
  • A digital tablet displays a creative collaborative canvas titled "Tempo / Login Feedback," featuring hand-drawn app wireframes, vibrant sticky notes, and…
  • A digital graphic showcasing three stacked task cards from the Asana interface.
  • A light purple vertical block features a 'Meeting agenda' with bullet points for 'Introductions', 'Ice breakers', 'Brainstorm', and 'Next steps'.
  • An abstract, grainy texture dominated by shades of emerald and forest green.
  • A screenshot of the Figma design interface displays a mobile app mockup featuring a metallic silver sneaker against a lime green background with the text…
  • A screenshot of a dark-themed design software interface featuring a 'Button' component modal.
  • This screenshot displays a digital design workspace where a travel website for an 'Offtrail' high desert horseback ride is being edited.
  • A complex digital graphic displays a mobile app interface for the 'Museum of Speculative Futures' alongside its React code and an AI developer window titled…
  • A close-up UI screenshot depicts a black cursor hovering over a green code icon that reveals a 'Mark as ready for dev' tooltip.
  • A side-by-side software screenshot compares design iterations labeled 'Marked ready for dev' and 'Latest.' The UI elements feature dashed bounding boxes with…
  • A close-up UI screenshot of a design tool interface featuring a 'Send to Figma' button and a 'Cancel' button.
  • A screenshot of a software design tool interface showing a 'Product Card' for a 'Weather info tile.' The central element is a dark, rounded rectangle…
  • A grayscale photograph captures a lone surfer from an elevated angle as they walk across a textured sandy beach toward the water with their surfboard tucked…
  • A digital UI design for a total savings card features a dark green background with light blue text and icons.
  • This graphic showcases a deep maroon UI card titled 'Savings 101' in bold pink sans-serif font, accompanied by a smaller white 'Card' customization menu…
  • A digital graphic showcasing software annotation tools and metadata cards linked by dotted pink lines to a layout on the right.
  • This digital graphic features a vibrant blue and light cyan abstract pattern composed of numerous horizontal lines of varying widths.
  • A close-up software interface screenshot shows a cursor hovering over a blue 'Add' button for the 'Offtrail Design System'.
  • A light blue digital interface displays a 'LOS ANGELES' events grid alongside a white CMS backend dashboard.
  • A close-up UI screenshot of a software development interface featuring a dark 'Branches' dropdown menu overlaid on a white workspace.
  • This dark-themed UI screenshot features a design system interface titled "Use a design system" in white text.
  • A screenshot depicting a user interface for uploading a video, featuring a text prompt at the top that reads, "Add this video to the landing page." A black…
  • A split UI graphic shows a video playback scrubber at the top and a comment box below against a muted olive background.
  • A close-up UI screenshot displays a 'Version history' panel with a light blue row titled 'Add image level controls.' Overlaid on this white card is a dark…
  • A close-up UI screenshot of a mobile app's context menu labeled 'Cheddar' overlaid on a dark blue and black interface.
  • A close-up UI screenshot demonstrates a web design tool being used to edit a call-to-action button.
  • Three overlapping, rounded square cards display varied content above a large button that reads "View templates" next to a blue layout icon.
  • A digital product screenshot features a white 'Change layout' customization panel overlaying a purple event poster for 'Quiet Disrupters Conf 14—18 October…
  • A close-up UI screenshot demonstrates a 'Lock layer' feature within a design software interface.
  • A split-screen software screenshot highlights a 'LinkedIn Post' design template across gray and pink interface backgrounds.
  • This UI screenshot showcases a software interface for editing an event graphic alongside a preview of the design.
  • A square icon with four black rounded-corner squares is centered over a grid of nature-themed marketing graphics.
  • A lavender-tinted split-screen graphic shows a jagged maple leaf on a textured wood surface, transitioning from a grainy, out-of-focus left side to a sharp,…
  • A close-up macro photograph captures various sizes of translucent oil bubbles suspended in a pale mint-green facial serum.
  • A digital interface screenshot displays a video editing timeline with a 6.0-second clip and a play button against a light beige background.
  • A digital screenshot of a design interface showing a list of app icons on the left and a fundraiser poster on the right.
  • A vibrant collage of flat geometric and organic shapes floats in a circular arrangement.
  • A light blue digital interface showcases a 'Cheddar Design System' collage featuring a metallic silver piggy bank, various UI components, and lifestyle…
  • This graphic design collage features various UI elements including buttons, cards, and font styles across a light blue background.
  • A close-up software screenshot displays an 'Add instances' panel floating over a light purple design workspace.
  • A vertical digital design specification for a 'TRAIL RUN MEETUP' mobile app event page.
  • A dark modal window titled "Use a design system" overlays a light blue mobile app interface.
  • A vibrant green interface displays three white selection cards for design systems and code libraries.
  • A floating software interface menu titled 'Articles Fill' is layered over a grid of vibrant lifestyle cards featuring diverse young adults.
  • A close-up UI screenshot displays a dark pop-out menu over a light teal background, where a blue highlighted 'Libraries' option opens a sub-menu for…
  • A split-screen graphic shows a sleek mobile app interface for the "Museum of Speculative Futures" on the left and a dark-themed coding environment on the right.
  • A dark gray 'MCP' floating modal overlays a mobile app interface featuring a street map of Glendale and event listings like 'Morning Run Meetup.' The modal…
  • A dark-themed user interface screenshot displays a vertical list of design components like Button, Exhibition Card, and Artist Card.
  • A digital product interface screenshot against a solid purple background shows a web browser featuring the headline 'Add a little structure to your files.'…
  • A close-up UI graphic shows a Figma plugin search menu floating over a muted sage green abstract background.
  • A software interface overlay is positioned over a photo of a rugged SUV with a blue roof rack driving through a desert landscape.
  • A graphic design UI mockup showcases an 'Adjust tone' menu over a dark olive background with abstract organic shapes.
  • A dark software context menu floats over a digital workspace filled with colorful sticky notes and playful stickers like hearts, stars, and a thumbs up.
  • A close-up UI screenshot displays a collaborative voting slider on a light green background.
  • A digital UI graphic displays a poll asking, "Which direction should we move forward with?" over a pale pink background.
  • A flat digital illustration depicts a design workflow featuring colorful shapes within light-blue transformation bounding boxes.
  • A UI design screenshot shows a lavender-background canvas where a flower shop mobile app, 'Buttercup,' is being edited.

Download Figma’s Brand Skill

A Brand Skill is a folder of brand guidance written for agents. Give it to Claude, ChatGPT, Cursor or another agent and ask it to follow Figma’s guidelines. It starts at SKILL.md, which points to the right file for each task.

It has the guidance, 228 images and the logos. The font files belong to Figma, Inc, so they’re left out.

Download the Brand SkillZIP, 15.4 MB

figma-brand-skill/

├ SKILL.md

├ README.md

├ references/

│ ├ imagery-marketing-gallery.md

│ ├ colors.md

│ ├ logo.md

│ ├ typography.md

│ ├ voice.md

│ ├ dos-and-donts.md

│ ├ imagery-editorial.md

│ └ imagery-product-interface.md

└ assets/

├ images/

└ logos/

Rainbrand’s Brand Agent built this Brand Skill from figma.com on 30 Oct 2026. It isn’t Figma’s official guide. Reviewed by Siddharth Borderwala, Founding Engineer at Rainbrand.

Figma and its logos are trademarks of Figma, Inc. Rainbrand isn’t affiliated with or endorsed by Figma, Inc.

Make one for
your brand.

Add Rainbrand to your agent and give it your website, brand guide or files. Rainbrand builds a Brand Skill like this one and keeps it up to date.

Get startedRead the docs

  1. Open the Rainbrand plugin and add it.

    Open Rainbrand plugin (opens in a new tab)

  2. Connect your Rainbrand account when asked. It works in ChatGPT and in Codex.

See all brands
The brand layer for agents

Rainbrand builds and maintains shared brand context for your agents and products

Get startedRead the docs (opens in a new tab)