Beautiful UI components, crafted with Tailwind CSS. By the makers of Tailwind CSS.
Questions tagged [tailwind-ui]
249 questions
3
votes
2 answers
How to change Tailwind CSS background color with Svelte, based on a value unpacked in #each?
I am a beginner in both Svelte and Tailwind and want to avoid an XY-Problem, so here is my goal:
I generate rows of a table with an #each loop in Svelte. (6 values per row). I now want to conditionally color the background of this row based on one…

stuntpeanut
- 53
- 4
3
votes
2 answers
Tailwind CSS classes is not working with React, error "You need to enable JavaScript to run this app..."
Talwind CSS is not working with React. I have installed Tailwind CSS as per the documentation (https://v1.tailwindcss.com/docs/installation) and my code is below.
Can someone help me?
Here is my browser pic of the inspect to understand my…

rupapayal
- 45
- 2
- 8
3
votes
3 answers
tailwind css showing warnings about generated css file missing styles
This is my first time installing and running tailwind CSS. I follow the instructions and did everything accordingly but then it started showing some warnings like below
Can you tell me why I am getting these warnings and anyway for me to fix them?…

Raihan_Alam
- 89
- 2
- 10
3
votes
3 answers
Tailwind + Headless UI: Close Mobile Menu after click or clickaway
I am using Tailwind + Headless UI to create a hamburger Menu bar on mobile to show the menu on click. But when I click on the menu it does not close automatically and creates a bad UX.

Harsha M V
- 54,075
- 125
- 354
- 529
3
votes
1 answer
Unable to use tailwind headless ui with vue 2 .Object(...) is not a function
I am trying to do insert headless ui popover in my vue 2 project . I am having this error
Uncaught TypeError: Object(...) is not a function
at eval (headlessui.esm.js?d511:670)
at Module../node_modules/@headlessui/vue/dist/headlessui.esm.js…

Biswas Sampad
- 413
- 1
- 6
- 19
2
votes
0 answers
Tailwind Flowbite modal not working with animation
I'm new in Tailwind CSS, and I'm using Flowbite as a ready made components via CDN. However, many options don't work with animation. Like that, modal is one of them. All the modal always open with a zoom in out effect, but in this case modal open…

Md. Ibrahim
- 147
- 7
2
votes
2 answers
TailwindCSS - content larger than screen when adding components
I am in the progress of learning React and TailwindCSS. I am currently trying to build a simple portfolio with a front page and a nav bar for some other pages. I have created the skeleton for my front page, but when I add the nav bar (header) the…

bragi
- 183
- 2
- 12
2
votes
0 answers
Error when including Tailwind UI components in Next.js 13 application
I'm working on a personal Next.js 13 + TypeScript + Tailwind CSS project. For mocking up the app I am trying to use Tailwind UI components. However, I keep getting the following JSON parsing error in a nested dependency:
I made a new blank Next…

Luciano Deben
- 65
- 7
2
votes
0 answers
React-datepicker css customisation in dark mode using Tailwind CSS for calendar elements
I'm trying to customise react datepicker's inside elements(calendar, headers, nav buttons) in dark & light mode while using with Tailwind css?
In the below image- I'm looking to change css for those light coloured areas.
I tried giving Tailwind's…

AmeeraJ
- 71
- 1
- 5
2
votes
1 answer
How to create the curve/ or a bend in a line with tailwindCss
How could I create the bend in a line with Tailwind CSS classes, as you can see I the picture there's a line under the green circle/dot. explicitly not using CSS stylesheet? or is it better to create an svg and simply use it?
This is my current…

Mahijendra
- 335
- 5
- 15
2
votes
0 answers
I installed tailwindcss. But live watch doesn't work properly
To check my output I have to run "npx tailwindcss -i ./src/input.css -o ./dist/output.css --watch" this command after calling every new tailwind class.
I tried many times and watched many tutorial but failed to run ☹️

Mahfuz
- 21
- 1
2
votes
1 answer
Blinking cursor forever during tailwind install process
Command Image
I am unable to search on SO hence detailing it here, this can be a duplicate question.Refer the Step 4:'Start the Tailwind CLI build process' TailwindInstallation the question is once I run the MSDOS command for CSS processing: npx…

Michael36
- 150
- 11
2
votes
1 answer
I am getting an error Module not found: Error: Can't resolve '@heroicons/react/solid'
I have run
npm install @heroicons/react
and my package.json looks like this:
"dependencies": {
"@headlessui/react": "^1.6.6",
"@heroicons/react": "^2.0.0",
...
but for some reason I cannot get it to work!
I am still getting this error
Please help…

daemon_2262
- 23
- 1
- 5
2
votes
0 answers
Tailwind UI modal with long content goes off screen
When using Tailwind UI modal with long text content, modal heading and close button go off screen.
is there a solution to display long content in a modal? for example is a scrollable modal possible in tailwind ui?
Code used is from…

tonsaa
- 41
- 3
2
votes
3 answers
Dropdown list not working as expected Tailwind css
I'm using tailwind with cdn, and just copy pasting one of the dropdown lists on flowbite: