Figma tutorial advanced colour tokens using variables

Поділитися
Вставка
  • Опубліковано 20 гру 2024

КОМЕНТАРІ • 14

  • @mohamedaminhajri7632
    @mohamedaminhajri7632 11 місяців тому +1

    This is a gem 💎
    Glad I stumbled upon this early in my variable journey 🎉
    Thank you

  • @whennn
    @whennn Рік тому +1

    Interesting . I like the idea of using tokens instead of components.

  • @uifry
    @uifry Рік тому

    Amazing Content & Well explained :)

    • @diminishedreturn
      @diminishedreturn 11 місяців тому

      Are you for real?

    • @pixellink.design
      @pixellink.design  11 місяців тому

      Hi Andree, hope you are doing well. I am always looking to grow and improve the quality of the content.
      What types of educational formats do you find helpful to help you achieve what you are seeking to achieve?
      What were your goals when looking at this video?
      This question would help with creating more effective content for people like yourself?
      Thanks for your support and feedback 😊

  • @tw7716
    @tw7716 Рік тому +4

    We could use variant in a component with different colors.
    This way is not the good way to use variables

    • @pixellink.design
      @pixellink.design  Рік тому

      Then you can apply different sets of colors to different UI elements in the component.
      Or you can make it a custom colour component with the colors.
      In the end there is no wrong or right way there is just what works or does not work for you and your team.
      What system do you use for colour layering?

  • @ytRap007
    @ytRap007 4 місяці тому

    do you have the sample file can we have.

  • @ifydus
    @ifydus 7 місяців тому

    Amazing and quite insightful stuff.
    Thanks a lot.
    Please can you share the file used for this lesson for easy understanding?

  • @sevenson5112
    @sevenson5112 Рік тому +2

    confusing with the same name at the sub

  • @roxanneg-design
    @roxanneg-design 10 місяців тому

    First off, thank you for this detailed video. I work with a large design system at a software company and my team wanted to know what we should be doing with our variables besides just light and dark mode. I did speak to Figma about this too, because with your tutorial procedure it is impossible to get the hover effect of buttons when prototyping as the mode isn't exposed for the color on a primary button to have it "change to" hover color while hovering like you can do with variants. I confirmed this with Figma support.
    Figma recommended I watch their video, Variants vs Variables : ua-cam.com/video/RXQ8XVirzjs/v-deo.html which folks should check out in addition to what you've shown to make their decision on direction for their design system. It really helped me out a lot.

  • @BrialMusic
    @BrialMusic 10 місяців тому

    Moving everything into code, devs are gonna be like...wtf are these dots and gliphs in the json file export?

    • @pixellink.design
      @pixellink.design  10 місяців тому

      Like all people add space or capital and (/ - # &) alsorts of symbols, code needs to be 100% consistent. You will all ways need to convert your naming info a more appropriate format.
      I like using the dots so I can use my plugin to convert the name into a format automatically.
      In the end use the naming you want that makes sense for you, I am dyslexic and I can't read so a user dots and then I have a plugin that reformates names and covers the design into code.
      Hope this helps 🙏