Differences between DaisyUI's "btn", "btn-primary" and "button-primary"

Introduction

When I was creating buttons using Next.js + TailwindCSS + DaisyUI,
I ran into an issue where one button was blue and the other was purple, resulting in mixed colors.

Here, I'd like to summarize DaisyUI's notation method.

Conclusion: These three are completely different

• btn

→ Create only the button shape
→ Almost no color (gray)

• btn-primary

→ The blue main button provided by DaisyUI

• button-primary

→ The color is determined by the theme (light/corporate, etc.)
→ The button is purple in the Light theme.

Example

<button class="btn">Shape Only</button>
<button class="btn btn-primary">Blue</button>
<button class="btn button-primary">Theme Color (light = purple)</button>

Why purple?

Because the primary color in DaisyUI's default theme (light) is purple (#570DF8).

Summary

The only difference in color is the class used (btn-primary/button-primary).