Skip to content

Grid Lights is a customizable grid-based UI system that allows users to toggle lights within a dynamic grid system. Built using React, Tailwind CSS, and modern JavaScript. Browse with desktop for better experience!!

Notifications You must be signed in to change notification settings

mahfuzHasan2003/Grid-Lights

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Grid Lights

🌟 Overview

Grid Lights is a customizable grid-based UI system that allows users to toggle lights within a dynamic grid system. Built using React, Tailwind CSS, and modern JavaScript, Grid Light is designed for interactive applications, settings panels, or creative UI experiments.

🚀 Features

  • 📌 Draggable Layout – Move the grid layout setter anywhere on the screen.
  • 🎨 Customizable Grid Size – Adjust the number of rows and columns.
  • 🏗 Toggleable Cells – Click to turn individual grid lights on/off.
  • 💾 State Management – Maintains light states dynamically.
  • 📱 Touch & Mouse Support – Works seamlessly on both desktop and mobile devices.

🛠 Tech Stack

  • React – Component-based UI
  • Tailwind CSS – Styling with utility classes

📦 Installation

Follow these steps to get the project up and running:

  1. Clone the repository
    git clone https://github.com/mahfuzHasan2003/Grid-Lights.git
  2. Navigate into the project folder
    cd Grid-Lights
  3. Install the dependencies
    npm install
  4. Start the development server
    npm run dev

🖥 Live View

Check out the live view here.

About

Grid Lights is a customizable grid-based UI system that allows users to toggle lights within a dynamic grid system. Built using React, Tailwind CSS, and modern JavaScript. Browse with desktop for better experience!!

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published