Quick start Get started

Get started with eFrolic, a simple and functional framework for creating responsive sites on mobile devices. Use one of the following ways to start using.


Requirements

This framework was first developed for mobile devices. To ensure proper playback and a touch zoom for all devices, add the meta tag of the sensitive window to your <head>.

  <!doctype html>
  <html lang="en">

    <head>
      <!-- Responsive meta tag -->
      <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    </head>

  </html>
  
Css / Font awesome icons

The icons are used in almost all the components, we use Font awesome but it is free to add your icons from other sources that you like.

Copy-paste the stylesheet <link> into your <head> before all other stylesheets to load our CSS.

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
Css / NPM
npm install efrolic
Css / CDN

Copy-paste the stylesheet <link> into your <head> before all other stylesheets to load our CSS.

<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/css/efrolic.min.css">
Css / GitHub

Copy-paste the stylesheet <link> into your <head> before all other stylesheets to load our CSS.

<link rel="stylesheet" href="https://efrolicss.com/assets/css/dist/efrolic.min.css">

Starter template

If you want to get started right away, you can use this HTML starter template. Just copy/paste this code in a file and save it on your computer.

<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Hello, world!</title>
    <!-- Font awesome icons -->
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
    <!-- Css -->
    <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/css/efrolic.min.css">
  </head>
  <body>
    <div class="e-container">
      <div class="e-box">
        <h1 class="e-title">Hello, world!</h1>
      </div>
    </div>
  </body>
</html>
Contribute on GitHub
Become a sponsor.

If you are using our framework in a product that generates income, you can also help its maintenance if you wish, if you frequently help in your company or personal developments consider making a recurring donation.

If you want to see your company's logo on this site it's time to be a serious Sponsor.

eFrolic | framework css 2019
eFrolic | framework css 2019

One-time donation


Donate
eFrolic | framework css 2019
eFrolic | framework css 2019

Serious sponsor


Become a Patron