All posts tagged “Bootstrap”

10 Lightweight Alternatives To Bootstrap & Foundation

Choosing the right framework that is the perfect fit for your projects could be a little bit overwhelming – there are a lot to choose from. Perhaps, you want to go with popular choices like Bootstrap or Foundation, but if your website is going to be a fairly simple one, you won’t be needing most of the building blocks and materials included in the default package.

The good news is that there are a handful of alternatives that are much leaner than Bootstrap or Foundation. Most of these frameworks ship with just the right amount of styles and components to help you get started, while allowing you to be able to extend them in the direction you want for your project.

Here are 10 lightweight alternatives to Bootstrap and Foundation that you should use for building smaller-scale websites.

More on Hongkiat.com:

1. Skeleton

Skeleton has finally gotten a facelift. It’s a total revamp from the ground up, and yet it is still as light as it used to be. The new Skeleton grid system now adopts mobile-first philosphy, which ensures that the layout takes center stage regardless of how small the device screen is.

All components that were included in the earlier version – buttons, forms and input elements – are still present but basic typography styles are now set in rem unit.

2. CardinalCSS

CardinalCSS is a CSS framework built with a focus on performance, readability and most importantly maintainability. CardinalCSS adopts some modern approaches such as mobile-first for shaping up the grid; and CSS Box Model that allows you to easily determine element width and height.

CardinalCSS also comes with a handful of helper classes that allow you to quickly apply styles upon an element, for example, the drop-cap which applies the drop-cap effect for the first character in the paragraph.

3. ConciseCSS

ConciseCSS is a CSS framework – without the bloat. It is a lean framework built on top of Sass, LESS, and Stylus which paves its golden path to CSS maintainability. But, if you prefer plain simple vanilla CSS, you can have that as well.

Similarly, ConciseCSS also comes with base styles for essential elements such as the headings, paragraphs, tables, forms, and a set of helpers class to create button UI.

4. PowertoCSS

PowertoCSS is lightweight and a solid frontend framework. Class names that are used to build the grid and apply styles are simple and easy to remember e.g. .button. You can also add your own theme. Head over to their StarterKit to get started.

5. Furtive

Furtive is a mobile-first CSS framework built around the cutting-edge web standards like the use of Flexbox for the grid and rem unit for sizing elements (including font size). Furtive retains a small CSS footprint by not supporting older browsers (*cough* Internet Explorer) since they require some CSS hacking. Hence Furtive is a perfect framework if you are designing a website for the future.

6. BassCSS

BassCSS offers a lightweight set of base element styles, utilities, layout and color styles, in modular form for buildilng a responsive web application. The SCSS files are included to customize the style easily. You can play with typography, white space, breakpoints, and UI elements.

7. Mueller

Mueller is a modular responsive grid system built on top of Sass and Compass. With Mueller, you can build the grid either by adding classes straight to the HTML elements, or if you prefer your HTML elements to be neat and clean, using the grid() function. Mueller grid can be used in tandem with the Masonry Javascript library to create a Pinterest-like layout.

8. Tuktuk

Tuktuk is a very unique name for a framework. Compared to Bootstrap or Foundation, Tuktuk is much lighter as it only comes with just the proper amount of components to build a presentable website including for the grid system, basic styling for typography, tables, and a couple of UI like navbar and modals.

9. Base

Base is built on top of LESS and Sass, and it includes only the most essential of components to build websites: the grid and the basic styling of HTML elements. Base does not come with Javascript components, yet it provides great browser compatibility so much so that it works even with IE7.

10. Toast

The last of our list is Toast. Through the SCSS stylesheet is included in the package, Toast allows you to easily configure the grid class names, the gutter, and even the column-base. For example, if you want the grid to be a 9-base column instead of 12, you can do that. Toast is a minimal CSS framework with very flexible configurations catered to meet your requirements.





hongkiat.com

11 Bootstrap UI Editors For Developers

Many skilful people are involved in the web development industry to meticulously design and develop websites that can suffice the prime notions and requirements. Web development field is a massively growing technology and with its advent, it has been considered as a full time profession and professionals all across the globe are excelling in it. Such professionals work day and night and designed numerous toolkits to customize the framework to furnish an easy platform.

In this post, we are sharing with you some of the best Bootstrap UI editors that can help you achieve astonishing results in customizing framework flawlessly. Do let us know what do you think about this compilation. Feel free to share your opinions and comments with us via comment section below.

Layoutit

Create your frontend code simple and quickly with Bootstrap, using our Drag & Drop Interface Builder.

Bootply

A free Bootstrap editor and builder that also includes Bootstrap snippets, templates and examples using Javascript, CSS, HTML5 and jQuery.

Kickstrap

