[5.0.x-dev] Breaking changes in themes

Problem/Motivation

DaisyUI 5 is out there (beta-2). Here is the release note: https://v5.daisyui.com/docs/v5-beta/
and the changelog: https://v5.daisyui.com/docs/changelog/

There are breaking changes. Let's take care of changes in themes.

Remaining tasks

Take care of the breaking changes:
Automatic *-content color calculation based on background color was removed. Now that Tailwind CSS supports CSS variables for colors, we no longer process and convert color values at build time. You can use any color format you want and neither daisyUI nor Tailwind CSS will convert it to another format at build time.

Most themes have been adjusted to look better and consistent. color contrast and accessibility got even better and the colors are more harmonious. These changes make the color more visually appealing and easier to read.
If you prefer using the previous colors, I prepared a repo, including all daisyUI 4 theme colors easy to copy/paste in daisyUI 5.

All color variable names have been changed to be aligned with new Tailwind CSS 4 syntax. And to be more readable and easier to customize See the new color format.

Before --> After

• --p --> --color-primary
• --pc --> --color-primary-content
• --s --> --color-secondary
• --sc --> --color-secondary-content
• --a --> --color-accent
• --ac --> --color-accent-content
• --n --> --color-neutral
• --nc --> --color-neutral-content
• --b1 --> --color-base-100
• --b2 --> --color-base-200
• --b3 --> --color-base-300
• --bc --> --color-base-content
• --in --> --color-info
• --inc --> --color-info-content
• --su --> --color-success
• --suc --> --color-success-content
• --wa --> --color-warning
• --wac --> --color-warning-content
• --er --> --color-error
• --erc --> --color-error-content
• --rounded-box --> --radius-box
• --rounded-btn and --tab-radius --> --radius-field
• --rounded-badge --> --radius-selector
• --border-btn and --tab-border --> --border

Removed themes variables:

• --animation-btn was removed (no longer needed)
• --animation-input was removed (no longer needed)
• --btn-focus-scale was removed (no longer needed)

Theme custom fonts:
Cyberpunk and Wireframe themes no longer have custom font by default. If you want the same v4 font for them, customize these themes like:

@plugin "daisyui";

@plugin "daisyui/theme" {
  name: cyberpunk;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
}

@plugin "daisyui/theme" {
  name: wireframe;
  font-family: Chalkboard, comic sans ms, "sans-serif";
}