scratch.f7th.com

http://fronteed.com/iCheck/
SUPER CUSTOMIZED CHECKBOXES AND RADIO BUTTONS FOR JQUERY & ZEPTO

http://parsleyjs.org/
Parsley is a javascript form validation library. It helps you provide your users feedback on their form submission before sending it to your server. It saves you bandwidth, server load and it saves time for your user.

http://www.datatables.net/
DataTables is a plug-in for the jQuery Javascript library. It is a highly flexible tool, based upon the foundations of progressive enhancement, and will add advanced interaction controls to any HTML table.

http://drublic.github.io/css-modal/
CSS Modal is built out of pure CSS. It is optimized for mobile and built using accessibility in mind.

Styleable select elements built on Tether

http://github.hubspot.com/tether/
A client-side library to make absolutely positioned elements attach to elements in the page efficiently.

http://svgjs.com/
A lightweight library for manipulating and animating SVG.

http://usehook.com/
Hook is as simple as it gets for all kinds of users. From developers to novices, just follow the easy set of instructions and you’ll be Hooking in no time! Get started below.

http://haml.info/
Haml (HTML abstraction markup language) is based on one primary principle: markup should be beautiful. It’s not just beauty for beauty’s sake either; Haml accelerates and simplifies template creation down to veritable haiku.

http://amsul.ca/pickadate.js/
A mobile-friendly, responsive, and lightweight jQuery dateinput picker.

http://paulkinzett.github.com/toolbar/
A jQuery plugin that creates tooltip style toolbars. Toolbar allows you to quickly create tooltip style toolbars for use in web applications and websites. The toolbar is easily customisable using the twitter bootstrap icons and provides flexability around the toolbars display and number of icons.

http://www.idangero.us/sliders/swiper/
Mobile touch slider & framework with hardware accelerated transitions

http://www.smoothdivscroll.com/
Smooth Div Scroll is a jQuery plugin that scrolls content horizontally left or right.

http://css-button-generator.com/
CSS-button-generator.com make css button for your web (button cross browser)
Simply slide the bar to generate your css button.

http://colllor.com/
Color Palette Generator. With Colllor it is much easier to generate a consistent web color palette with just a few clicks. You should use colors consistently, so you have a common look and feel throughout your design. All the alternative proposals produced by Colllor derive from the same color and they all have a common denominator sharing hue, lightness or saturation values. This tool will let you find the exact value of darker shades of any color, not just something that ‘looks darker’. That will be a huge step towards professionally looking design.

http://jquery-jkit.com/
A very easy to use, cross platform, jQuery based UI toolkit, that’s still small in size, has the features you need, and doesn’t get in your way of doing things!

http://jhough10.github.com/Centurion/
Built using SASS and CSS3 media queries, Centurion is a responsive web framework that scales with your device. No longer do you need to worry about the screen size of an iPhone or an Android tablet since Centurion does the work for you.
Want to test Centurion out simply fork or download the repository on Github to get started and see the power a responsive framework can have on your next web project.

http://reuze.me
Reuze is a teeny-tiny front end framework that makes structuring HTML and CSS for mid-to-large sized content-rich sites a breeze. It plays nice with other frameworks such as Foundation and Boostrap but also works equally well on it’s own.
Quickly create semantic HTML5 code blocks that conveniently sit in ‘namespaced’ containers (‘.ac’ for article content as an example) and download the accompanying 10KB (or less) of CSS awesomeness from Github. It’s responsive, IE8-friendly and topped up with RDFa Lite goodness!

http://thisisdallas.github.com/Simple-Grid/
Simple Grid was created for developers who need a barebones grid. Simple Grid works well with 1140px layouts but easily adapts to any size of layout. With fluid columns, Simple Grid is responsive down to mobile.

http://build-podcast.com/
Build podcast is a show about technology tools for design and development. Each week, Sayanee will be creating a screencast that will take you through step-by-step in using one tool to build a little project, all in the fun spirit of hacking, creating and building stuff!

http://tinybigideas.com/plugins/jquery-gravity/
jGravity adds gravity to either all or specified elements within a page. Using the plugin is as easy as $(‘body’).jGravity(); which will use default settings to apply the gravity effect, which I think you will find quite similar to how Google presented ‘Google Gravity’ in an earlier Google easter egg.

http://yconst.com/web/freetile/
Freetile is a plugin for jQuery that enables the organization of webpage content in an efficient, dynamic and responsive layout. It can be applied to a container element and it will attempt to arrange it’s children in a layout that makes optimal use of screen space, by “packing” them in a tight arrangement. Freetile has been the layout engine behind Assemblage and Assemblage Plus for almost two years, and now it becomes available as an independent Open Source project.

http://blueimp.github.com/jQuery-File-Upload/
File Upload widget with multiple file selection, drag&drop support, progress bars and preview images for jQuery.
Supports cross-domain, chunked and resumable file uploads and client-side image resizing.
Works with any server-side platform (PHP, Python, Ruby on Rails, Java, Node.js, Go etc.) that supports standard HTML form file uploads.

http://pnggauntlet.com/
PNG compression app for Windows. Uses PNGOUT, OptiPNG, and DeflOpt to create the smallest PNGs, without sacrificing any image quality.

