Closed jimmynotjim closed 7 years ago
It didn't make sense to add the other tints of green to the primary palette. Not sure if we should re-work the primary, background, secondary lists or what, because grays aren't always backgrounds and I'd argue
@green-20
isn't a primary brand color.
I agree that we should re-think how the palette is framed on the color principles page.
From @designlanguage
Rather than “CMYK coming soon”, can we just not include CMYK until we have those values?
I agree with Jimmy’s comments about the color groupings. We can show just our green as the primary color, but I don't think the tints need to be excluded.
Another factor is that with the added tints for all colors, it wouldn't neatly fit in the four columns of the current design. How about a different tabular format... something like this:
Just to clarify the groupings... I think we only need primary and secondary colors (along with respective tints).
@Scotchester @nataliafitzgerald @designlanguage If I take care of the CMYK can we merge it as is and backlog the layout? That's really a task all to itself.
I thought you wanted to merge this before doing all that work? 😜
@nataliafitzgerald @designlanguage here's a preview of what the new layout looks like (ignore the misalignments between the three screenshots)
That is looking :fire:
You might already be planning this, but how about we format the hex value in a fixed-with font?
I don't think Green 60 and Green 20 should be primary colors. It could just be CFPB green and Black, (possibly with each spanning 2 columns, with a swatch as thin as the secondary colors).
Besides that, I agree that this is looking great @jimmynotjim and @Scotchester !
One other thought: the body copy under primary color doesn't need to mention whitespace. It's already mentioned above in the text under Color (but maybe that's just placeholder text anyway).
Updated the font-face of the values to monospace per @Scotchester
@designlanguage that's the exact copy from the GDoc. Let's update it there to what you want for both that and the tints and I'll copy it over.
@designlanguage here's what the primary colors look like at 2 columns and the same height as the others
Bah! @designlanguage realized I was looking at the wrong text that you had commented on. I've removed the repetitive text from under the "Primary" heading and removed the placeholder text from under the "Tint" heading.
@Scotchester do you want to run this locally as a sanity check before we merge it?
@jimmynotjim Yes I do. Ready for me to give it a go?
@Scotchester I think I've addressed everything.
Great work on this! :shipit:
Updated all the brand colors so we can update this project to CFv4.
Changes
Additions
Testing
./setup.sh
to install new dependencies and rebuildnpm run colors
to regenerate the color palettegrunt less
andnpm start
Review
Preview this PR without the whitespace changes
Notes
Todos
Checklist