Presets
Provides a set of prose
classes you can use to add beautiful typographic defaults to any vanilla HTML you don't control, like HTML rendered from Markdown, or pulled from a CMS.
- 🤖 Try the playground
- 🧭 Explore the examples
- 📓 Consult the API reference
- 📜 Read the changelog
Note
Based on @tailwindcss/typography.
🤝 Compatibility
@twind/preset-typography | @tailwindcss/typography |
---|---|
>=1.0.0-next.40 <1.1.0 | >=0.5.3 <0.6 |
>=1.0.0-next.27 <1.0.0-next.40 | >=0.4 <0.5.3 |
📦 Installation
with @twind/core
Install from npm:
Add the preset to your twind config:
Usage with a script tag
with Twind CDN
🙇 Usage
Most features of the Tailwind CSS › typography-plugin are implemented in the same way.
Differences
- Adding custom color themes: every color from
theme.colors
is available viaprose-<color>
; the default colorgray
can be changed viapresetTypography({ defaultColor: '...'})
- Customizing the CSS: can be done using
presetTypography({ extend: { /* CSS object */ } })