Why 2 separate and overlapping color paletes? The Case of Teal and Fifty Shades of Gray #3081
-
According to the Tailwind CSS 2.0 launch marketing and https://www.youtube.com/watch?v=D2O9__GxWrU video there is now a new color palette with some colors removed, some added. https://tailwindcss.com/docs/customizing-colors starts with one palette and ends with another. First one looks like the new 2.0 theme, except is missing the promised 50 shades of gray :) The last palette has all the grays and also the colors that according to the video are removed (Teal, for example). Could the doc ( PS. First palette has 'Yellow - colors.amber' , 2nd has 'Amber - colors.amber'. |
Beta Was this translation helpful? Give feedback.
Replies: 2 comments
-
Hey! 👋 The palette at the beginning of https://tailwindcss.com/docs/customizing-colors is what you get out of the box, if you don't specify anything color related in your Tailwind config file. It is a subset of the complete color palette. A sensible decision that meets the balance between variety of colors, and generated file size. The palette at the bottom, with the 50 shades of gray, is the complete set of colors available. In other words, if you do nothing with Re: |
Beta Was this translation helpful? Give feedback.
-
Going to convert this in a discussion as we're trying to keep issues for things like bugs, incorrect documentation etc, but this could still be useful for some folks 👍 |
Beta Was this translation helpful? Give feedback.
Hey! 👋
The palette at the beginning of https://tailwindcss.com/docs/customizing-colors is what you get out of the box, if you don't specify anything color related in your Tailwind config file.
It is a subset of the complete color palette. A sensible decision that meets the balance between variety of colors, and generated file size.
The palette at the bottom, with the 50 shades of gray, is the complete set of colors available.
In other words, if you do nothing with
theme.colors
ortheme.extend.colors
in your config file, you get the color palette from the top of that docs page.Re:
yellow/amber
- this is intentional. Same withgreen/emerald
andpurple/violet
. We tried to stick with the mos…