# Magic.css

Neat and unique CSS framework for dynamic websites

Get Started
Warning: Magic is still in a pre-alpha stage, and documentation is not complete.

# Dynamic

Magic.css is targeted at dynamic pages such as social networks, dashboards and eCommerce sites, and offers unique components to make development easy.

For example, Magic includes a 'comment' component for handling the comments feed of a social post.

# Customisable

Magic.css also makes sure that each component can be customised to fit into any context.

For example, Magic comes with four default colours, as well as stylish and modern gradients for most components. This way, your page can be styled to match your brand.

# Responsive

Magic.css is, naturally, very responsive. Many components change shape and size completely to adapt to mobile, and this is also customisable.

For example, the Navbar changes completely on tablet and below. Try resizing this page to see the effect!

# Set up

Setting up Magic is easy! Simply copy this code into 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">

# Documentation

This page is created to provide extensive, beginner-friendly documentation on Magic. Each article is complete with examples and demonstrations. Get started:

Documentation

This page is also, in fact, created with Magic, in order to show its capabilities. If you like anything you see, hit Ctrl + U to see the code - it's almost completely unaltered, 'vanilla' Magic.css.