Kickstrap seamlessly combines Bootstrap with top-tier web technologies. It’s so advanced, it can run an authenticated, database-driven web app without a native backend.

Lavish Bootstrap

Generate your own Bootstrap color scheme from an image and customize to your taste.

Bootswatchr

BootSwatchr is the only Bootstrap customizer to support Right-To-Left language display. This feature is not included in any version of Bootstrap.

Pingendo

The simplest app to prototype with Twitter Bootstrap 3. For free.

Paintstrap

Generate beautiful Twitter Bootstrap themes using the Adobe kuler / COLOURlovers color scheme.

Bootstrap Live Editor

A WYSIWYG Editor built for Bootstrap. It offers a nice and elegant way to edit and beautify html with Bootstrap ready content/snippets.

Bootstrap Magic

Awesome features like contextual typeahead and colorpicker help you make your custom bootstrap 3.1 themes quickly and easily.

Style Bootstrap

Create unique web design with Twitter Bootstrap. Kw: themes, templates, styles. generator. customize.

Bootsnipp

Design elements, playground and code snippets for Bootstrap HTML/CSS/JS framework.


SmashingApps.com

Master the Bootstrap framework with this bundle of 6 courses

Read more about Master the Bootstrap framework with this bundle of 6 courses at CreativeBloq.com


Making a product for the web? Then you’re going to want to be familiar with Bootstrap, the UI framework that is widely used and counted on by some of the biggest and best sites around. You can join the ranks by learning your way around the framework with the Big Bootstrap Bundle, on sale for just $ 39.




Creative Bloq

10 Beautiful Bootstrap Admin & Dashboard Themes

Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile-first projects on the web. Bootstrap helps you kickstart the development of webapps and websites. In this…

For full article and other interesting tech related stuff visit the website.
SkyTechGeek

8 Free Bootstrap Admin Templates

In today’s post, we are presenting 8 free to use bootstrap admin templates for you. There are plenty of free bootstrap admin templates available on the internet that you can download and install for free, and we have collected 8 best out of them. These themes will go in line with your website themes and can save your valuable time and resources.

Check them out and pick the ones you like the best. We hope that you will like this collection and find these amazing bootstrap admin templates useful for you. Feel free to share your opinions with us via comment section below. Your comments are always more than welcome. Let us have a look. Enjoy!

SB Admin

( Demo | Download )

Bootstrap Metro Dashboard

( Demo | Download )

Hierapolis

( Demo | Download )

Charisma

( Demo | Download )

Blue Nile Admin

( Demo | Download )

Free Bootstrap Admin Theme

( Demo | Download )

Free Twitter Bootstrap Admin Theme

( Demo | Download )

Bootstrap admin template: Metis free download

( Demo | Download )


SmashingApps.com

10 Beautiful Bootstrap Admin & Dashboard Themes

Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile-first projects on the web. Bootstrap helps you kickstart the development of webapps and websites. In this…

For full article and other interesting tech related stuff visit the website.
SkyTechGeek

Bootstrap 3: The Grid System and Media Queries

Day after day lots of people for the first time in their life start using Bootstrap. Today we’d like to offer the Bootstrap 3 grid system guide.
MonsterPost

37 Free Bootstrap Joomla Themes

For today’s round up, we have chosen 37 best Bootstrap Joomla themes that not only will enliven your Bootstrap but will also be useful for your business as well. Creating a theme by yourself without specific knowledge and years of practice is not possible, but this does not mean that you cannot get a custom made theme. There are plenty of established template providers that provide high quality, professional looking custom made themes that you can order.

Scroll through our wonderful collection and be inspired as well. Do let us know what you think about this compilation. Feel free to share your opinions and comments with us via comment section below. Have fun!!

JSN Metro

( Demo | Download )

TechnoWeb

( Demo | Download )

Smart Tech

( Demo | Download )

Avatar Vincent

( Demo | Download )

AT Nine

( Demo | Download )

ProDecor

( Demo | Download )

AT Tahoma

( Demo | Download )

Software Development Company

( Demo | Download )

Purity III

( Demo | Download )

Magazine

( Demo | Download )

ST Hexagon – clean professional

( Demo | Download )

JSN Corsa

( Demo | Download )

Favourite

( Demo | Download )

Jsn Venture

( Demo | Download )

AT Nine Flat

( Demo | Download )

JSN SKY

( Demo | Download )

JSN AIR

( Demo | Download )

Ashton

( Demo | Download )

JSN Ares

( Demo | Download )

ST AV

( Demo | Download )

Meet Gavern

( Demo | Download )

RT Afterburner 2

( Demo | Download )

Design Control

( Demo | Download )

ST Deep

( Demo | Download )

ST Blog

