How to override daisy ui styles?

Question

I want to modify default stying in daisy UI.

I have used the following code <button class="btn btn-primary bg-black">I am a button</button>

This is how the button look

But I want a black background for this.

In daisyui website have found the following: daisy UI website screenshot

And when I copy this code in my vs code: vs code screenshot I am getting: output screenshot

I know that it is possible to use the daisy UI theme. But sometimes a little modification is required like ml-2 , p-4 etc.

Answer 1

Make sure you include tailwind cdn as well:

<script src="https://cdn.tailwindcss.com"></script>

More info is available on this link: https://reacthustle.com/blog/how-to-modify-daisyui-theme-using-cdn