Open Source Responsive CSS Framework

Download .zip Download .tar.gz View on GitHub

Simple. Lightweight. Beautiful


Responsiva Extra Examples:


  • lightweight
  • simple & clear
  • 12 columns layout
  • helper classes
  • rtl support (responsiva.rtl.css [under development])
  • created by developers for developers
  • very clear grid system


Install with bower:

bower install responsiva

1) include Responsiva in your HTML/Theme

<link rel="stylesheet" type="text/css" href="responsiva.css">

2) to add RTL support to your HTML/Theme, add responsiva.rtl.css after the main responsiva.css file:

<link rel="stylesheet" type="text/css" href="responsiva.rtl.css">

3) Basic layout example:

<div class="main_container">
<div class="row">
<div class="col-6"></div>
<div class="col-6"></div>
<div class="row">
<div class="col-8"></div>
<div class="col-4"></div>

4) Mobile & Desktop Grid system [Example]:

<div class="main_container">
<div class="row">
<div class="col-8 mob-6"></div>
<div class="col-4 mob-6"></div>
<div class="row">
<div class="col-7 mob-8"></div>
<div class="col-5 mob-4"></div>

5) Grid row without 'margin-bottom'

<div class="row end">

6) Display elements on desktop only

<div class="desktop_only">

7) Display elements on mobile devices only

<div class="mobile_only">

Helper classes

1) class "error" and class "error-border"
<div class="error error-border"> error error-border </div>
class error & error-border

2) class "warning" and class "warning-border"
<div class="warning warning-border"> warning warning-border </div>
class warning & warning-border

3) class "success" and class "success-border"
<div class="success success-border"> success success-border </div>
class success & success-border

4) align-center, align-left, align-right

5) bold, italic, underline

6) h1 - h6

6) class "hide" - hide contents from desktop & mobile screens

6) class "show" - show contents from desktop & mobile screens

ToDo List

  • simple social icon pack
  • jQuery functionality (accordion, popups etc...)
  • helper classes to fetch specific mobile devices

Responsiva recommends

For more responsive & mobile friendly code we recommend:

Authors and Contributors

Developed by Alexander Volkov