Shadow Protocol is a modern, dark-themed landing page designed for cutting-edge platforms — security firms, crypto projects, or any tech-forward product. With bold typography, dynamic effects, and sleek animations, it captures attention and builds trust instantly.
🌐 Live Preview: v0-new-project-eta-plum.vercel.app
- Bold Hero Section: Immediately captures user attention with impactful visuals.
- Feature Highlights: Present core functionality with sleek iconography.
- Split Layout Sections: Showcase value with modern 2-column designs.
- Responsive Layout: Works seamlessly across desktop, tablet, and mobile.
- Dark Mode Design: Designed natively in dark theme with smooth toggling.
- Minimal Animations: Subtle, elegant transitions powered by CSS and JS.
- Framework: Next.js 15.2.4
- Language: TypeScript
- Styling: Tailwind CSS 3.4.17, tailwindcss-animate
- Form Validation: React Hook Form, Zod, @hookform/resolvers
- UI Components: Radix UI, Lucide React, Sonner
- Theme Switching: next-themes
- Carousel: Embla Carousel
- Date Picker: React Day Picker
- Utilities: clsx, class-variance-authority, tailwind-merge
-
Clone the repository:
git clone https://github.com/codedpro/shadow-protocol.git cd shadow-protocol -
Install dependencies:
npm install # or yarn install -
Run the development server:
npm run dev # or yarn devOpen http://localhost:3000 in your browser.
├── components/ # Reusable UI components
├── pages/ # Next.js routes
├── public/ # Static assets
├── styles/ # Tailwind + global styles
├── utils/ # Helper functions
├── types/ # Shared TypeScript types
├── tailwind.config.js # Tailwind configuration
└── package.json # Project scripts and dependenciesnpm run dev– Start development servernpm run build– Create production buildnpm run start– Start production servernpm run lint– Run linter