Magic.CSS is a simple and responsive CSS library, made with SASS. It's inspired by (though not directly derived from) Bootstrap and Materialize. Each component is made with minimal markup to increase neatness, and they come with extensive, user-friendly documentation.
To set up Magic on your website, simply add this to the <head> of your page:
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/magical-css@latest/dist/magic.css">Please note that if a new version of Magic is released, your website will receive it automatically, which may mean that some parts of your page change. To get a fixed version, see the jsDelivr docs: https://www.jsdelivr.com.
To install Magic, uncompiled SCSS, docs and more, do one of the following:
npm install magical-cssyarn add magical-cssbower install magical-cssClone https://github.com/palkerecsenyi/magic.git
For the proper functionality of Magic, please double check that the fonts are linked correctly at the start of dist/magic.css. If using a CDN, this works automatically.
Magical Library tries to avoid default styles (globally referencing elements rather than classes) wherever possible, to make it as non-destructive in complex projects as possible. Class names are designed to be very evident. For a full usage guide, see the Wiki of this repository.
Two fonts are used: Noto Sans by Google and Roboto by Christian Robertson.
To use Magic, you'll need to read the official documentation. It's currently available through Github pages at https://palkerecsenyi.github.io/magic/docs/. The documentation is, in fact, made with Magic!
That's it. Enjoy!
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent