Relume Community Icon
Relume Community
  • 馃彔Home
  • 馃搮Events

  • 馃數Announcements
  • 馃數General
  • 馃數Getting Started
  • 馃數Issues
  • 馃數Showcase

Powered by Tightknit
Getting Started
Getting Started

Figma Guide: How to Update Typography and Colors Efficiently

Avatar of Arturo R.Arturo R.
路

Hello! I'm working on my first project using the Figma library and I can't understand how to update the style guide so all the typography and colours are applied in one go. Can someone help me? 馃檹

5 comments

  • Avatar of Blair
    Blair
    路

    Post a screenshot of your pages panel in Figma

  • Avatar of Arturo R.
    Arturo R.
    路

    Hi Blair, thanks for your help! As you can see I've added the Figma kit to the libraries. When I started designing the page, I unlinked all the text styles as I wanted to have some freedom to experiment with font weights and sizes. What's the best way to proceed now? Should I set up all the text styles again from scratch?

  • Avatar of Blair
    Blair
    路

    Good question. Nice one, I love the message of the site you're designing. We definitely need more peace in today's world. I guess the question is what are you going to do next in terms of your workflow. Example: if you are getting sign off and then building in Webflow then does it really matter if you reapply the styles for the style guide and update it? In that example it seems easier to just import your relume pages and components into Webflow and then update the Draft style guide page in Webflow. Does that answer your original question? The other answer is to go to the style guide page in Figma and yes update and reapply the styles to your design. Again that might not be valuable at this point assuming your next step is to build in Webflow. There are probably better answers than these out there 馃槉 but hope that is helpful.

  • Avatar of Arturo R.
    Arturo R.
    路

    Thanks a lot Blair! Yeah, P4P is a really cool nonprofit. I've been trying to help them refresh their messaging and look and feel as they tend to be quite dry and academic! Re workflow, I'm actually not going to go into Webflow for this one. I'll be handing off the Figma files to a developer who'll be developing the site in Wordpress. I still wanted to take the opportunity to use Relume and the Figma kit though! As I'm still a newbie, can you help me understand how to apply the style guide page? I don't see a 'Style guide' page under Pages. Do I need to import it? Or do I simply create the styles from scratch using the Local Styles side panel (see screenshot)? 馃檹

  • Avatar of Blair
    Blair
    路
    1. 1.

      Go to Layers tab in the left panel

    2. 2.

      Select Style Guide

    3. 3.

      Click "How to use the Style Guide" or just start changing styles