Get started

You could start a Ion project by downloading the latest version of the framework.

DOWNLOAD Version 0.12.5 - 267 KB

After finishing the download unzip the file to some directory of your preference. The uncompressed files are a set of css and javascript codes, in addition to the fonts. Your project structure will look like this:

/Your project
    /ion
        /fonts
            material-icons.eot
            material-icons.ijmap
            material-icons.ttf
            material-icons.woff
            material-icons.woff2
        ion.css
        ion.js
        ion.min.css
        ion.min.js

It is recommended to use the minified files (which contains ".min" in the name) if you need more performance and faster loading on your pages. Another tip is to put the javascript files at the end of your pages.

Basic HTML

To start with IonDesign you could implement the code below on your web page. Just make sure that all your files are being correctly referenced in the code.

<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />

        <link href="ion/ion.css" type="text/css" rel="stylesheet" />
    </head>
    <body>
    </body>
    <script src="ion/ion.js"></script>
</html>

GO TO DOCS