Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

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✨

AltStyle γ«γ‚ˆγ£γ¦ε€‰ζ›γ•γ‚ŒγŸγƒšγƒΌγ‚Έ (->γ‚ͺγƒͺγ‚ΈγƒŠγƒ«) /