🧩 Web UI Components — All-in-One

รวม component สำหรับทำเว็บ พร้อมใช้งานจริง (inline CSS + inline JS)

📄 1. Content & Layout

1.1 Card (ข่าว/บทความ)

1.2 Hero Section / Banner

1.3 Accordion / FAQ (คลิกขยายได้จริง)

1.4 Tabs (สลับเนื้อหาได้จริง)

1.5 Timeline

1.6 Breadcrumb

1.7 Pagination

1.8 Badge / Tag / Chip

1.9 Alert / Notification Banner

📝 2. Form Elements

2.1 Input แบบ Floating Label

2.2 Checkbox / Radio / Toggle Switch

2.3 Button States

2.4 File Upload Dropzone

2.5 Stepper (ขั้นตอนแบบฟอร์ม)

💬 3. Feedback & Status

3.1 Toast Notification (กดปุ่มเพื่อดู)

3.2 Modal / Dialog Box (กดปุ่มเพื่อดู)

3.3 Empty State

3.4 Tooltip (hover เพื่อดู)

3.5 Progress Bar แบบมีเปอร์เซ็นต์

📊 4. Data Display

4.1 Stat Cards (กล่องตัวเลขสรุป)

4.2 Table แบบ Striped + Hover

4.3 Avatar / User Profile Card