Un Framework de CSS...

Fresh CSS es un framework de css responsive que te hará más fácil la labor de crear páginas web, enfocándote mas en el desarrollo de la web desde el back-end y dejando en segundo plano el diseño. ¡Descargalo gratis!

Get started

Sass

Creado totalmente sobre Sass para una mejor modulación del código, especial para los más experimentados.

Responsive

Fácil manejo de las clases responsivas para un mejor control de tu layout en distintos dispositivos (móvil, tablet y desktop).

Support

Fresh CSS está comprometido a una actualización constante, depurando y creando nuevos componentes y funciones.

Get started

Crea tu página web responsive en muy poco tiempo y con respaldo para todos los navegadores usando Fresh CSS Framework.

Fresh CSS te ayudará a crear una página web fácil y rápido, por lo menos en su estructura visual para dedicarte a el desarrollo back-end sin tener que luchar con el diseño de la web, o adaptarla para dispositivos móviles, pues, siempre ha sido un dolor de cabeza para el desarrollador meter una página web entera en una pantalla tan pequeña, con Fresh CSS Framework esto es muy fácil, bastaría sólo con agregar un par de clases a tu HTML.

En internet existen muchos frameworks de css para crear páginas web, algunos difíciles de implementar e incluso muy pesados, agregándole lentitud a tu sitio al cargar, algo que a Google definitivamente no le gusta. Fresh CSS es mucho más ligero, fácil de instalar y lo mejor, no rompe el layout en el caso de usar algún otro framework aparte.

Descarga la última versión de Fresh CSS, minificado para no perjudicar la carga de tu web, también puedes bajar la versión en Sass para mejor control de tus archivos.

HTML structure

Para instalar adecuadamente el Framework en tu web, usa la siguiente estructura HTML5, no deberías tener problemas.


  <!DOCTYPE html>
  <html lang="es">
    <head>
      <meta charset="utf-8">
      <title>Fresh CSS Framework</title>
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <!--CSS Fresh-->
      <link type="text/css" rel="stylesheet" href="assets/css/fresh.min.css" media="screen, projection">
      <!--Favicon-->
      <link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
    </head>
    <body>

      ...


      <!--JQuery CDN-->
      <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
      <!--Javascript Fresh-->
      <script src="assets/js/fresh.min.js"></script>
    </body>
  </html>

Uploaded version

El siguiente dialogo proporciona información sobre la versión que se encuentra Fresh CSS. Los nuevos componentes y funcionalidades añadidas se marcarán con la versión en la que fueron creados.

Files structure

La siguiente estructura te dará una idea de que contiene el framework en su versión básica y extendida en Sass para los más experimentados.


  <!--Basic version -->

  My-Web/
      |--blank.gif
      |--favicon.ico
      |--index.html
      |   |
      |   |
      |--assets/
      |   |
      |---css/
      |   |--fresh.min.css
      |   |
      |---fonts/
      |   |--roboto/
      |   |
      |---js/
      |   |--fresh.min.js

  <!--Sass version -->

  My-Web/
      |--blank.gif
      |--favicon.ico
      |--index.html
      |   |
      |   |
      |--assets/
      |   |
      |---css/
      |   |--fresh.min.css
      |   |
      |---fonts/
      |   |--roboto/
      |   |
      |---js/
      |   |--fresh.min.js
      |   |
      |---js_src/
      |   |--components/
      |   |--fresh.js
      |   |
      |---sass/
      |   |--components/
      |   |--fresh.sass