( Demo | Download )

Free Joomla Template

( Demo | Download )

JF CALLA EXTERIORS

( Demo | Download )

JM Business Marketing

( Demo | Download )

JSN YOYO

( Demo | Download )

ST Tyneo

( Demo | Download )

Td Corcha Free

( Demo | Download )

ST Business

( Demo | Download )

Vertis

( Demo | Download )

JSN PIXEL

( Demo | Download )

Cleartex Free

( Demo | Download )

JSN Megazine Free

( Demo | Download )

Obmicon 2 Green

( Demo | Download )


SmashingApps.com

38 Useful Responsive Bootstrap Templates, Skins And Resources

For today’s assortment, we have decided to showcase some of the useful bootstrap templates for you. All the templates presented in this collection are free to use and they can be used for any web projects, especially if the projects are linked with Joomla or WordPress. All these templates are responsive and compatible with almost all types of devices. With these templates, you can easily create responsive website without any hassle.

Check them out and pick the ones you like the best. We hope that you will like this collection and find these amazing responsive bootstrap templates useful for you. Feel free to share your opinions with us via comment section below. Your comments are always more than welcome. Let us have a look. Enjoy!

Grayscale

A free, premium quality, responsive one page Bootstrap theme created by Start Bootstrap.

Charisma Free, Responsive, Multiple Skin Admin Template

Charisma is a fully featured, free, premium quality, responsive, HTML5 admin template (or backend template) based on Bootstrap from Twitter, it comes with 9 different themes to suit your style and application type.

Roots Theme

WordPress starter theme based on HTML5 Boilerplate & Bootstrap.

Mamba

Mamba is a simple & flat one page Bootstrap template, suitable for creative to build their profile.

Piccolo – A Free Bootstrap HTML Theme

Piccolo is a Bootstrap HTML theme. It features a simple and clean design. The theme includes 19 different page layouts with sliders, sortable galleries, lightbox popups, alerts, icons and much more.

Harbour a Flat Portfolio Responsive Web Template

Harbour is a personal portfolio that comes with a free Flat Responsive web design template. You can use this template for any type of website.

Fore

A Free Responsive Site Template From Papaya.

Showpage

Showpage is a simple and fast solution to put your project online and have a web presence.

My Kingdom

My Kingdom Minimalistic is a Flat Corporate Responsive web design template that can be used for any kind of company web and mobile websites.

Landing Page

A free, stylish, and simple landing page HTML starter template theme for Bootstrap – Up to date for Bootstrap 3!

StockDocs

StockDocs, a FREE HTML template for creating software documentation. StockDocs is designed with the objective to provide a simple, clean and responsive HTML template that can be used to develop all sort of documentation for software products.

TemplateVamp

Based on Twitter Bootstrap, TemplateVamp is a fully functional and customizable admin template that leverages the power and flexibility of HTML5 & CSS3.

Detox

Detox is a beautiful, modern Ghost theme.

Prologue

This is Prologue, a simple, single page responsive site template. It features a clean, minimalistic design and a sticky sidebar with navigation-linked scrolling.

SB Admin 2

A Free Bootstrap Admin Theme.

Landy

A flexible one-page fully responsive HTML template for your app.

Simple Responsive Template

Simple Responsive Template is a FREE template for responsive web design. A small set of tools and best practices that allows web designers to build responsive websites faster.

Responsive Template built with Twitter Bootstrap

It’s a responsive agency/portfolio HTML template named Andia and built with Twitter Bootstrap. Andia comes with 5 fully responsive pages, Home, Portfolio, Services, About, Contact and it’s perfect for creating a website for a small business or a personal portfolio. – See more at: http://azmind.com/2012/12/28/free-html-template-andia-responsive-agency-portfolio-template-twitter-bootstrap/#sthash.4S2QussZ.dpuf

Tessellate

Tessellate is a free responsive site template.

Fitness Time

One platform for static web hosting and Bootstrap Builder for single page apps. CDN, SSL, and pushState support with amazing developer and CLI tools.

WP-Bootstrap

A WordPress theme based on Twitter Bootstrap development toolkit. Developed by 320press.

Bootstrap 0.9.3

Raw Atom theme built around Twitter Bootstrap CSS framework.This one uses the Atom 2.0 core, which is in beta stage. So back-up your theme settings before doing upgrades, because most likely you will loose them, as they are not final.

Bootstrap Page

Download free twitter bootstrap templates for you personal and business use.

Twitter Bootstrap Button Generator

Twitter Bootstrap Button Generator – the easiest way how to set up your buttons based on Twitter Bootstrap in a seconds.

Treviso

Overflow

Caprice

Shop

Zeences Dark – Free HTML Template

Picku – Free HTML Template

