最省事的做法是在 上添加 text-gray-700 类以统一全局文字颜色，利用 color 的继承性，子元素自然生效，局部覆盖可直接加更具体的 text 类。

直接用 text-gray-800 这类工具类就能统一全局文字颜色

Tailwind 的 text- 工具类本质是设置 color css 属性，不需要写自定义 CSS，也不用改 html 结构。只要所有文本元素（p、span、h1 等）没被更具体的规则覆盖，加一个统一的 class 就能生效。

但注意：Tailwind 默认不提供“全局文字颜色”开关，它靠类名逐个应用——所以「快速统一」的关键不是找某个 magic class，而是用合适的方式批量注入。

给 加 text-gray-700 是最省事的做法

在根容器上设默认色，子元素会自然继承（color 是可继承属性）。Tailwind 的 text- 类底层就是 color: #374151 这样的声明，完全兼容继承机制。

• 不用改任何已有组件或文案标签
• 避免在每个

  或

  上重复加 class

• 后续想局部覆盖？直接在子元素上加更具体的 text-blue-600 即可，优先级天然更高

   
标题
   
正文段落
立即学习“前端免费学习笔记（深入）”；
   这个会变红 

别用 text-inherit 试图“继承父级 color”，它不解决根本问题

text-inherit 只是让当前元素显式继承其父元素的 color 值，但它本身不设初始值。如果父元素没设 color，最终还是走浏览器默认（通常是 #000），和你想要的“统一灰阶”无关。

常见误用场景：

• 给
  包住一堆文字，但外层没设 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 是浅灰——选错档位会导致文字在某些背景上不可读，建议先在浏览器里试两组对比再定稿。