https://github.com/jschr/bootstrap-modal/
http://jschr.github.com/bootstrap-modal/
Extends Bootstrap’s native modals to provide additional functionality. Introduces a ModalManager class that operates behind the scenes to handle multiple modals by listening on their events.

http://unheap.com

http://angularjs.org
AngularJS lets you write client-side web applications as if you had a smarter browser. It lets use good old HTML (or HAML, Jade and friends!) as your template language and lets you extend HTML’s syntax to express your application’s components clearly and succinctly. It automatically synchronizes data from your UI (view) with your JavaScript objects (model) through 2-way data binding. To help you structure your application better and make it easy to test AngularJS teaches the browser how to do dependency injection and inversion of control. Oh yeah and it also helps with server-side communication, taming async callbacks with promises and deferreds; and make client-side navigation and deeplinking with hashbang urls or HTML5 pushState a piece of cake. The best of all: it makes development fun!

http://phildionne.github.com/golden-bootstrap/
Golden Bootstrap is a bunch of less written css rules giving you the divine power of using golden ratio sized columns with Bootstrap.

http://minimal.be/lab/Sprite3D/
a small library for generating and manipulating CSS 3D transforms

http://srobbin.com/jquery-plugins/backstretch/
a simple jQuery plugin that allows you to add a dynamically-resized, slideshow-capable background image to any page or element

http://lesstester.com/

http://baconforme.com/

http://www.jqmobi.com/
a lightweight (5k) query selector library with over 60 api calls and jQuery compatible syntax.

http://colllor.com/
Web color palette the right way. Create consistent color schemes. Generate color shades, tones and tints values.

http://bootswatch.com/

http://www.oesmith.co.uk/morris.js/
Making good-looking graphs shouldn’t be hard. Morris.js is a lightweight library that uses jQuery and Raphaël to make drawing simple charts easy.

http://kineticjs.com/
KineticJS is an HTML5 Canvas JavaScript framework that enables high performance animations, transitions, node nesting, layering, filtering, caching, event handling for desktop and mobile applications, and much more.

http://cssgrid.net/
The 1140 grid fits perfectly into a 1280 monitor. On smaller monitors it becomes fluid and adapts to the width of the browser.
Beyond a certain point it uses media queries to serve up a mobile version, which essentially stacks all the columns on top of each other so the flow of information still makes sense.
Scrap 1024! Design once at 1140 for 1280, and with very little extra work, it will adapt itself to work on just about any monitor, even mobile.

http://blog.kojo.com.au/flickable-zepto-plugin/
The plugin allows you to make any element touchable; useful for flicking between sections, or sliding elements around the page.

http://www.turnjs.com
Turn.js is a plugin for jQuery that adds a beautiful transition similar to real pages in a book or magazine. It works in all modern browsers including touch devices.

http://www.yaml.de/
Yet Another Multicolumn Layout (YAML) is a modular CSS framework for truly flexible, accessible and responsive websites.

https://github.com/benkeen/responsive-design-bookmarklet-generator
http://www.benjaminkeen.com/open-source-projects/smaller-projects/responsive-design-bookmarklet/
This is a simple script that lets you view any webpage in multiple screen sizes, simulating the viewport of different devices. It works by generating a custom bookmarklet containing whatever screen dimensions you’re interested. You can then just click the bookmark to view any current webpage in a variety of sizes. Simple!

This was inspired by, and based on @lensco‘s excellent Simple Responsive Design Test Page. It lets you view any webpage in multiple screen sizes, simulating the viewport of different devices. After getting such a positive response to my original script, I thought I’d expand on it a little. Since people are obviously targeting different device screen sizes with their projects, the form below now lets you generate a custom bookmarklet that displays only those device sizes you’re interested in.
A big thanks to Alaska Airlines for the delayed flight that made this possible, and the really boring project that I know I should be working on, but can’t find the motivation. Urgh.

http://davatron5000.github.com/deCSS3/

http://www.colorhexa.com/
ColorHexa.com is a free color tool providing information about any color. Just type any color values (view full list here) in the search field and ColorHexa will offer a detailed description and automatically convert it to its equivalent value in Hexadecimal, Binary, RGB, CMYK, HSL, HSV, CIE-Lab, Hunter-Lab, CIE-Luv, CIE-LCH, XYZ and xyY. ColorHexa will also generate matching color schemes such as complementary, split complementary, analogous, triadic, tetradic and monochromatic colors. So you will be able to know what colors best suit with the one you chose. It is also possible to blend colors together or create a gradient between them (see examples below).

http://meltingice.github.com/psd.js/

http://www.iscriptdesign.com/

http://mocku.ps/
Mocku.ps is the ideal tool for designers to present and share their mockups. Precisely.

http://bakerframework.com/
Baker is an HTML5 ebook framework to publish on the iPad using open web standards.

http://html5please.com/
Look up HTML5, CSS3, etc features, know if they are ready for use, and if so find out how you should use them – with polyfills, fallbacks or as they are. When Can I Use tells you the browser support story, while Modernizr gives you the power of feature detection. HTML5 Please helps you out with recommendations for polyfills and implementation so you can decide if and how to put each of these features to use.

http://color.method.ac/