OpenHive — Open-source Slack alternative built with Tailwind CSS + shadcn/ui

[arseneHuot]

Hey Tailwind community! 👋

I built OpenHive — a fully open-source, self-hosted team messaging platform (Slack alternative), and the entire UI is built with Tailwind CSS.

How we use Tailwind

Every component in OpenHive is styled with Tailwind utility classes:

• Dark-themed workspace layout — sidebar, channel list, chat area, activity panel
• Message bubbles with hover states, reactions, thread indicators
• Rich message input with file upload, emoji picker, mentions
• Video/audio call UI with participant grid and controls
• Responsive design using Tailwind breakpoints
• shadcn/ui components (Dialog, DropdownMenu, Avatar, Button, etc.) for consistent design tokens

Tailwind + shadcn/ui made it possible to build a complex, production-quality messaging UI without writing a single CSS file (beyond globals.css for Tailwind config).

Tech Stack

• Styling: Tailwind CSS + shadcn/ui
• Frontend: Next.js 14 (App Router) + TypeScript
• State: Zustand
• Backend: Supabase (PostgreSQL, Auth, Realtime, Storage)
• Calls: LiveKit WebRTC

Quick Start

git clone https://github.com/arseneHuot/openhive.git
cd openhive && npm install && npm run dev

The setup wizard connects to Supabase and auto-provisions all 23 database tables.

🔗 GitHub: https://github.com/arseneHuot/openhive

Would love to hear what the Tailwind community thinks of the UI!