WebAppers

/ best free open source web resources /

Shopify

Create HTML5 Digital Publications with Laker

Posted · Category: Information, License Free

Laker is a compendium of files, styles and tips for designing digital publications in HTML5. This development guide shall help you solving some of the common problems when designing and building a digital publication with HTML5. It provides you with all information about files, scripts, styles etc. used in Laker.

Laker uses a customized version of the “Baker ebook framework” for producing an iOS app. It basically reads a bunch of HTML files and displays them one after another. Designing pages and adding interactivity is all done in HTML5. That makes it more accessible and cheap to develop, because you do not need any proprietary software.

html5-publications

Requirements: -
Demo: http://www.lakercompendium.com/
License: License Free

WhatFont Tool Bookmarklet and Chrome Extension

Posted · Category: Fonts, License Free, Tools

What is the easiest way to find out the fonts used in a webpage? Firebug or Webkit Inspector? No, that’s too complicated. It should be just a click away.

WhatFont Tool can easily get font information about the text you are hovering on. There is a Bookmarklet and Chrome Extension available for download. I am sure it will make web designer’s life much easier.

what-font-used

Requirements: -
Demo: http://chengyinliu.com/whatfont.html
License: License Free

Beautiful Subtle Patterns Free for Download

Posted · Category: CC License, Patterns

Do you need some tasty, high quality website background patterns for your next web project? Atle Mo from Subtle Patterns made us 12 beautiful subtle patterns free for download.

You can also check the result of each pattern by clicking the “Preview” button. They are all licensed under a Creative Commons Attribution 3.0 Unported License.

subtle-patterns

Requirements: -
Demo: http://subtlepatterns.com/
License: Creative Commons License

Convert Elements into Mini Canvas Charts with jQuery

Posted · Category: Charts, MIT License

Peity is a simple jQuery plugin that converts an element’s content into a simple mini canvas pie, line or bar chart. It works on any browser that supports <canvas>: Chrome, Firefox, Opera, Safari. Peity also adds a “change” event trigger to your graph elements, so if you update their data your can regenerate one or more charts by triggering change() on them.

peity-jquery4

Requirements: jQuery Framework
Demo: http://benpickles.github.com/peity/
License: MIT License

A Toolset For Managing Screen Resolutions

Posted · Category: License Free, Tools

With the increasing demand for unique mid-screen devices, it is becoming an even more arduous task to keep all of the device resolutions and screen sizes straight. So Punchcut has packaged up their Toolset For Managing Screen Resolutions, that help them stay current and they are offering it for download.

It contains a collection of Photoshop CS5 marquee-tool presets for common screen resolutions. These cover both fixed-screen resolution sizes and ratios for less common resolutions that fall within standard ratios. It also contains a collection of layered Photoshop CS5 PSDs each providing common devices for comping and design presentations.

screen-resolutions

Requirements: -
Demo: http://punchcut.com/perspectives/expanding-universe-toolset…
License: License Free

39 CSS3 Box Shadows Effect for Google Chrome

Posted · Category: Information, License Free

Box-shadow is a pretty powerful property in modern browsers. With just six little values, you can make some really neat stuff. How much neat stuff, you ask? The result is 39 Ridiculous Things To Do With CSS3 Box Shadows that, due to whatever issues, can only be viewed in Chrome 11 or better.

You can navigate with the arrow keys, and he has moved the CSS for each object into the object HTML, which should make it easier to look at particular effects.

css3-box-shadow

Requirements: Chrome Browser
Demo: http://www.viget.com/uploads/file/boxshadows/
License: License Free

HTML5 Music & Audio Solutions for jQuery

Posted · Category: GPL License, License Free, Sound

Speakker is a crossbrowser Audio solution featuring HTML5. It comes out of the box in two variations and with incredible options of customization: Flexible dimensions, unlimited colors and two different button sets for light and dark themes. Easy to set up. Just a few lines of Javascript and a quantum CSS.

speakker

You can also check out HTML5 Music Portfolio Template with jQuery. The idea is to create an artist portfolio with a discography line up and HTML5 audio player jPlayer. The artist albums are shown using the jCarousel plugin and the user can add song samples to the play list and reorder the songs by dragging them.

music-portfolio-jquery

Requirements: jQuery Framework
Demo: http://www.speakker.com/demo/
License: GPL License
Demo: http://tympanus.net/Development/MusicPortfolioTemplate/
License: License Free

CSS3 Image Gallery with 3D Lightbox Animation

Posted · Category: Gallery, License Free

Having been inspired to get ‘Hardboiled’, Tom Kenny has started playing around with a few cool techniques and exploring how to make the content accessible in less capable browsers while giving the best possible experiences to the ones that support the latest advancements in CSS.

He has Create a CSS3 Image Gallery with a 3D Lightbox Animation by taking Benjamin’s CSS lightbox gallery and built upon by adding a few hover effects for the gallery grid itself and a 3D rotation for the lightbox content, all with the use of CSS.

css3-3d-gallery

Requirements: jQuery Framework
Demo: http://inspectelement.com/demos/css3/3dgallery/
License: License Free

The 1140 CSS Grid 12 Columns Fluid Down to Mobile

Posted · Category: CC License, Framework

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.

It works perfectly in Chrome, Safari, Firefox, IE7 & IE8. And it has been tested on MacBooks, an iMac, a PC laptop, an old PC, an Eee PC, an iPad, an iPhone 3G, an iPhone 4, a few Android phones, a Samsung Galaxy Tab, a BlackBerry and an older Nokia.

1140-css-grid

Requirements: -
Demo: http://cssgrid.net/
License: Creative Commons License

Apprise: Attractive Alert and Dialog Box for jQuery

Posted · Category: CC License, Popup

Apprise is an alert alternative for jQuery that looks good. Apprise is a very simple, fast, attractive, and unobtrusive way to communicate with your users. Also, this gives you complete control over style, content, position, and functionality.

Apprise is, more or less, for the developer who wants an attractive alert or dialog box without having to download a massive UI framework. It has been tested on Chrome 8.0+, Firefox 3.0+, Safari 4.0+, Internet Explorer 9.0.

alert-jquery

Requirements: jQuery Framework
Demo: http://thrivingkings.com/apprise/
License: Creative Commons License

Page 1 of 3123»
Supported By

Deals

Web Browsers Icon Set
Food Icon Set
Flat Icon Set

Flat Icon Set

100 icons