shadcn Obsidian-Style UI Kit for React (Dashboards, Kanban, Dataview Tables)

Stop hand‑tuning shadcn themes for hours. Start dropping in an Obsidian‑clean UI that just works.

You know the pain: you copy a shadcn component, tweak tokens, fix contrast, adjust spacing, and it still doesn’t match the clarity of Obsidian or Notion. You flip to dark mode and everything breaks again. You waste entire evenings nudging Tailwind variables when you’d rather be shipping features.

This kit gives you pre-styled, Obsidian‑themed shadcn components engineered for production apps. You get a complete dark/light system, calibrated typography, tuned spacing, and components that already look right without editing a single token. Install, import, and your UI is immediately readable, balanced, and consistent.

What’s Included:
- 32 Obsidian‑style shadcn components: buttons, inputs, modals, tabs, menus, tables, cards, and more
- 6 dashboard layouts with built‑in typography and contrast tuning
- 3 Kanban board variations with drag-and-drop states and Obsidian‑like surface depth
- Dataview‑style table components with row density controls and semantic color accents
- Full color system: 18 dark/light tokens mapped to Obsidian‑grade contrast levels
- Typography pack: markdown-inspired headings, lists, callouts, and code blocks
- Utility presets: spacing, shadows, borders, focus states, and motion calibrated across themes
- 42‑icon glyph pack matching Obsidian’s visual language, unavailable in any public icon set
- Installation script that configures tokens, theme providers, and CSS vars in under 2 minutes

Built from patterns refined across production React apps where readability and contrast weren’t negotiable. Every value—from shadow opacity to code block line‑height—comes from real UI audits, not guesswork.

Who This Is For:
- React developers building dashboards who don’t want to design an entire theme from scratch
- Indie hackers shipping tools that need clean, legible UIs without hiring a designer
- Teams migrating to shadcn who need a ready-made Obsidian‑like aesthetic that won’t break on theme toggle

Who This Is NOT For:
- Developers who want to design every component style by hand
- Projects that don’t use React or shadcn

If this doesn’t save you at least 6–8 hours of UI theming, reach out for a full refund.

What's Included (12 files)

• lib-obsidian-theme-tailwind-config.js
• components-obsidian-banner-callout.tsx
• TROUBLESHOOTING.md
• styles-obsidian-syntax-highlighting.css
• components-obsidian-dashboard-shell.tsx
• lib-obsidian-theme-tokens.json
• SETUP-GUIDE.md
• components-obsidian-kanban-column.tsx
• components-obsidian-kanban-card.tsx
• components-obsidian-icon-pack.tsx
• components-obsidian-dataview-table.tsx
• components-obsidian-floating-command-palette.tsx