Skip to content

docs: update v3 theme docs to use proper branch in URLs #2169

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 3 commits into
base: v3
Choose a base branch
from
Open

docs: update v3 theme docs to use proper branch in URLs #2169

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
23a8baf
docs: Corrected HTML end-tag typo (#1828)
mekraldi May 23, 2024
8cba886
docs: update v3.3 theme docs to use proper branch in URLs
joeyfigaro Mar 24, 2025
0f950c6
Redeploy to Vercel
philipp-spiess Mar 25, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions src/pages/docs/theme.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,15 +46,15 @@ module.exports = {
}
```

We provide a sensible [default theme](https://github.com/tailwindlabs/tailwindcss/blob/master/stubs/config.full.js) with a very generous set of values to get you started, but don't be afraid to change it or extend it; you're encouraged to customize it as much as you need to fit the goals of your design.
We provide a sensible [default theme](https://github.com/tailwindlabs/tailwindcss/blob/v3.3/stubs/config.full.js) with a very generous set of values to get you started, but don't be afraid to change it or extend it; you're encouraged to customize it as much as you need to fit the goals of your design.

---

## Theme structure

The `theme` object contains keys for `screens`, `colors`, and `spacing`, as well as a key for each customizable [core plugin](/docs/configuration#core-plugins).

See the [theme configuration reference](#configuration-reference) or the [default theme](https://github.com/tailwindlabs/tailwindcss/blob/master/stubs/config.full.js#L7) for a complete list of theme options.
See the [theme configuration reference](#configuration-reference) or the [default theme](https://github.com/tailwindlabs/tailwindcss/blob/v3.3/stubs/config.full.js#L7) for a complete list of theme options.

### Screens

Expand Down Expand Up @@ -191,13 +191,13 @@ You'll notice that using a key of `DEFAULT` in the theme configuration created t

To learn more about customizing a specific core plugin, visit the documentation for that plugin.

For a complete reference of available theme properties and their default values, [see the default theme configuration](https://github.com/tailwindlabs/tailwindcss/blob/master/stubs/config.full.js).
For a complete reference of available theme properties and their default values, [see the default theme configuration](https://github.com/tailwindlabs/tailwindcss/blob/v3.3/stubs/config.full.js).

---

## Customizing the default theme

Out of the box, your project will automatically inherit the values from [the default theme configuration](https://github.com/tailwindlabs/tailwindcss/blob/master/stubs/config.full.js). If you would like to customize the default theme, you have a few different options depending on your goals.
Out of the box, your project will automatically inherit the values from [the default theme configuration](https://github.com/tailwindlabs/tailwindcss/blob/v3.3/stubs/config.full.js). If you would like to customize the default theme, you have a few different options depending on your goals.

### Extending the default theme

Expand Down
4 changes: 2 additions & 2 deletions src/pages/docs/top-right-bottom-left.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -143,13 +143,13 @@ Use the `start-*` and `end-*` utilities to set the `inset-inline-start` and `ins
<div class="relative h-32 w-32 ...">
<div class="absolute h-14 w-14 top-0 **start-0** ..."></div>
</div>
<div>
</div>

<div dir="**rtl**">
<div class="relative h-32 w-32 ...">
<div class="absolute h-14 w-14 top-0 **start-0** ..."></div>
</div>
<div>
</div>
```

For more control, you can also use the [LTR and RTL modifiers](/docs/hover-focus-and-other-states#rtl-support) to conditionally apply specific styles depending on the current text direction.
Expand Down