Flat Single Page Website

Freebix – Free Responsive HTML Template

Big Picture

Beautiful Buttons for Twitter Bootstrappers

Bootstrap theme for WordPress

StrapPress

X-editable

Grid Displayer For Twitter Bootstrap and Foundation


SmashingApps.com

40 Extensions And Plugins For Extending Bootstrap

Although, Bootstrap itself is full of many useful tools and extensions that make it further useful for the users, and all the already available resources are more than enough to kick start most web project, yet we sometimes need certain plugins or extensions for extending Bootstrap.

For this purpose, we have put together 40 most useful extensions, addons and plugins for extending Bootstrap. This extended list will help you in the time where the basic components are not quite enough for what you need. Here is the full collection after the jump. We hope that you would like this compilation. Feel free to share it with others as well. Have a look and enjoy!

Bootstrap Calendar

Full view calendar with year, month, week and day views based on templates with Twitter Bootstrap.

Bootstrap Modal Carousel

A set of plugins to display a carousel into a fullscreen modal box.

Css3 Microsoft Metro Buttons

My CSS3 library for making Microsoft-metro themed buttons.

Bootstrap Prompts

BootStrap Alert with modal instead of Browser alert.

Pretty Checkable

This plugin replaces the default checkboxes and radio inputs for better looking ones.

Jquery Simplecolorpicker

Yet another jQuery color picker. This plugin is unobtrusive and integrates well with Twitter Bootstrap (it works just fine without).

Bootstrap Combobox

A combobox plugin that works with twitter bootstrap.

Bootstrap Datepicker

A Date Range Picker for Bootstrap

Clockpicker

A clock-style timepicker for Bootstrap (or jQuery).

Bootbox

Wrappers for JavaScript alert(), confirm() and other flexible dialogs using Twitter’s bootstrap framework.

Jquery Gridform

jQuery-Plugin for creating complex forms (table-based) with usage of bootstrap and (optional) Font-Awesome.

JqBootstrap Validation

A JQuery validation framework for bootstrap forms.

Table clothjs

A CSS and JS bootstrap to style and manipulate data tables.

Bootstrap Navigable Table

A Bootstrap plugin for elegant navigating along table inputs.

Bootstrap Confirmation

Javascript plug-in for Twitter bootstrap. Require JQuery and Bootstrap-Tooptip.js to run. This is in Beta state.

jQuery File Upload Demo

File Upload widget with multiple file selection, drag and drop support, progress bar, validation and preview images, audio and video for jQuery.

Bootstrap Image Gallery

Bootstrap Image Gallery is an extension to blueimp Gallery, a touch-enabled, responsive and customizable image and video gallery.

X-editable

In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery.

jQDraw Bootstrap Grid

A simple jQuery plugin that draws grid columns to a twitter bootstrap enabled layout.

Bootstrap Magnify

Small bootstrap js plugin to enhance porte-folios and image galleries.

Bootstrap Markdown

Bootstrap plugin for markdown editing.

Bootstrap Modal

Extends the default Bootstrap Modal class. Responsive, stackable, ajax and more.

Bootstrap Scroll Modal

A modification of the Twitter Bootstrap Modal plugin – allows for any height modal with full page scrolling of said modal.

MetisMenu

Easy menu jQuery plugin for Twitter Bootstrap 3.

Bootstrap Contextmenu

Context menu plugin for Twitter’s Bootstrap framework.

Jquery Bootpag

This jQuery plugin helps you create dynamic pagination with Bootstrap or in any other html pages.

Twbs Pagination

Bootstrap Social

Social Buttons made in pure CSS based on Bootstrap and Font Awesome!

Bselect

The select decorator component that was missing for Twitter Bootstrap.

Bootstrap Multiselect

Bootstrap Multiselect is a JQuery based plugin to provide an intuitive user interface for using select inputs with the multiple attribute present.

Bootstrap Multisuggest Plugin

Bootstrap Tags

Bootstrap Tags is a jQuery plugin meant to extend Twitter Bootstrap to include tagging functionality.

Tocify

A jQuery Table of Contents plugin that can be themed with Twitter Bootstrap or jQueryUI.

Tokenfield

Tabcordion

A jQuery plugin that transforms Bootstrap tabs to an accordion and vice versa. Useful for responsive mobile sites.

Bootstrap Tabcollapse

Bootstrap Tab Collapse plugin. Switches bootstrap tabs component to collapse for small screens.

Easy Tree

A jquery and bootstrap basic tree view plugin, easily use.

BootstrapTreeNav

Tree navigation plugin for Twitter Bootstrap 3.0

Bootstrap Tour

Quick and easy product tours with Twitter Bootstrap Popovers.


SmashingApps.com