WebAppers

/ best free open source web resources /

Graphic Resources

Reveal CSS Animation as You Scroll Down a Page

Posted · Category: MIT License, Tools

WOW.js reveals CSS animation as you scroll down a page. By default, you should use it to trigger animate.css animations, but you can easily change the settings to your favorite animation library.

It’s easily customizable, you can change the animation settings like style, delay, length, offset, iterations and etc. It’s fast execution with lightweight code: the browser will like it. It’s licensed under MIT License.

wow-js

Requirements: JavaScript Framework
Demo: http://mynameismatthieu.com/WOW/
License: MIT License

Analyze Your Website Speed and Performance

Posted · Category: Tools

Sitespeed.io is an open source tool that helps you analyze your website speed and performance based on performance best practices and metrics. It collects data from multiple pages on your website, analyze the pages using the rules and output the result as HTML or JUnit XML.

You can analyze one site, analyze & compare multiple sites or let it run in your CI tool to make sure that your site is always built the best way for speed. Sitespeed.io is released under the terms of the Apache License Version 2.0.

sitespeed-io

Requirements: –
Demo: http://www.sitespeed.io/
License: Apache 2.0 License

Zoom In any Element When Resizing and Scrolling

Posted · Category: MIT License, Tools

Zoomerang.js is a drop-in library that allows your users to zoom in on almost any element on your existing page. No setup, arbitrary styling. This is largely inspired by Medium’s avatar zoom in effect, with improvements (you can resize / scroll the page when it’s zoomed in and it still works).

It works best on fixed size elements such as display: block, display: inline-block and img elements. CSS Transform is required. Please note that it depends on the way browsers handle CSS transforms and has limited compatibility.

zoomerang-js

Requirements: JavaScript Framework
Demo: http://yyx990803.github.io/zoomerang/
License: MIT License

Mondrian – Open Source Vector Graphics Web App

Posted · Category: MIT License, Tools

Mondrian is a free vector graphics web app like Adobe Illustrator or Inkscape. Mondrian offers all the tools needed to create, modify, and export simple SVG files. Mondrian also supports undo/redo through a file history API that stores operations.

The entire app is written in Coffeescript. You have to manually compile the app every time you make changes. Mondrian officially supports only the latest desktop stable versions of Chrome, Firefox, and Safari. All of the Mondrian code and documentation is available under the MIT License.

drawing

Requirements: –
Demo: https://github.com/artursapek/mondrian
License: MIT License

ScrollReveal.js – Declarative on-Scroll Reveal Animations

Posted · Category: MIT License, Tools

ScrollReveal.js is a simple way to create and maintain how elements fade in, triggered when they enter the viewport. It helps you to build declarative on-scroll reveal animations for your websites. By adding a data-scrollreveal attribute to an element, it will automatically be revealed (using default values) as soon as the element is within the viewport. It is released under MIT License.

scroll-reveal

Requirements: JavaScript
Demo: http://julianlloyd.me/scrollreveal/
License: MIT License

Fit.js – Put Elements to Fit in the Way You Want

Posted · Category: License Free, Tools

Sometimes, the standard CSS properties just can’t manipulate elements to fit in the way you want them to, or your fit methods need to be more dynamic, or you’re not using the DOM at all and need to perform these computations more abstractly.

Either way, if you’ve ever needed to work out how an object of any size should fit into another of any size, or find yourself writing the same code to do this over and over again, you’ll understand how fit.js might be useful. Fit.js has a very simple purpose and that is to help you fit things into other things.

fit-js

Requirements: JavaScript
Demo: http://soulwire.github.io/fit.js/
License: License Free

Extract Inline CSS Styles from HTML Document

Posted · Category: License Free, Tools

ExtractCSS is an online tool which can extract ids, classes and inline styles from HTML document and output them as CSS stylesheet. All you have to do is to type or paste your HTML document and let extractCSS to do the rest for you. ExtractCSS is an open source project, you can check out the repository at GitHub.

extract-css

Requirements: –
Demo: http://extractcss.com/
License: License Free

CountUp.js Animates Numerical Data in Interesting Way

Posted · Category: License Free, Tools

CountUp.js is a dependency-free, lightweight JavaScript “class” that can be used to quickly create animations that display numerical data in a more interesting way. Despite its name, countUp can count in either direction, depending on the startVal and endVal params that you pass. Bower and Component .json files are included, as well as a coffeescript version.

countup-js

Requirements: JavaScript
Demo: http://inorganik.github.io/countUp.js/
License: License Free

Saved.io – The Fastest Way to Save Bookmarks

Posted · Category: License Free, Tools

We were often losing bookmarks or simply not saving them because there was no easy way to do it across devices. To solve this problem we have Saved.io. It’s a solution that is super fast and easy to use, requires no extensions, and is future proof – it will work in any browser.

Saved.io is ridiculously simple to use – just type “saved.io/” in front of any URL in your address bar, hit enter and you’ve just saved a bookmark. Anthony Feint has purposefully left out Tags, Folders, Descriptions, Notes etc. from this app. Saving a bookmark should be fast.

save-io

Requirements: –
Demo: http://saved.io/
License: License Free

Hugo – A Fast and Easy to Use Static Site Generator

Posted · Category: Tools

Hugo is a static site generator written in GoLang. It is optimized for speed, easy use and configurability. Hugo takes a directory with content and templates and renders them into a full html website.

Hugo makes use of markdown files with front matter for meta data. A typical website of moderate size can be rendered in a fraction of a second. A good rule of thumb is that Hugo takes around 1 millisecond for each piece of content. It is written to work well with any kind of website including blogs, tumbles and docs.

hugo-framework

Requirements: –
Demo: http://hugo.spf13.com/
License: Simple Public License

Page 21 of 58...«171819202122232425»...
Supported By

Deals

Web Browsers Icon Set
Food Icon Set
Flat Icon Set

Flat Icon Set

100 icons