1
0
mirror of https://github.com/Llewellynvdm/front-end-frameworks.git synced 2024-11-16 17:05:08 +00:00
front-end-frameworks/README.md

512 lines
17 KiB
Markdown
Raw Normal View History

2013-03-14 17:56:16 +00:00
Front-end Frameworks v2.6
2012-11-25 12:21:43 +00:00
====================
2013-06-24 12:11:47 +00:00
A collection of best front-end frameworks for faster and easier web development.
2013-02-24 06:00:42 +00:00
2013-06-24 12:11:47 +00:00
You can **Compare** all front-end frameworks here: http://usablica.github.com/front-end-frameworks/compare.html
2013-02-24 06:00:42 +00:00
2014-06-15 15:03:27 +00:00
## IceCream
> Simple and light responsive grid system
**Responsive:** Yes
**Website:** http://html5-ninja.com/icecream
## Formee Framework for forms
> Formee is nothing but a framework to help you develop and customize web based forms.
> Crossbrowser: Don't worry about having your form being rendered differently in the major browsers.
> Flexible:It fits into your project, it's flexible enough to adapt to the width you have available for the form.
> Customizable:You can easily change between a stylish form or a minimalist one. It comes with the basic needed for you to put your touch in it.
**Responsive:** No
**Website:** http://www.formee.org/
2012-11-25 12:28:33 +00:00
## 1kb grid
Other CSS frameworks try to do everything—grid system, style reset, basic typography, form styles. But complex systems are, well, complex. Looking for a simple, lightweight approach that doesn't require a PhD? Meet The 1KB CSS Grid.
**Responsive:** No
**Website:** http://www.1kbgrid.com/
## 52framework
With HTML5 support coming so fast, with the tiniest of hacks we are able to use it today in virtually al browsers. Using HTML5 makes for much cleaner mark up. This framework fully uses all the great advantages of HTML5.
**Responsive:** No
**Website:** http://52framework.com/
2014-07-12 01:35:14 +00:00
## Concise
> Lightweight, highly customizable, scalable, Sass-based, OOCSS framework. LESS and Stylus ports also available.
**Responsive:** Yes
**Website:** http://concisecss.com/
## Bootstrap
> Sleek, intuitive, and powerful front-end framework for faster and easier web development.
**Responsive:** Yes
**Website:** http://getbootstrap.com/
## 960 Grid System
2012-11-25 12:28:33 +00:00
> Simple grid system
The 960 Grid System is an effort to streamline web development workflow by providing commonly used dimensions, based on a width of 960 pixels. There are two variants: 12 and 16 columns, which can be used separately or in tandem.
2012-11-25 12:30:16 +00:00
2013-06-24 12:11:47 +00:00
**Responsive:** Yes
2012-12-05 22:09:42 +00:00
**Website:** http://960.gs/
2012-11-25 12:28:33 +00:00
## 99lime HTML KickStart
2012-11-25 12:41:39 +00:00
> UltraLean HTML Building Blocks for Rapid Website Production.
2012-11-25 12:41:39 +00:00
HTML KickStart is an ultralean set of HTML5, CSS, and jQuery (javascript) files, layouts, and elements designed to give you a headstart and save you 10's of hours on your next web project.
2012-11-25 12:41:39 +00:00
2013-06-24 12:11:47 +00:00
**Responsive:** Yes
2012-12-05 22:09:42 +00:00
**Website:** http://www.99lime.com/
2013-09-08 21:53:56 +00:00
## Baseline
2013-09-08 21:53:56 +00:00
> Baseline is a framework built around the idea of a “real” baseline grid.
2013-09-08 21:53:56 +00:00
Built with typographic standards in mind, Baseline makes it easy to develop a website with a pleasing grid and good typography. Baseline starts with several files to reset the browsers default behavior, build a basic typographic layout — including style for HTML forms and new HTML 5 elements — and build a simple grid system.
2013-09-08 21:53:56 +00:00
**Responsive:** No
2012-11-25 12:39:07 +00:00
**Website:** http://www.baselinecss.com/
2012-11-25 12:39:07 +00:00
## Blueprint
2012-11-25 12:39:07 +00:00
Blueprint is a CSS framework, which aims to cut down on your development time. It gives you a solid foundation to build your project on top of, with an easy-to-use grid, sensible typography, useful plugins, and even a stylesheet for printing.
2012-12-05 22:09:42 +00:00
**Responsive:** No
2012-11-25 12:39:07 +00:00
**Website:** http://www.blueprintcss.org/
2012-11-25 12:30:16 +00:00
## BlueTrip
2012-11-25 12:35:51 +00:00
A full featured and beautiful CSS framework which originally combined the best of Blueprint, Tripoli (hence the name), Hartija, 960.gs, and Elements, but has now found a life of its own.
2012-11-25 12:28:33 +00:00
**Responsive:** No
2012-12-05 22:09:42 +00:00
**Website:** http://bluetrip.org/
2012-11-25 12:28:33 +00:00
## Boilerplate
> noun standardized pieces of text for use as clauses in contracts or as part of a computer program.
As one of the original authors of Blueprint CSS Ive decided to re-factor my ideas into a stripped down framework which provides the bare essentials to begin any project. This framework will be lite and strive not to suggest un-semantic naming conventions. Youre the designer and your craft is important.
**Responsive:** No
**Website:** http://code.google.com/p/css-boilerplate/
2012-11-25 12:35:51 +00:00
## Cascade Framework
2012-11-25 12:35:51 +00:00
> Powerful OOCSS front-end framework optimised for performance and flexibility.
2012-11-25 12:35:51 +00:00
2013-06-24 12:11:47 +00:00
**Responsive:** Yes
2012-12-05 22:09:42 +00:00
**Website:** http://cascade-framework.com/
2012-11-25 12:35:51 +00:00
## Cascade Framework Light
2012-11-25 12:35:51 +00:00
> An even more lightweight version of Cascade Framework, containing just the bare essentials.
2012-11-25 12:35:51 +00:00
2013-06-24 12:11:47 +00:00
**Responsive:** Yes
2012-12-05 22:09:42 +00:00
**Website:** https://github.com/jslegers/cascadeframeworklight/
2012-11-25 12:35:51 +00:00
## Easy Framework
> Your new starting point for every front-end projects!
Easy is a CSS/HTML/JavaScript framework started as a personal project and then grew into something more. The idea behind it is to reduce the amount of time spent on setting up the basic master HTML template by reusing the same coding techniques.
**Responsive:** No
**Website:** http://easyframework.com/
## elastiCSS
2012-11-25 13:03:10 +00:00
A simple css framework to layout web-based interfaces, based on the printed layout techniques of 4 columns but with capabilities to unlimited column combinations. and capacity to make elastic, fixed and liquid layout easily
2012-11-25 13:03:10 +00:00
2013-06-24 12:11:47 +00:00
**Responsive:** No
2012-12-05 22:09:42 +00:00
**Website:** http://elasticss.com/
2012-11-25 12:35:51 +00:00
## Elements
2012-11-25 13:04:46 +00:00
> Elements is a down to earth CSS framework.
2013-06-24 12:11:47 +00:00
It was built to help designers write CSS faster and more efficient. Elements goes beyond being just a framework, its its own project workflow.It has everything you need to complete your project, which makes you and your clients happy.
2012-11-25 13:04:46 +00:00
2013-06-24 12:11:47 +00:00
**Responsive:** No
2012-11-25 13:07:08 +00:00
**Website:** http://elements.projectdesigns.org/
2012-11-25 13:07:08 +00:00
## Emastic
2013-06-24 12:11:47 +00:00
Emastic is a CSS Framework, its continuing mission: to explore a strange new world, to seek out new life and new web spaces, to boldly go where no CSS Framework has gone before.
2012-11-25 13:07:08 +00:00
2013-06-24 12:11:47 +00:00
**Responsive:** No
2012-12-05 22:09:42 +00:00
**Website:** http://code.google.com/p/emastic/
2012-12-06 12:19:42 +00:00
## FEM CSS Framework
2012-12-06 12:19:42 +00:00
FEM CSS Framework is a 960px width + 12 column grid system + CSS common styles, to easy and fast develop web layouts. It is based in the 960 Grid System, but with a twist in the philosophy to make it more flexible and faster to play with boxes.
2012-12-06 12:19:42 +00:00
2013-06-24 12:11:47 +00:00
**Responsive:** No
2012-12-06 12:19:42 +00:00
**Website:** http://www.frontendmatters.com/projects/fem-css-framework/
2012-12-06 12:19:42 +00:00
## Flaminwork
2013-06-24 12:11:47 +00:00
> The tiny front-end framework for lazy developers.
2012-12-06 12:19:42 +00:00
**Responsive:** No
2012-12-06 12:19:42 +00:00
**Website:** http://flaminwork.com/
2012-12-10 17:49:54 +00:00
## Fluid
2012-12-10 17:49:54 +00:00
The Fluid 960 Grid System templates have been built upon the work of Nathan Smith and his 960 Grid System using effects from the MooTools and jQuery JavaScript libraries.
2012-12-10 17:49:54 +00:00
2013-06-24 12:11:47 +00:00
**Responsive:** No
2012-12-10 17:49:54 +00:00
**Website:** http://www.designinfluences.com/fluid960gs/
2012-12-10 17:49:54 +00:00
## Foundation
2012-12-10 17:49:54 +00:00
> The most advanced responsive front-end framework in the world.
2012-12-10 17:49:54 +00:00
Foundation is built with Sass, a powerful CSS preprocessor, which allows us to much more quickly develop Foundation itself and gives you new tools to quickly customize and build on top of Foundation.
2013-02-24 22:09:58 +00:00
2013-06-24 12:11:47 +00:00
**Responsive:** Yes
2012-12-10 17:49:54 +00:00
**Website:** http://foundation.zurb.com/
## G5 Framework
> (X)HTML5, CSS3, PHP & jQuery Front End Framework.
G5 Framework started as a personal project. In an attempt to speed up workflow, reuse the best coding practices & similar coding techniques, the framework serves as a starter file for new websites.
2013-06-24 12:11:47 +00:00
**Responsive:** No
**Website:** http://framework.gregbabula.info/
## GroundworkCSS
A responsive framework with a fractional, semantic grid system built with Sass & Compass.
**Responsive:** Yes
**Website:** http://groundwork.sidereel.com/
## Gumby
Gumby is a responsive 960 grid CSS framework. The grid lets you lay out pages quickly and easily in a natural, logical way. The framework is packaged with tons of styles and common interface elements to help you quickly put together functional prototypes.
**Responsive:** Yes
**Website:** http://gumbyframework.com
2013-01-02 19:22:43 +00:00
## Helium
2013-01-02 19:22:43 +00:00
Helium is a framework for rapid prototyping and production-ready development. In many ways it's similar to both Twitter Bootstrap and ZURB Foundation - in fact, it uses bits of their code. Unlike either of these two frameworks, however, Helium is designed to be much more lightweight and easier to tinker with.
2013-01-02 19:22:43 +00:00
**Responsive:** Yes
2013-01-02 19:22:43 +00:00
**Website:** https://github.com/cbrauckmuller/helium
2013-01-02 19:22:43 +00:00
## Ink
2013-01-02 19:22:43 +00:00
> Ink is a set of tools for quick development of web interfaces.
2013-01-02 19:22:43 +00:00
It offers a fluid and responsive grid, common interface elements, interactive components, a design-first approach with ease of use and simplicity at its core. Start integrating Ink in your projects and remove the hassle of building the basics, staying free to focus on what's important.
2013-01-02 19:22:43 +00:00
**Responsive:** Yes
2013-01-02 19:22:43 +00:00
**Website:** http://ink.sapo.pt/
2013-01-02 19:30:42 +00:00
**Github:** http://github.com/sapo/ink/
2013-01-02 19:30:42 +00:00
## Kickoff
2013-01-02 19:30:42 +00:00
> A lightweight front-end framework for creating scalable, responsive sites
2013-01-02 19:30:42 +00:00
Kickoff is an actively maintained front-end framework, created by Zander Martineau and Ashley Nolan.
2013-01-02 19:30:42 +00:00
The framework is not meant to be too prescriptive - we don't want to force developers into a certain coding style - and so can be used as a starting point for any type of project.
2013-01-02 19:30:42 +00:00
**Responsive:** Yes
2013-01-02 19:30:42 +00:00
**Website:** http://tmwagency.github.io/kickoff/
2013-01-02 19:30:42 +00:00
**Github:** https://github.com/tmwagency/kickoff
2013-01-02 19:30:42 +00:00
## Kube
> CSS-framework for professional developers.
Minimal and enough. Adaptive and responsive. Revolution grid and beautiful typography. No imposed styles and freedom.
**Responsive:** Yes
**Website:** http://imperavi.com/kube/
## Layers
> Lightweight. Unobtrusive. Style-agnostic. Build your look on the web, not Twitter's and build it fluid.
Layers CSS is aimed for practical use and comes with zero bullshit.
**Responsive:** Yes
**Website:** http://eiskis.net/layers/
**Bitbucket:** https://bitbucket.org/Eiskis/layers-css/src/tip/source/layers/
## Less Framework
> An adaptive CSS grid system.
Less Framework is a CSS grid system for designing adaptive web­sites. It contains 4 layouts and 3 sets of typography presets, all based on a single grid.
**Responsive:** Yes
**Website:** http://lessframework.com/
## Lovely CSS Framework
2013-06-24 12:11:47 +00:00
> The Lovely CSS Framework is a simple and straight forward way to easily deploy an XHTML/CSS site.
Based on a simple 960px wide grid system, featuring multiple column layouts, and various pluggable add-ons.
2013-06-24 12:11:47 +00:00
**Responsive:** No
**Website:** http://code.google.com/p/lovely-css/
## Malo
> Malo is ultra small css library for building web sites.
Malo is ultra small css library for building web sites. It is meant to be structural base for small or medium web sites. Malo derives from its bigger brother Emastic CSS Framework.
2013-06-24 12:11:47 +00:00
**Responsive:** No
**Website:** http://code.google.com/p/malo/
## Materialize CSS
> Created and designed by Google, Material Design is a design language that combines the classic principles of successful design along with innovation and technology.
Google's goal is to develop a system of design that allows for a unified user experience across all their products on any platform.
**Responsive:** Yes
** Website:** http://materializecss.com
## PureCSS
> A set of small, responsive CSS modules that you can use in every web project, built by the YUI team at Yahoo!.
PureCSS is a collection of responsive 'drop-ins' built with - you guessed it! - pure CSS! The PureCSS website also has a skin builder on their website, so you're restricted by default colors no more.
2013-06-24 12:11:47 +00:00
**Responsive:** Yes
**Website:** http://purecss.io/
2013-02-24 04:50:48 +00:00
## Ribs
2013-03-15 17:25:59 +00:00
> The evolution of Skeleton: A Beautiful Boilerplate for Responsive, Mobile-Friendly Development.
2013-03-15 17:25:59 +00:00
Ribs is a modernised, maintained and feature rich fork of the original Skeleton framework.
2013-03-15 17:25:59 +00:00
**Responsive:** Yes
**Website:** https://github.com/nickpack/Ribs
2013-03-25 21:17:11 +00:00
## RÖCSSTI
2013-08-27 14:18:20 +00:00
RÖCSSTI is a CSS micro-framework which includes accessibility notions, typo settings, IE fixes, reusable classes, ect. It is the little brother of [KNACSS](http://www.knacss.com/). It also has LESS and Sass versions.
2013-03-25 21:17:11 +00:00
**Responsive:** Yes
2013-08-27 14:18:20 +00:00
**Website:** http://rocssti.nicolas-hoffmann.net/ & https://github.com/nico3333fr/ROCSSTI
2013-06-24 12:11:47 +00:00
## Semantic UI
2013-06-24 12:11:47 +00:00
> UI is the vocabulary of the web.
Semantic empowers designers and developers by creating a language for sharing UI.
2013-06-24 12:11:47 +00:00
2014-04-21 05:16:41 +00:00
Pure is ridiculously tiny. The entire set of modules clocks in at 4.5KB* minified and gzipped. Crafted with mobile devices in mind, it was important to us to keep our file sizes small, and every line of CSS was carefully considered. If you decide to only use a subset of these modules, you'll save even more bytes.
2013-06-24 12:11:47 +00:00
**Responsive:** Yes
**Website:** http://semantic-ui.com/
2013-10-29 12:06:18 +00:00
**Github:** https://github.com/jlukic/Semantic-UI
2014-04-21 05:16:41 +00:00
2014-04-21 05:25:21 +00:00
## Crumpet
> A Deliciously Simple SASS/SCSS Responsive Framework
Everything is straight forward, all of the code is commented and gives you instructions on how to use Crumpet, so you can spend all your time in the code editor.
**Responsive:** Yes
**Website:** https://github.com/AdamMarsBar/Crumpet
2014-04-21 05:13:30 +00:00
## Jeet
> A CSS Grid System for Humans
Jeet allows you to express your page grid the same way a human would describe it. No more needlessly nesting elements. No more rigid twelve column rules. Enjoy building faster with less code, and more flexibility with Jeet.
**Responsive:** Yes
**Website:** http://jeet.gs/
## Skeleton
2013-10-29 12:06:18 +00:00
> A Beautiful Boilerplate for Responsive, Mobile-Friendly Development.
Skeleton is a small collection of CSS files that can help you rapidly develop sites that look beautiful at any size, be it a 17" laptop screen or an iPhone.
2013-10-29 12:06:18 +00:00
**Responsive:** Yes
**Website:** http://www.getskeleton.com/
2013-10-29 12:06:18 +00:00
## The Golden Grid
The Golden Grid is a web grid system. It 's a product of the search for the perfect modern grid system. It 's meant to be a CSS tool for grid based web sites.
**Responsive:** No
**Website:** http://code.google.com/p/the-golden-grid/
## Unsemantic
Unsemantic is a fluid grid system that is the successor to the [960 Grid System](http://960.gs/). It works in a similar way, but instead of being a set number of columns, it's entirely based on percentages.
**Responsive:** Yes
**Website:** http://unsemantic.com/
## xCSS
> Object-Oriented CSS Framework
xCSS bases on CSS and empowers a straightforward and object-oriented workflow when developing complex style cascades. Using xCSS means a dramatic cut down to your development time by: having a intuitive overview of the overall CSS structure, using variables, re-using existing style cascades and many other handy features.
**Responsive:** No
2013-11-27 07:01:41 +00:00
**Website:** http://xcss.antpaw.org/
2013-11-27 07:01:41 +00:00
## YAML
2013-11-27 07:01:41 +00:00
> “Yet Another Multicolumn Layout” (YAML)
2013-11-27 07:01:41 +00:00
YAML is an (X)HTML/CSS framework for creating modern and flexible floated layouts. The structure is extremely versatile in its programming and absolutely accessible for end users.
2013-11-27 07:01:41 +00:00
**Responsive:** Yes
2013-12-12 06:28:42 +00:00
**Website:** http://www.yaml.de/
2013-12-12 06:28:42 +00:00
## YUI CSS
2013-12-12 06:28:42 +00:00
> Simple CSS for the web
2013-12-12 06:28:42 +00:00
The foundational YUI CSS is an extremely lightweight layer of responsive CSS for your projects. It offers a customizable responsive grid , along with styling for forms, tables, menus, popovers, notifications, images and more. Plays nice with YUI's JavaScript Framework.
2013-12-12 06:28:42 +00:00
**Responsive:** Yes
2013-12-12 06:28:42 +00:00
**Website:** http://yuilibrary.com/
2013-12-17 01:42:00 +00:00
## Susy
2014-04-21 05:16:41 +00:00
> Your markup. Your design. Our math.
2013-12-17 01:42:00 +00:00
The web is a responsive place, from your lithe & lively development process to your end-user's super-tablet-multi-magic-lap-phone. You need grids that are powerful yet custom, reliable yet responsive.
**Responsive:** Yes
**Website:** http://susy.oddbird.net/
**Github:** https://github.com/ericam/susy/
2014-01-03 09:29:03 +00:00
## inuit.css
2014-01-03 09:29:03 +00:00
> A powerful, scalable, Sass-based, [BEM](http://bem.info/), OOCSS framework.
inuit.css is a Sass based, Object Oriented framework that is full of objects and abstractions. inuit.css provides little-to-no design which means no undoing things, no deleting CSS and no adhering to other peoples design decisions.
2014-01-03 09:29:03 +00:00
**Responsive:** Yes
**Website:** http://inuitcss.com/
**Github:** https://github.com/csswizardry/inuit.css/
2014-01-02 05:36:18 +00:00
## Bijou
> A beautiful CSS framework under 2kb
A small, yet beautiful CSS framework that weighs in under 2kb.
**Responsive:** Yes
**Website:** http://andhart.github.io/bijou
**Github:** https://github.com/andhart/bijou
2013-12-13 04:32:46 +00:00
## bootmetro
2013-12-12 23:56:54 +00:00
2013-12-13 04:32:46 +00:00
> metro style web framework
2013-12-12 23:56:54 +00:00
2013-12-13 04:32:46 +00:00
simple and flexible web framework to create elegant and modern web applications with the same look & feel of Windows 8.
2013-12-12 23:56:54 +00:00
**Responsive:** Yes
2013-12-13 04:32:46 +00:00
**Website:** http://aozora.github.io/bootmetro/
2013-12-12 23:56:54 +00:00
2013-12-13 04:48:57 +00:00
**Github:** https://github.com/aozora/bootmetro
## StackLayout
> A flexible width, component based CSS layout system
StackLayout makes it incredibly easy to use semantic class names for particular areas of your site, such as the main navigation or a thumbnail gallery, or for the entire site as part of your deployment process.
**Responsive:** Yes
**Website:** http://www.stacklayout.com/
2013-12-13 05:59:22 +00:00
**Github:** https://github.com/camslice/StackLayout
## IVORY Framework
> imple, Flexible, Powerful
Responsive front-end web framework. Makes your front-end development faster and easier. Takes you all theway from 1200PX on down to 320PX.
**Responsive:** Yes
**Website:** http://weice.in/ivory/
**Github:** https://github.com/kanthvallampati/IVORY