# Shadcn Solid

> shadcn/ui port สำหรับ SolidJS - accessible, customizable components ที่ copy-paste ได้

- Skill: `newkub/shadcn-solid` (Agent Skill, multi-file: 13 files)
- Install (CLI): `npx skillmds@latest add newkub/shadcn-solid`
- Raw SKILL.md: https://api.skillmd.com/api/skills/newkub/shadcn-solid/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: newkub (https://skillmd.com/u/newkub)
- Updated: 2026-09-10
- Page: https://skillmd.com/skills/newkub/shadcn-solid

---

## Goal

ใช้ shadcn/ui สำหรับ SolidJS component library ด้วย copy-to-own pattern และ accessible components


## Scope

ใช้สำหรับสร้าง UI components ด้วย shadcn/ui บน SolidJS


## Execute

- ติดตั้ง shadcn/ui สำหรับ SolidJS
- อ่าน `guide/installation.md` สำหรับการติดตั้งและ setup
- อ่าน `guide/quick-start.md` สำหรับเริ่มต้นใช้งาน
- อ่าน `guide/key-concept.md` สำหรับแนวคิดหลัก
- อ่าน `guide/how-it-works.md` สำหรับวิธีการทำงาน
- อ่าน `key-concepts/` สำหรับแนวคิดเฉพาะทาง
- อ่าน `guide/features.md` สำหรับ features ที่มี
- อ่าน `guide/patterns.md` สำหรับ patterns ทั่วไป
- ใช้ CLI สำหรับ add components
- อ่าน `guide/configuration.md` สำหรับการตั้งค่า
- อ่าน `references/configuration.md` สำหรับ configuration reference
- Customize components ตามความต้องการ
- อ่าน `guide/best-practices.md` สำหรับ best practices
- อ่าน `principles/` สำหรับหลักการ
- ใช้ accessible components
- อ่าน `guide/integration.md` สำหรับ SolidJS integration
- อ่าน `guide/architecture.md` สำหรับ system architecture
- อ่าน `guide/structure.md` สำหรับ project structure
- อ่าน `guide/troubleshooting.md` สำหรับปัญหาทั่วไป


## Rules

- ใช้ CLI init สำหรับ initial setup
- ใช้ copy-to-own pattern เสมอ
- ใช้ accessible primitives
- ใช้ Tailwind CSS สำหรับ styling
- ใช้ backticks สำหรับ commands, components
- ใช้ code blocks สำหรับ component examples
- ใช้ ansi markdown diagrams สำหรับ flow และ architecture
- ใช้ accessible components เสมอ
- Customize components ตามความต้องการ
- หลีกเลี่ยง modifying core components


## Expected Outcome

- UI components ที่ accessible และ customizable
- Code ที่ copy-to-own และ maintainable
- Integration ที่ smooth กับ SolidJS
- Components ที่ follow accessibility best practices