Text Color

Usage

Please refer to the documentation on the Tailwind CSS website

Compatibility

ClassSupport
text-{n}
โœ… Full Support
text-[n]
โœ… Full Support
text-inherit
๐ŸŒ Web only
text-current
๐ŸŒ Web only
Legend

Class

-{n} Supports values from theme

-[n] Supports arbitrary values

Icon

โœ… Full support

โœ”๏ธ Partial support on native

๐Ÿงช Experimental support on native

๐Ÿ“ฑ Native only

๐ŸŒ Web only

textOpacity (native only)

For performance reasons, Nativewind renders with the corePlugin textOpacity disabled. This plugin allows text to dynamically change its opacity via the --tw-text-opacity variable. Instead, the opacity is set as a static value in the color property.

If you need to use this feature, you can enable it by adding the following to your tailwind.config.js file:

module.exports = {
  /* ...  */
  corePlugin: {
    textOpacity: true,
  },
};

On this page