Skip to content

A website to help you get short css code you can use in your applications

License

Notifications You must be signed in to change notification settings

Nakamcode/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✨

About

A website to help you get short css code you can use in your applications

Resources

License

Code of conduct

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 55.4%
  • HTML 31.3%
  • CSS 13.2%
  • Shell 0.1%