CSS Vars Framework - Simplicity, Power, and Performance

CSS Vars is built to provide developers with a clean, customizable, and effective front-end solution by linking one stylesheet. Customize styles using variables, use hundreds of reusable UI components, and build elegant and fast-loading web apps without extra bloat, no installs, setup, or config files.

CSS Vars team.

CSS Variables Based

Simple to implement and modify

Set your styles simply by adjusting variables and using ready-made classes

Instant Integration

Just link one CSS file

No npm install, webpack configuration, build scripts, nor package.json setup

Pure HTML CSS

All web site elements without JS

It's built for better performance purposes, all common UI elements

Fast Loading

A small CSS file makes wonders

Just 10kb (minified + gzipped), including the UI kit code

Scoped CSS

Can be used with other frameworks

It can be used, as a framework and a library. Works with other frameworks

Icons Included

Advanced styles for SVG icons

Add and style SVG icons without icon libraries, still can use libraries

Responsive & Mobile first

Much more than just a grid

Responsive images, videos, galleries,
tables, menus, maps, frames, embeds

100's of Free UI Elements

All needed elements are ready

Typography, buttons, cards, icons,
tabs, carousel, masonry, Flex gallery

Free & Open Source

Built with love to be used

Free framework, UI elements, &
themes. Download, use, enjoy & share

100+ page templates

Free templates for different topics

CSS Vars framework offers free page templates to build websites for free and easy to customize with CSSvars framework.

Explore Layots

UI Elements

Build with our elements

Free and Quality UI elements to use in your designs, fully customizable with CSS variables and already used and tested in top web sites and web apps.

Explore UI Elements

Build quality responsive websites quickly

No Javascript or other libraries needed, pure HTML & CSS to build great websites

Learn more Fork on Github