Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/DivMagicCom/DivMagic
Copy design from any website as CSS or Tailwind CSS components
https://github.com/DivMagicCom/DivMagic
css developer-tools tailwindcss web-development
Last synced: 18 days ago
JSON representation
Copy design from any website as CSS or Tailwind CSS components
- Host: GitHub
- URL: https://github.com/DivMagicCom/DivMagic
- Owner: DivMagicCom
- Created: 2023-05-10T05:32:11.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2023-07-14T13:19:13.000Z (over 1 year ago)
- Last Synced: 2024-08-01T02:35:52.730Z (4 months ago)
- Topics: css, developer-tools, tailwindcss, web-development
- Homepage: https://divmagic.com
- Size: 11.2 MB
- Stars: 58
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# DivMagic: Copy design from any website
Welcome to the official GitHub repository for DivMagic, an extension that copies any web element into reusable and easy to customize components with just a single click. It can convert any website to simple HTML/CSS code or React/Tailwind CSS code.
[DivMagic](https://divmagic.com) is a powerful tool designed to streamline the web development process. With DivMagic, you can instantly copy any element from any website and convert it seamlessly into customizable small code elements. This eliminates the need for manual conversion, saving time, and enhancing productivity for web developers and designers alike.
**Chrome**
[](https://chrome.google.com/webstore/detail/divmagic/okpadhgilncoodafepkdmlneojcehclf)**Firefox**
[](https://addons.mozilla.org/en-US/firefox/addon/divmagic/)## Key Features
- One-Click Element Copy: Copy any element from any website with a single click.
- Ability to copy style as CSS or Tailwind CSS (including colors)
- Conversion of any element from HTML to React/JSX and vice versa
- Generation of minimalistic, reusable output
- Seamless copying of styles, even through iframes## Demo Videos
See the power of DivMagic with these demo videos:
1. [DivMagic in Action: Transform Web Elements into Tailwind CSS in Seconds](https://youtu.be/QxPAsDSOIrI)
2. [DivMagic in Tailwind Playground: Transform Web Elements into Tailwind CSS in Seconds](https://youtu.be/kBPCrRSmKcg)
3. [DivMagic on Firefox](https://www.youtube.com/watch?v=WUJMR47WjNU)
4. [Hacker News Clone Tailwind CSS in One Click](https://www.youtube.com/watch?v=ZWcrENOpbY0)
5. [Copy website design with one click - DivMagic](https://www.youtube.com/watch?v=mnJ7ctYaye0)## Contact Us
For any questions, feedback, or bug reports, please reach out to us at [[email protected]](mailto:[email protected]) or create an issue here.
## Install DivMagic
Ready to improve your web development experience? [Install DivMagic](https://divmagic.com)!
**Chrome**
[](https://chrome.google.com/webstore/detail/divmagic/okpadhgilncoodafepkdmlneojcehclf)**Firefox**
[](https://addons.mozilla.org/en-US/firefox/addon/divmagic/)