DEV Community

Cover image for GMX.css: Create a simple layout
LIGMATV
LIGMATV

Posted on

GMX.css: Create a simple layout

Make a simple web page can be difficult, because a lot of ugly and unstyled components built in by browser. But of course, you can customize all of it with CSS. But styling can waste your times, makes you not serious about building applications.

GMX.css, an CSS framework that comnes with a lot of beautiful styled components with Material Design based, you can building your web apps many times easier and faster. This is how you can make an simple layout with GMX.css.

First, you need to import the CSS and Iconify Icon. We recommended to use the JSDelivr CDN.

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/LIGMATV/gmx.css@main/gmx.css">
<script src="https://cdn.jsdelivr.net/npm/iconify-icon@2.1.0/dist/iconify-icon.min.js"></script>
Enter fullscreen mode Exit fullscreen mode

Second, we built the simple navigation. And also it was really responsive! In desktop, it will showed in left and vertical, meanwhille in mobile, it will showed in bottom and horizontal.

Third, built some container with typography and button. You can learn from here.

You now can built an simple web app with GMX.css. For more explore, visit the website to see the demos and examples of the elements you want to copy 👇🏻
https://ligmatv.is-a.dev/gmx.css/ (Source code)

Top comments (0)