material-foundation
Mat 3 Figma theme builder: Colors don't match tones and other question
Hello there!
My brain is trying to connect the Theme palette to the tonal palette with the variables that the Plug in provides. However, I've noticed that some colors aren't the same as what the Themes say they should be.
For instance:
Tonal Palette P-40: #005DB6
Light Theme: Primary P-40: #405F90
Thankfully, this doesn't happen for every color, but it's really breaking my brain!!! Questions are:
Did I break the plug in somehow? Is it okay to connect variables to styles? The plug in doesn't do this but I feel like I need to do it for easier maintenance. (However, I feel like all that work will be overwritten if we ever have to go pick a different color.) Am I supposed to go through palette and eyedrop till I find the right value from the tonal palette and write it in myself? (Which I have done on a few and they don't match the tonal palette on ANY value. It's something slightly different and I don't know why, would love to know why.) Am I supposed to leave the P-40 text but match the color to be that of the tonal palette that was generated? OR Is P-40 to P-100 always the right contrast for accessibility? (Same goes for all numbers written in there, are those always right ratio for accessibility?) I really want to stay connected to the original file as much as I can to keep up with future updates, which is why we're using this file to begin with. Last question, if yalls team makes an update and pushes it, will it overwrite all my files stuff if I accept the update for the file?
Any insight will def help, Thank you all.
Hi!
-
So there is currently a discrepancy between tonal palettes and the scheme colors when content color or color match is turned on, it's currently how the algorithm runs. Don't worry, you didn't break anything!
-
You are welcome to use variables or styles. MTB is styles first because of the mode limitations on Figma plans.
-
You can also customize style color values as you see fit once they are generated. There is a contrast check ability in settings. But you should not have to hand select colors. Tonal palettes are only for reference and not really used beyond initial generation.
-
For original file, are you referring to the M3 design kit?
Hello! Thank you for your help, yes, I am referring to the M3 design kit. Also good to know about the tonal palettes, I was convinced they were supposed to match for some reason.