macOS React UI is a modern, interactive desktop-like web interface inspired by the macOS operating system. This project simulates a macOS-like environment in the browser, built entirely with React and Tailwind CSS.
π Live Demo: rdvnui.com
β¨ Features
- π₯οΈ macOS-style desktop with draggable windows and dock
- π Launchable apps and file-like UI elements
- βοΈ Fully component-based React architecture
- π¨ Styled with Tailwind CSS for rapid customization
- π§ Global state management with Zustand
- π§© Animations and transitions via Framer Motion
π Technologies Used
π οΈ Getting Started
git clone https://github.com/ridvanonal/macos-react.git
cd macos-react
npm install
npm run devThen open http://localhost:5173 in your browser.
π Project Structure
macos-react/
βββ public/ # Static assets
βββ src/
β βββ apps/ # Simulated apps
β βββ components/ # Reusable UI components
β βββ store/ # Global state (Zustand)
β βββ utils/ # Utility functions
β βββ ...
βββ index.html
βββ README.md
π§© Developer Notes
- All windows, apps, and UI elements are built as modular components.
- You can add new apps by extending the
/appsfolder. - Zustand is used for managing window states, active apps, and more.
π οΈ Ongoing Development
This project is under active development and is improved over time as availability allows.
New features, refinements, and components are added gradually to make the system more polished and dynamic.
If you have suggestions or ideas, feel free to open an issue or create a pull request.
π€ Contributing
Contributions are welcome!
- Fork the repository
- Create a new branch (
git checkout -b feature/your-feature) - Commit your changes (
git commit -m 'Add new feature') - Push to your branch (
git push origin feature/your-feature) - Create a pull request β
π License
MIT License Β© RΔ±dvan Γnal
This project is a creative UI experiment and is not a real operating system. It's built to showcase desktop-like UI behavior on the web.