Skip to content

Dun-sin/Code-Magic

Repository files navigation


🚀 About

Code Magic is a website where you can get simple CSS tricks to make your application elegant with just few clicks.

code magic v2

🧙‍♀️ Magic options available for you:

  • Pic Text - Convert images to CSS art. Just upload and get CSS art with just one click.
  • Gradient Text - Dual color gradient for your texts.
  • Gradient Border - Get dual color gradient with desired radius.
  • Gradient Background - Make your backgrounds stand out by applying gradient colors.
  • Animations
    • Select one of the below options

      Skew

      Fade

      Spin

    • Set duration and speed for the animations
    • And boom
  • Box Shadow - Cast a shadow on your element.
  • Border Radius - Get desired border radius for your element.
  • Text Shadow - Create a cool shadow for your text.
  • Input Range - Style your range input type elements easily and quickly

⚒️ Languages / Tools

HTML
HTML
CSS
CSS
Typescript
TypeScript

🧑🏾‍💻 Demo

Check out the website: Code Magic

👇🏽 Prerequisites

Before installation, please make sure you have already installed the following tools:

👌🏾 What you have to do to contribute

🛠️ Installation Steps

  1. Fork the project. Click on the icon in the top right to get started
  2. Clone the project, you can use the following command:
git clone https://github.com/<your-github-username>/Code-Magic
  1. Navigate to the project directory
cd Code-Magic
  1. Install dependencies with npm install
npm install
npm install -g commitizen
  1. Run the project
npm run dev

🥂 After making a change

  1. Create a new branch
git checkout -b YourBranchName
  1. Add it to staging area

NOTE: don't commit the package.json

git add <path to the file you worked on>
  1. Commit your changes with
git cz
  1. Push your changes
git push

👨‍👩‍👦 Community

Don't forget to join the discord community - Join us

👩🏽‍💻 Contributing

  • Contributions make the open source community such an amazing place to learn, inspire, and create.
  • Any contributions you make are greatly appreciated.
  • Check out our contribution guidelines for more information.

🛡️ License

Code-Magic is licensed under the MIT License - see the LICENSE file for details.

💪🏽 Thanks to all Contributors

Thanks a lot for spending your time helping Code-Magic grow. Thanks a lot! Keep rocking🍻

Contributors

🙏🏽 Support

This project needs a star️ from you. Don't forget to leave a star✨