Skip to content

Modal background not transparent anymore, because of tailwind 2 removed classes in tailwind 4 #1557

@Ukalus

Description

@Ukalus

Describe the bug

bg-opacity- has been deprecated in Tailwind 3 and now completely removed in Tailwind 4.

could we update the Components to use opacity- instead?

workaround:

plugins: [
require("flowbite/plugin"),
plugin(function({ theme, matchUtilities }) {
const opacities = theme('opacity'); // Get the opacity theme values from Tailwind

  matchUtilities(
    {
      'bg-opacity': (value) => ({
        backgroundColor: `rgba(0, 0, 0, ${value})`, // Create the background color opacity utility
      }),
    },
    { values: opacities, type: 'value' } // Apply the values from the opacity theme
  );
}),

],

Reproduction

use Flowbite svelte with Tailwind 4

Flowbite version and System Info

"flowbite": "3.1.2",
"flowbite-svelte": "0.47.4",
"@tailwindcss/postcss": "4.0.14",
"svelte": "5.23.1",
"@sveltejs/kit": "2.19.2",

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions