Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/saulkurosaki/figma-clone-project
This is a Front-End Complete and Device Responsive Figma clone named: FigPro, with stunning design, collaborative components, tools and features. Developed with NextJs14, Typescript, TailwindCss, Liveblocks, ShadcdUi, fabric and jspdf to practice my Developer skills
https://github.com/saulkurosaki/figma-clone-project
clone clone-app clone-website fabric figma jspdf liveblocks next nextjs nextjs14 shadcn shadcn-ui tailwind tailwind-css tailwindcss typescript
Last synced: about 18 hours ago
JSON representation
This is a Front-End Complete and Device Responsive Figma clone named: FigPro, with stunning design, collaborative components, tools and features. Developed with NextJs14, Typescript, TailwindCss, Liveblocks, ShadcdUi, fabric and jspdf to practice my Developer skills
- Host: GitHub
- URL: https://github.com/saulkurosaki/figma-clone-project
- Owner: saulkurosaki
- Created: 2024-05-31T20:45:29.000Z (8 months ago)
- Default Branch: main
- Last Pushed: 2024-07-09T21:57:53.000Z (6 months ago)
- Last Synced: 2024-11-14T23:13:34.555Z (2 months ago)
- Topics: clone, clone-app, clone-website, fabric, figma, jspdf, liveblocks, next, nextjs, nextjs14, shadcn, shadcn-ui, tailwind, tailwind-css, tailwindcss, typescript
- Language: TypeScript
- Homepage: https://figpro-saul-project.vercel.app
- Size: 3.16 MB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# FIGMA CLONE PROJECT
- Next.js
- TypeScript
- Liveblocks
- Fabric.js
- Shadcn
- Tailwind CSS## 🔋 Features
👉 **Multi Cursors, Cursor Chat, and Reactions**: Allows multiple users to collaborate simultaneously by showing individual cursors, enabling real-time chat, and reactions for interactive communication.
👉 **Active Users**: Displays a list of currently active users in the collaborative environment, providing visibility into who is currently engaged.
👉 **Comment Bubbles**: Enables users to attach comments to specific elements on the canvas, fostering communication and feedback on design components.
👉 **Creating Different Shapes**: Provides tools for users to generate a variety of shapes on the canvas, allowing for diverse design elements
👉 **Uploading Images**: Import images onto the canvas, expanding the range of visual content in the design
👉 **Customization**: Allows users to adjust the properties of design elements, offering flexibility in customizing and fine-tuning visual components
👉 **Freeform Drawing**: Enables users to draw freely on the canvas, promoting artistic expression and creative design.
👉 **Undo/Redo**: Provides the ability to reverse (undo) or restore (redo) previous actions, offering flexibility in design decision-making
👉 **Keyboard Actions**: Allows users to utilize keyboard shortcuts for various actions, including copying, pasting, deleting, and triggering shortcuts for features like opening cursor chat, reactions, and more, enhancing efficiency and accessibility.
👉 **History**: Review the chronological history of actions and changes made on the canvas, aiding in project management and version control.
👉 **Deleting, Scaling, Moving, Clearing, Exporting Canvas**: Offers a range of functions for managing design elements, including deletion, scaling, moving, clearing the canvas, and exporting the final design for external use.
and many more, including code architecture, advanced react hooks, and reusability
##
![alt text](1-Xnip2024-06-05_12-15-46.jpg)
![alt text](2-Xnip2024-06-05_12-16-18.jpg)
![alt text](3-Xnip2024-06-05_12-17-10.jpg)
![alt text](4-Xnip2024-06-05_12-18-25.jpg)
![alt text](5-Xnip2024-06-05_12-19-16.jpg)
![alt text](6-Xnip2024-06-05_12-22-16.jpg)
![alt text](7-Xnip2024-06-05_12-25-04.jpg)
![alt text](8-Xnip2024-06-05_12-44-05.jpg)
![alt text](9-Xnip2024-06-05_12-44-45.jpg)
![alt text](10-Xnip2024-06-05_12-47-49.jpg)
![alt text](11-Xnip2024-06-05_12-48-52.jpg)
![alt text](12-Xnip2024-06-05_12-49-27.jpg)
![alt text](13-Xnip2024-06-05_12-50-57.jpg)
![alt text](14-Xnip2024-06-05_12-54-08.jpg)
![alt text](15-Xnip2024-06-05_12-55-37.jpg)
![alt text](16-Xnip2024-06-05_12-56-38.jpg)
![alt text](17-Xnip2024-06-05_12-58-30.jpg)
![alt text](18-Xnip2024-06-05_12-59-01.jpg)