最省事的做法是在 <body> 上添加 text-gray-700 类以统一全局文字颜色，利用 color 的继承性，子元素自然生效，局部覆盖可直接加更具体的 text 类。
直接用 text-gray-800 这类工具类就能统一全局文字颜色
Tailwind 的 text- 工具类本质是设置 color CSS 属性，不需要写自定义 CSS，也不用改 HTML 结构。只要所有文本元素（p、span、h1 等）没被更具体的规则覆盖，加一个统一的 class 就能生效。
但注意：Tailwind 默认不提供“全局文字颜色”开关，它靠类名逐个应用——所以「快速统一」的关键不是找某个 magic class，而是用合适的方式批量注入。
给 <body> 加 text-gray-700 是最省事的做法
在根容器上设默认色，子元素会自然继承（color 是可继承属性）。Tailwind 的 text- 类底层就是 color: #374151 这样的声明，完全兼容继承机制。
- 不用改任何已有组件或文案标签
- 避免在每个
<p>或<div>上重复加 class - 后续想局部覆盖？直接在子元素上加更具体的
text-blue-600即可，优先级天然更高
<body class="text-gray-700"> <h1>标题</h1> <p>正文段落</p> <span class="text-red-500">这个会变红</span> </body>
别用 text-inherit 试图“继承父级 color”，它不解决根本问题
text-inherit 只是让当前元素显式继承其父元素的 color 值，但它本身不设初始值。如果父元素没设 color，最终还是走浏览器默认（通常是 #000），和你想要的“统一灰阶”无关。
立即学习“前端免费学习笔记（深入）”；
常见误用场景：
- 给
<div class="text-inherit">包住一堆文字，但外层没设 color → 无效 - 以为加了
text-inherit就能自动同步全局 → 实际只是透传，不定义基准
自定义 theme 配置只适合长期项目，临时统一没必要动 tailwind.config.js
虽然可以在 theme.extend.textColor 里加一个 default，再写 text-default，但这么做有明显代价：
- 要重启 dev server 才生效
- 生成的 CSS 体积增加（哪怕只用一次）
- 团队协作时，别人得查配置才知道
text-default对应什么值
真要长期维护一套设计系统，再考虑扩展；就改个主色？直接选 text-gray-700 或 text-slate-800 更快也更直观。
容易被忽略的一点：Tailwind 的灰阶命名（gray-50 到 gray-900）对应的是亮度递减，不是语义递增。比如 text-gray-900 是纯黑，text-gray-300 是浅灰——选错档位会导致文字在某些背景上不可读，建议先在浏览器里试两组对比再定稿。
