Card Styling

When styling cards use the following classes:

PublishedFeb 7, 2026

Loading actions...

5 minBeginnerprompt6 files

Skill content

Main instructions and any bundled files for this skill.

markdown

Additional Files (5)

Card Styling

When styling cards use the following classes:

Always use card card-bordered border-base-300 shadow-md
If the card is a click target, add hover:shadow-lg hover:border-primary/50 transition-all duration-200
Typically leave the background color unset, but if a darker background is needed use bg-base-200
How you control size/padding depends on the use case. Use an appropriate approach

Example

&#x3C;div
  class="card card-bordered border-base-300 shadow-md"
  >
  &#x3C;!-- Content here -->
&#x3C;/div>

Contents

View Original Source

Related Skills

General

PromptBeginner5 minmarkdown

Untitled Skill

193

Jan 12, 2026

General

PromptBeginner5 minmarkdown

Frontend Typescript Linting.mdc

TypeScript and ESLint rules that MUST be followed when creating, modifying, or reviewing any file under apps/frontend/, including .ts, .tsx, .js, and .jsx files. Also apply when discussing frontend li...

160

Feb 15, 2026

General

PromptBeginner5 minmarkdown

2. Apply Deepthink Protocol (reason about dependencies

risks

126

Jan 15, 2026