Live Website: https://ceylon-roots.vercel.app/
Experience the world's finest Ceylon cinnamon, harvested from centuries-old spice gardens in Sri Lanka. This project is a premium e-commerce landing page designed to showcase and sell organic cinnamon products with a focus on purity, heritage, and quality.
Ceylon Roots is a modern, high-performance web application built to provide a premium shopping experience for organic spice enthusiasts. The platform emphasizes the unique health benefits and superior quality of authentic Ceylon cinnamon (Cinnamomum verum) through a clean, minimalist, and highly interactive user interface.
- Premium Visual Design: A sophisticated aesthetic using a curated color palette of emerald greens and stone neutrals to reflect natural purity.
- Interactive Shopping Experience: Seamless product exploration with a dynamic shopping cart drawer and real-time quantity updates.
- Responsive Layout: Optimized for all devices, from desktop monitors to mobile screens, ensuring a consistent brand experience.
- Micro-Animations: Smooth scroll-triggered animations and hover effects using Intersection Observer and Tailwind CSS transitions.
- Detailed Product Catalog: Showcases a diverse range of cinnamon products, including sticks, powder, infused honey, and essential oils.
- Informative Content: Dedicated sections for brand heritage, health benefits, FAQ, and customer testimonials.
- Frontend Framework: React 18
- Build Tool: Vite
- Styling: Tailwind CSS
- Icons: Lucide React
- Deployment: Optimized for modern static hosting environments.
To run this project locally, follow these steps:
- Node.js (Latest LTS version recommended)
- npm (comes with Node.js)
-
Clone the repository:
git clone [repository-url]
-
Navigate to the project directory:
cd Ceylon-Roots -
Install dependencies:
npm install
Start the development server:
npm run devCreate an optimized production bundle:
npm run buildThe build artifacts will be located in the dist/ directory.
All rights reserved. © 2026 Adheesha Sooriyaarachchi.