Dansk
UI-elementer
The pieces this site builds its pages from. Each one is captioned with the classes that draw it: copy those rather than inventing a new look.
Badges
A short label beside something, never instead of a button. The Pro badge is badge badge-primary badge-xs.
Colours
Styles and sizes
Forms
An icon inside a box sits before the input with z-10: daisyUI's
input
is positioned and paints over anything before it.
Text
Choices
Alerts
One line on something the reader has to know now.
Surfaces
Something set on the page is a <.panel>; something set into a panel is base-200; nothing yet is an <.empty_state>.
Capital
BucureștiNo tests yet
Pick a level, then press Start test.
Log in to keep this result.
A card
With a title and actions.
Widths
A page is the layout's column: the default, or <Layouts.app wide>
for a page with its own side columns. Anything narrower (a form, a game board, an article, a whole login page) is max-w-narrow, centred with mx-auto. There is no other width.
md, so it narrows a page only from
lg
up.
Colours
The theme's colours. Use the name, never a hex: each theme sets its own.
Theme
Text
Aa
Aa
Aa
Aa
Aa
Aa
Text is text-base-content, or text-muted
for a detail. No text-base-content/NN
of a page's own: anything lighter reads below 4.5:1 on the light theme. An
opacity
on a box fades the text in it too, so a muted line inside a faded box falls under it.
Type
A page has one title, <.page_title>. Every heading under it is an <.eyebrow>: a section of the page (tag="h2"), a panel's title (<.panel title=…>), a group inside either. A subtitle says less than the title, so it is never a size of its own.
Explore
Category
Body text reads at the base size.
A line of detail under something.
btn-surface
Feedback
Something is happening, or how far along it is.