메뉴
DaisyUI v5 design system. Use for backgrounds, borders, text sizes, opacity, semantic colors, and spacing.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
| name | styling-patterns |
| description | DaisyUI v5 design system. Use for backgrounds, borders, text sizes, opacity, semantic colors, and spacing. |
<!-- ✅ Correct: Proper background hierarchy -->
<div class="bg-base-200 p-6">
<div class="card bg-base-100 p-4 shadow-md">
<h2 class="mb-3 text-2xl font-bold">Section Title</h2>
<p class="text-base">Main content text</p>
<p class="text-sm opacity-60">Secondary metadata</p>
</div>
</div>
<!-- ❌ Wrong: Same background as parent -->
<div class="bg-base-100">
<div class="card bg-base-100">No visual separation</div>
</div>
border-base-300 solid (no opacity)Database migration patterns for SQLite. Use when creating migrations, modifying schema, or running database changes.
Remote functions reactive UI patterns. Use for smooth in-place updates, preventing page jumps, and managing loading states with .current property.
SvelteKit patterns for devhub-crm. Use for remote functions (query, form, command), routing, and server-side logic.
Better-auth integration for authentication. Use when implementing login, registration, protected routes, or email verification.
Vitest browser mode component testing. Use for testing Svelte 5 components with real browsers, locators, accessibility patterns, and reactive state.
SQLite operations using better-sqlite3 with prepared statements. Use when implementing CRUD operations, timestamps, and user-scoped queries with row-level security.