https://github.com/aftab-s/groove-and-grind
VibeScript Series - 1 : Groove & Grind, A Coffee Brand Website with ✨ Google's Antigravity, Stitch, and Imagination.
https://github.com/aftab-s/groove-and-grind
antigravity googlestitch reactjs tailwindcss vibe-coding
Last synced: 7 days ago
JSON representation
VibeScript Series - 1 : Groove & Grind, A Coffee Brand Website with ✨ Google's Antigravity, Stitch, and Imagination.
- Host: GitHub
- URL: https://github.com/aftab-s/groove-and-grind
- Owner: aftab-s
- License: mit
- Created: 2026-03-16T15:41:43.000Z (3 months ago)
- Default Branch: main
- Last Pushed: 2026-03-16T16:32:41.000Z (3 months ago)
- Last Synced: 2026-03-17T03:54:58.034Z (3 months ago)
- Topics: antigravity, googlestitch, reactjs, tailwindcss, vibe-coding
- Language: CSS
- Homepage: https://groove-and-grind.vercel.app/
- Size: 17.3 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# ☕ Groove & Grind - Calm Coffee Rituals
Groove & Grind is a coffee showcase website built around peaceful mornings, floral notes, and soft music. The experience is designed to feel quiet, warm, and intentional - like the first slow cup of the day.
---
## 🌸 The Experience
- **Calm Visual Direction**: Soft light, flower-field atmosphere, and gentle contrast for a serene first impression.
- **Smooth Scrolling**: Powered by **Lenis** for fluid page movement and relaxed pacing.
- **Motion with Restraint**: Built with **Framer Motion** for elegant reveals, depth, and subtle interactions.
- **Story-Led Sections**: Hero, floral coffee collection, quiet moments carousel, and a Morning Circle subscription flow.
---
## 🛠️ Tech Stack
- **React 19** - Component-driven UI architecture.
- **Vite** - Fast local development and optimized production builds.
- **Framer Motion** - Animation, transitions, and interaction choreography.
- **Lenis** - Smooth scrolling behavior.
- **Vanilla CSS3** - Custom styling system and visual effects.
---
## 🚀 Getting Started
### Prerequisites
- Node.js (latest LTS recommended)
- npm
### Installation
1. Clone the repository:
```bash
git clone https://github.com/your-username/groove-grind.git
cd groove-grind
```
2. Install dependencies:
```bash
npm install
```
3. Start local development:
```bash
npm run dev
```
4. Build for production:
```bash
npm run build
```
---
## ✨ Design Philosophy
This project treats coffee as a mood and ritual. Every headline, transition, and section flow aims to communicate calm, beauty, and presence - inspired by flowers, music, and slow mornings.
---
*This project was vibe coded with ❤️ using Antigravity, Stitch, and my imagination.*
## 📜 License
MIT © 2026 Groove & Grind