{"id":30248249,"url":"https://github.com/thesakshijaiswal/fusion","last_synced_at":"2026-04-11T10:37:33.157Z","repository":{"id":304015512,"uuid":"1016707156","full_name":"thesakshijaiswal/fusion","owner":"thesakshijaiswal","description":"Fusion is a clean, high-impact UI for SaaS platforms. Built for speed, focus, and effortless design. Powered by Next.js, TypeScript, and Tailwind CSS, it blends modern aesthetics with intuitive, collaborative features.","archived":false,"fork":false,"pushed_at":"2025-08-08T19:34:33.000Z","size":884,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-09-10T16:59:51.546Z","etag":null,"topics":["animation","drag-and-drop","framer-motion","javascript","nextjs","responsive-web-design","saas-application","tailwindcss","typescript"],"latest_commit_sha":null,"homepage":"https://fusion-dashboard-ten.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/thesakshijaiswal.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-07-09T12:05:13.000Z","updated_at":"2025-08-13T07:41:46.000Z","dependencies_parsed_at":"2025-07-10T22:57:46.777Z","dependency_job_id":"f67b25e7-0686-4a64-81dd-2813d98e3fbb","html_url":"https://github.com/thesakshijaiswal/fusion","commit_stats":null,"previous_names":["thesakshijaiswal/fusion"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/thesakshijaiswal/fusion","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thesakshijaiswal%2Ffusion","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thesakshijaiswal%2Ffusion/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thesakshijaiswal%2Ffusion/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thesakshijaiswal%2Ffusion/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/thesakshijaiswal","download_url":"https://codeload.github.com/thesakshijaiswal/fusion/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thesakshijaiswal%2Ffusion/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31677819,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-11T08:18:19.405Z","status":"ssl_error","status_checked_at":"2026-04-11T08:17:08.892Z","response_time":54,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["animation","drag-and-drop","framer-motion","javascript","nextjs","responsive-web-design","saas-application","tailwindcss","typescript"],"created_at":"2025-08-15T07:20:53.504Z","updated_at":"2026-04-11T10:37:33.121Z","avatar_url":"https://github.com/thesakshijaiswal.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Fusion: Impactful Design, Created Effortlessly\n\n**Fusion** is a streamlined interface built to explore what modern product design can feel like clean, fast, and purpose-driven. Crafted with Next.js, TypeScript, Tailwind CSS, and Framer Motion, it focuses on delivering smooth interactions, thoughtful layouts, and a visual rhythm that resonates with **startup-grade user experiences**. It’s a hands-on exploration of building intuitive, high-impact UIs with real-world product thinking.\n\n## 🚀 Key Features\n\n- 🖱️**Custom Multiplayer Cursor**  \nA Figma-inspired cursor that mimics the multiplayer editing experience, adding a modern, collaborative feel to the UI.\n\n- 🎯**Animated Hero Cards with Drag \u0026 Drop**  \nTwo hero section cards animate in from opposite directions on load and support drag-and-drop interactions for playful engagement.\n\n- ♾️**Infinite Scroll Animations**  \nSeamless infinite scrolling effects in both the Hero and CTA sections create a sense of momentum and modern motion design.\n\n- 🌟**Scroll-Reveal Introduction**  \nThe introduction section features elegant text reveal animations triggered on scroll, powered entirely by Framer Motion.\n\n- ⚡**Interactive Hover Effects**  \nThe Features section showcases dynamic hover interactions including text gradients, reveal-on-hover transitions, keyboard-press simulations, and icon animations like rotate and scale.\n\n- 🎞️**Bidirectional Infinite Scroll in Integrations**  \nTwo opposing scroll animations one upward and one downward run continuously in the Integrations section, delivering visual depth and balance.\n\n- 📜**Smooth FAQ Drawer Animations**  \nExpandable FAQ drawers with smooth open-close transitions provide a refined and user-friendly reading experience.\n\n## 🧰 Tech Stack\n\n| \u003cimg src=\"https://cdn.jsdelivr.net/gh/devicons/devicon/icons/react/react-original.svg\" width=\"48\" height=\"48\" alt=\"react\"\u003e | \u003cimg src=\"https://skillicons.dev/icons?i=nextjs\" width=\"48\" height=\"48\" alt=\"next\"\u003e | \u003cimg src=\"https://skillicons.dev/icons?i=javascript\" width=\"48\" height=\"48\" alt=\"Javascript\"\u003e | \u003cimg src=\"https://skillicons.dev/icons?i=typescript\" width=\"48\" height=\"48\" alt=\"typescript\"\u003e | \u003cimg src=\"https://cdn.jsdelivr.net/gh/devicons/devicon/icons/tailwindcss/tailwindcss-original.svg\"  width=\"48\" height=\"48\" alt=\"tailwindcss\" /\u003e | \u003cimg src=\"https://raw.githubusercontent.com/detain/svg-logos/b02ee1ac30c7ff4757278337c95588b01ed0954b/svg/f/framer-motion.svg\" width=\"48\" height=\"48\"\u003e |\n|:---:|:---:|:---:|:---:|:---:|:---:|\n| **React** | **Next** | **Javascript** | **TypeScript** | **Tailwind CSS** | **Framer Motion** |\n\n|\u003cimg src=\"https://cdn.jsdelivr.net/gh/devicons/devicon/icons/vitejs/vitejs-original.svg\" width=\"48\" height=\"48\" alt=\"vite\"\u003e|\u003cimg src=\"https://github.com/dcastil/tailwind-merge/raw/v3.3.1/assets/logo.svg\" width=\"48\" height=\"48\" alt=\"tailwindmerge\"\u003e |\u003cimg src=\"https://camo.githubusercontent.com/04e1c9eeac89e2a758bbe60c01bf92332a45f7bac62c614aaed646f8fd58c19d/68747470733a2f2f70726574746965722e696f2f69636f6e2e706e67\" width=\"48\" height=\"48\" alt=\"prettier\"\u003e |\u003cimg src=\"https://cdn.jsdelivr.net/gh/devicons/devicon/icons/eslint/eslint-original.svg\" width=\"48\" height=\"48\" alt=\"eslint\"\u003e|\n|:---:|:---:|:---:|:---:|\n| **Vite** | **TW Merge** | **Prettier** | **EsLint** |\n\n## ✨ Installation Steps\n\n#### 1. Clone the Repository\n\n```bash\ngit clone https://github.com/thesakshijaiswal/fusion.git\ncd fusion\n```\n\n#### 2. Install Dependencies\n\n```bash\nnpm install\n```\n\n#### 3. Start Development Server\n\n```bash\nnpm run dev\n```\n\n## 📂 Folder Structure\n\n```bash\n├── .gitignore\n├── .prettierrc\n├── LICENSE\n├── README.md\n├── eslint.config.mjs\n├── next.config.ts\n├── package-lock.json\n├── package.json\n├── postcss.config.mjs\n├── public\n├── src\n    ├── app\n    │   ├── favicon.ico\n    │   ├── globals.css\n    │   ├── layout.tsx\n    │   └── page.tsx\n    ├── assets\n    │   ├── Images\n    │   └── logo.svg\n    ├── components\n    │  \n    └── sections\n    │   ├── CallToAction..tsx\n    │   ├── Faqs.tsx\n    │   ├── Features.tsx\n    │   ├── Footer.tsx\n    │   ├── Hero.tsx\n    │   ├── Integration.tsx\n    │   ├── Introduction.tsx\n    │   ├── LogoTicker.tsx\n    │   └── Navbar.tsx\n└── tsconfig.json\n```\n\n## 🛠 Developer\n\n[![GitHub](https://img.shields.io/badge/GitHub-thesakshijaiswal-181717?style=for-the-badge\u0026logo=github)](https://github.com/thesakshijaiswal)\n\nIf you found this project useful or inspiring, please consider ⭐️ **starring the repo** to support the work!\n\n## 📄 License\n\nThis project is licensed under the [MIT License](LICENSE).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthesakshijaiswal%2Ffusion","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fthesakshijaiswal%2Ffusion","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthesakshijaiswal%2Ffusion/lists"}