226 questions
0
votes
1
answer
26
views
Should I use `@theme` or `@theme inline`?
In some guides, they use @theme, while in others, they use @theme inline. If I stick to the @theme inline written by Next.js, the dark mode override mentioned in several answers here does not work:
...
- 14.8k
0
votes
2
answers
35
views
The bg-opacity-* utility no longer exists as of v4 - how could it still be created?
In some cases, it's useful to declare the bg-opacity value without using a modifier.
So instead of writing bg-sky-500/50, I'd prefer to use bg-sky-500 bg-opacity-50 in v4 as well.
However, it works in ...
- 14.8k
0
votes
1
answer
14
views
--border-style-* namespace doesn't work like the --border-width-* namespace; custom border-style values cannot be declared by @theme
I know that with --border-width-* I can declare custom sizes using descriptive names like md or xl instead of numbers.
Similarly, I intended to add my custom style using --border-style-* (since I ...
- 14.8k
-1
votes
0
answers
29
views
Tailwind css v4, organising file/folder/directory structure? [closed]
Goes without saying I'm a rookie,
I recently got into Next JS-v15 and Tailwind- v4. I'm obsessed with functionally optimal file/directory structuring. I want to know how to organize the tailwind CSS ...
- 1
-1
votes
1
answer
41
views
React and tailwindcss setup
I am new to react and cannot seem to understand the error that it is throwing at me in the index.css file
here is the code snippet
@import "tailwindcss";
html , body {
width: 100vw;
...
-3
votes
0
answers
38
views
Shadcn UI sidebar not working with uploadthing Styles [closed]
Project: Youtube Clone
Inspired by Code With Antonio but with Tailwind v4
Task: Building Video thumbnail Component & UI
At first, everything works pretty fine, the styles and components works ...
1
vote
1
answer
36
views
Use of iconify/tailwind4 plugin with vue dynamic class names
I'm using
@plugin "@iconify/tailwind4";
in my Vue.js project. This works fine using "static" class names like:
<span
:class="`icon-[tabler--carrot]`"
class="...
- 3,438
0
votes
1
answer
45
views
White(i.e uncoloured) patches formed when zooming in on my webpage
I am making a social media home page which has a leftsidebar, main timeline and right section. the tailwind part of the code is as below:
<div className="relative flex h-full w-full items-...
- 19
0
votes
0
answers
33
views
Responsive text size not working with Tailwind CSS v4.1 + Next.js 15
I'm building a web project using Next.js v15.3.5 Turbopack and the Tailwind CSS v4.1 framework for styling.
I set up the global.css file following the instructions on the official page, adding ...
1
vote
1
answer
31
views
How to handle a 360px mobile breakpoint in Tailwind CSS v4?
I’m trying to make a responsive site using Tailwind CSS v4.
The design I have starts from desktop, and then has a specific breakpoint at 360px for small smartphones.
By default, Tailwind only provides ...
- 41
1
vote
2
answers
44
views
Custom colors are not working as expected, despite the CSS-first declaration
I just launched a new Nuxt.js project (not using Nuxt UI) and added TailwindCSS to it following this guide:
https://tailwindcss.com/docs/installation/framework-guides/nuxt
That said tailwind works ...
- 1,723
1
vote
1
answer
34
views
How to create custom font classes in Tailwind CLI?
I'm using Tailwind CLI for my project. Currently, when I want to apply a custom font (for example, Montserrat), I have to write it like this:
<div class="font-[Montserrat]">Text</...
- 41
1
vote
1
answer
38
views
Is "git init" required when using the TailwindCSS v4 Vite plugin?
I followed the official Vite documentation to create a new Vite project, and then followed the TailwindCSS v4 Vite plugin documentation for integration. After completing the setup, I noticed that ...
- 14.8k
1
vote
1
answer
67
views
When should I use `*` and when should I use `:root, :host` as the parent selector?
I'd like to refer to an earlier question's answer as a starting point.
How to override theme variables in TailwindCSS v4 - @theme vs @layer theme vs :root
The statement there is that in order to ...
- 14.8k
0
votes
2
answers
304
views
How to override theme variables in TailwindCSS v4 - @theme vs @layer theme vs :root [closed]
I'm trying to understand how to properly override CSS variables in TailwindCSS v4. Here's a simple example of declaring a theme variable with @theme:
@theme {
--color-clifford: #bf79ea;
}
This ...
- 14.8k