A growing repository with 690 lists & 8487 resources for web ninjas
    (freebies, plugins and snippets) updated & curated every day, so it never expires.
CLOSE
bypeople
    • CSS UIs (30 submissions)

      Catch your users' attention and entertain them with interesting user interface controls for both web and mobile devices.

      • CSS Metro Facebook Interface

        This is an example of facebook profile page. This concept shows the power of Microsoft Windows Metro UI which order the elements of a page in boxes with a beautiful technique, Enjoy it. It Just works in safari, chrome or another -webkit- engine browser. The download of this content is not avalaible for not logged in users.

      • Android L Bootstrap UI Kit

        Here we have an L Bootstrap UI kit that was inspired by Android L, the upcoming update of the popular OS. It is a set of elements and components of Bootstrap 3.2 that allows you to make a web version of the mobile experience. Its features are: - Includes 28 layered PSD files - Organized layers - Elements and components of Bootstrap 3.2 It includes elements like buttons, dropdowns, alerts, links, badges, jumbotrons, breadcrumbs, inputs, labels, media objects, navbars, page headers and many more design elements that can be added into any web project. This UI was created by Vitaly Chernega and you can download it for free.

      • Amsterdam: Flat CSS User Interface

        CSSDeck user Vadzim surprises us again, this time with a complete user interface made in CSS and HTML. It is called Amsterdam, and it's composed of several design elements with a simple flat style and clean colors. Among the features it has, we can find: - A profile widget with a big thumbnail, name and description labels and a button. - Video player. - Weather widget with temperature, logo and date. - Content widget with feature image, title and description. - Calendar widget including day of the week, month, and the respective numbers. - Music or podcasts player. - Search widget. You can use this UI for free and change it any way you like.

      • Creamy UI Elements Achieved with CSS

        A minimal UI styled with pure CSS, featuring radio buttons, select buttons, a range slider, a simple tooltip, and buttons in regular, hovered and pressed states, all with a simplistic style. It is a Dribbble rebound of the Creamy UI Elements by Gil, and the code version was created by Brendon Roberto.

      • Eureka: Minimal User Interface Kit

        Here's the CSS version of a UI elements' kit for a game, designed by Kévin Bonache and coded by Alex Gryson. It is called the Eureka UI Kit and it has elements like checkboxes and radio buttons with regular and hover, a slider, some buttons with different states and a textarea.

      • InK: Quick Development of Web Interfaces

        Ink is an interface kit for quick development of web interfaces, simple to use and expand. It uses a combination of HTML, CSS and JavaScript to offer modern solutions for building layouts, display common interface elements and implement interactive features that are content-centric and user friendly for both your audience, your designers and developers.

      • Cool Dashboard in Metro Style

        This dashboard has been inspired by Windows Metro style and has many widgets copied from the real one. The interface shows the posts and widgets in multiple grids while the background can be updated from three options: green, white or bloom. This resource is completely free and does not have responsive design.

      • app-UI: Open Source Collection of User Interf...

        app-UI is a free & open source collection of reusable user interface components that may be helpful for web and mobile developers for creating interactive applications using HTML and JavaScript, especially those targeting mobile devices.

      • Almost Flat UI

        The Flat User Interface is based on the Foundation framework, and it's a nice experiment that has tons of design element for websites and apps, including navigation elements like pagination, side nav and sub nav, a top bar, breadcrumbs, buttons in different sizes and types, forms, typography, labels, CSS components like price tables, alert boxes, panels, tables, progress bars, JavaScript elements, and more.

      • Off-Canvas Responsive Layout

        Here we have a responsive layout for a blog or website, with elements that integrate beautifully with each other. It is composed of a main headline, a page title widget, featured image, a URL container, a description widget and many more. Also, it has a menu with simple icons to identify where to go. It was created with HAML, SASS and CoffeScript.

      • Animated Dashboard Widget in CSS

        An impressive statistics widget for showing multiple pieces of data. It has a crafted flat style, perfect for a mobile app or for using as a widget on your projects. It includes a top section with graphs, the value and the stock change. Right below there are labels for info such as date and city, the amount of shares traded and the variation of the stock shown in bars, side by side with the yearly change.

      • Topcoat: Clean and Fast CSS Apps

        With Topcoat, you can design clean and quick CSS web application. Performance is the key, so every component has been benchmarked in order to achieve the best results. Among it's many options, we can highlight the possibility to customize the theme, the inclusion of a PSD file with all its components, open source fonts and much more.

      • 99Lime UI KIT: Ultra-slick User Interface Ele...

        The 99Lime UI kit is an ultra-slick user interface elements with over 99 design elements to use in your Photoshop designs. It is composed of all sorts of text fields for forms, complemented with icons; it has checkboxes, radio buttons, toggles, progress bars, alert boxes, color pickers, tabs, accordions, tooltips, lists, slideshows, audio players, icons and more, all with minimal design.

      • Wijmo: User Interface for Web Development

        A complete suite of UI widgets for mobile and web application development. Wijmo now includes full support for AngularJS. Easily build JavaScript applications using our declarative AngularJS components. This also marks the second major release of SpreadJS, including many new features.

      • Styled Form Fields Done with JS and CSS

        This is a simple set of form buttons and fields, including radio buttons, a checkbox and a select, all coded in CSS. They are very simple, leaving the option of customizing to the developer or designer who wants to use them. They were created with SCSS and JavaScript, and they are easily adaptable into any project.

      • Clean Music Player User Interface

        A classy set of audio controls in CSS. They serve well to manage volume and equalization thanks to some nicely animated slider controls that feel and look  amazing. This design was coded by CodePen's user Jurby and inspired by a Dribbble shot created by Paco.

      • w2ui: JavaScript UI Library

        The w2ui library is a set of interrelated jQuery plugins for front-end development of data driven web applications. It is not a port to jQuery but was initially developed with jQuery in mind. It weighs only 56kb and provides extremely fast load and execution. It contains most of the general UI widgets like layout, grid, sidebar, tabs, toolbar, pop-up, field controls and forms.

      • CSS UI Elements with Red and Blue Gradients

        This code experiment is a set of elements with an interesting style: one range slider (or just a slider) and two switches. Although this only works in Webkit, it is a small example of how powerful CSS can be. Transitioning the pseudo-element on the checkboxes was tricky, but not impossible. Most importantly, no additional elements were used. Use them on your next projects, as a website or a mobile app.

      • Dark User Interface with Glowing Blue Tones

        Here is a little set of a UI/UX design created by LukyVj and uploaded to CSSDeck with Webkit browsers support. It uses ::-webkit-slider-thumb to generate the slider, and the rest of inputs are stylized with the :after and :before pseudo classes. You can use it freely, but take a look at the code to understand how it's been created :)

      • UI Kit: a Set of Colorful Form Inputs

        This is a design UI kit in which you can find buttons, search fields, tabs, menus, login boxes and tables in different styles that you can use right now in any of your projects. The kit has been designed and hand-coded from scratch in HTML5 taking advantage of modern CSS3 techniques, including a range of common user interface elements and font stacks, which look beautiful in modern browsers and degrade gracefully in Internet Explorer.

      • CSS Blue and Gray Metallic UI Kit

        An interesting UI kit uploaded by Ryan Legler from Codepen that combines gradient effects and other CSS3 properties to improve the appearance of the input fields of a form. The user interface is composed of different elements created with minimal style, including text areas, buttons, selects, toggles, sliders, and more buttons with gradients. Also, it includes radio buttons and checkboxes in pure CSS.

      • Clean Webkit CSS3 User Inteface Elements

        A nice minimal UI set containing the following elements: form, inputs, range, checkboxes, radio, buttons, submit, text and password fields. They were created with CSS3 and they are fully adaptable in order to include them into your next development project whatever it might be.

      • Responsive Admin Panel with Focused Inputs

        A complete design for a responsive admin interface, featuring cool focus effects when clicking on an input box, darkening the rest of the page. It was created with Sass, HTML and JavaScript by Angel Escobedo, achieving an impressive look. However, it only works with Webkit browsers.

      • Dark and Minimalistic Admin Template

        A rather basic admin panel that features a stylish dark skin. It includes all necessary elements for a complete interface (widgets, stats, to-do list, etc.), neatly organized within its minimal layout. Additionally, the panel on the left side offers easy navigation through the site's sections. Created and shared on CodePen by David HC.

      • Collapse Expand List View all
    • JQuery Alerts (16 submissions)

      This set of ready to download jQuery alert code snippets which will help you deliver that quick bit of information through notification boxes and popover elements.

      • LeanModal.js

        Bare bones modal dialog windows perfect for hidden page content flexible and with multiple instances on page.

      • Strip: Responsive jQuery Lightbox

        Strip is a jQuery plugin that build a lightbox that occupies only one part of the screen. This makes it unobtrusive and you can still interact with other parts and elements of the website without closing the lightbox. This plugin works perfectly in any browser and can be used in online stores or companies' websites in order to showcase their products. This plugin is free and was created by Nick Stakenburg.

      • HTML5 Chrome Notification Test

        This is an experimental plugin to display HTML5 desktop notifications through Google Chrome only. Just input the title and the message of the pop-up and the system will generate it and show it to you. You might not want to apply it on your site unless it exclusively intended for Chrome, which is a downside.

      • Codebase Hero: jQuery Notifications

        This jQuery plugin enables you to add notification bubbles and lists to any menu. Inspired in a PSD by Orman Clark, the bubbles have a simple, colorful design that will surely get the user's attention, plus, they animate when we hover on the menu items.

      • Facebook Beeper Box with jQuery and CSS

        This tutorial will teach us how to create a beeper like the one seen on Facebook. Have you seen that little pop-up that comes up to inform us about a notification in real time? Well, that  is what you call a beeper. It is a fantastic way to get the user’s attention at any moment.

      • jQuery Toastmessage Plugin

        This jQuery plugin will allow us to create pop-up notifications with different icons for success, notice, warning and error messages. The pop-ups can be either sticky (they will not go away until the user clicks the close button) or not sticky (they will fade away after a few seconds).

      • Sticky: Super Simple Notification System

        Sticky was created by Thriving Kings in order to provide a notification system that would display messages in the form of little pop-ups that appear around the corners, with a customizable position. It can be used to confirm uploads, send warnings, messages or anything worth informing.

      • Notify! Notification with Style

        Notify! adds little pop-up messages that assist users when going through your site. It offers plenty of customization options in order to match your site's styling, as well as a variery of behaviours from the notifications themselves: Sticky, floating, fixed and on-demand.

      • PNotify: Super Flexible Notifications

        Formerly known as Pines Notify, this plugin is intended to provide an amazing amount of flexibility (which it does) while being easy to use and implement. It gives you the possibility to create all sorts of pop-up notifications, including non-blocking, sticky, transparent and many, many more.

      • noty: A jQuery Notification Plugin

        With noty we can make six types of notifications including alert, success, warning and more. The pop-ups can be set up to appear in any of the eleven given position and their looks and behaviour can be fully customized. Additionally, noty provides the option to put notifications in a queue to promote a better viewing experience.

      • Simple Notification Popover with Bootstrap

        This is just a basic box that triggers notifications. It implements popover by Bootstrap in order to function properly. Once you click on the box, a menu comes up with information. The tool was created by Jacopo Galli and uploaded to CodePen.

      • iOS 5-Style Notifications in HTML and CSS

        This project provides notifications in HTML and CSS recreating the styling and animations from iOS. The developer of this code snippet, Ryan Merrill, created it for a project that was never used in the end. It has a minimalistic style and is not responsive, being something that can easily be fixed though.

      • Lanyrd Badge: Event Tracker in jQuery

        This is a jQuery badge for Lanyrd, an amazing website that keeps track of events and conferences around the globe. Extensive use is not yet recommended given the fact that Lanyrd does not have its own API and the way the badge retrieves the HTML from the site can cause instability.

      • InputNotes jQuery Plugin

        With this jQuery plugin, we will be able to add notes in any input box based on regex patterns. It can be used to restrict or detect actions according to the user's input, like numbers in text-only boxes, invalid characters, etc.

      • Badger: iOS Style Badges for jQuery

        Give your website a slick image with Badger, your users will recognize these icons since they are based on the ones found on the iPhone and iPad. Badges are small notification icons, so brief messages with no more than five characters are recommended.

      • Collapse Expand List View all
    • Parallax WordPress Themes (10 submissions)

      Parallax is a nice effect that makes backgrounds more dynamic, allowing developers to experiment with them. Check these Parallax WordPress themes to see what they can achieve.

      • Zerif Lite: Free Agency WordPress Theme

        Zerif Lite is a clean WordPress and responsive one-page WordPress theme, created specially for creative agencies. It has clean code, it is compatible with recent browsers, includes the mighty option panel to update the logo, social links, colors and layout, widgets ready and location capabilities. This theme was created by Themeisle and it's free.

      • PixNight: Dark WordPress Template

        A sober theme that works in multiple situations: Blogs, companies, online magazines and more. This versatile design features a parallax slider right at the start which switches between images with a neat animation. Red details highlight icons and buttons while a drop-down located on top allows you to navigate through the site.

      • Doke Doke: Colorful WordPress Theme

        Doke Doke is a very creative theme, perfect for showcasing your products or work portfolio. It features a broken-paper-like illusion that divides each section of the site and a parallax effect on the header (which, by the way, is dynamic). Clever use of these divisions can make your project extremely attractive.

      • Slider4all: Simple Photography WordPress Them...

        Here we have a colorful theme to display a simple website with minimal features. The main navigation menu, located on top, allows users to move through the different sections, although it does not display a dropdown that few users might miss. Also, it includes a triple column to show additional information, all above a well-designed pattern background.

      • MeadowHill WordPress Theme

        MeadowHill is an easy customizable WordPress blog and portfolio theme that has a fully responsive layout for allowing easy viewing on any device. This theme offers four pre-defined color schemes, 220 Google fonts, custom landing page template and Theme Options Panel for easy adaptation to your needs. There are customizable About, Portfolio, Informational, Image and Blog sections on the homepage, and the theme is available in Czech, English, French, German, Russian, Slovak and Spanish.

      • Invert: Clean Responsive WordPress Theme

        Invert is an extremely elegant theme, ideal for showcasing business portfolios and carrying a company's image with elegance through a clean, responsive interface. Items with images feature nice hover effects, while a parallax section adds a neat touch, as well. The navigation menus are multi-level and animate softly.

      • Parallax-effect WordPress Theme

        Parallax-effect is the perfect WordPress theme to suit your needs: elegant, simple and feature rich. The theme comes with responsive slider and a custom background with modern design. It’s a great theme to showcase your portfolio or blog. It features:- Background Slider.- 2 Sidebars.- Custom menu.- Post thumbnails.- Page navigation.- Widget ready.

      • Radiate: Responsive WordPress Theme

        Radiate is a minimal and clean WordPress theme, including a parallax header image that moves smoothly when hovering away from it. You can change the primary color, add a custom background and CSS via the WordPress customizer. Also, it features infinite scrolling and WordPress gallery support.

      • Sixteen: Photo Blogging Theme

        Sixteen is a good looking responsive theme that suits all kinds of blogging, particularly those that integrate images and video. The home screen features a fantastic slider that changes its size with an animation according to the image it is displaying. Below, a grid allows users to see previous posts with thumbnails.

      • Collapse Expand List View all
    • JavaScript Frameworks (32 submissions)

      Picking the right JavaScript framework in which to build your creations is vital, this set provides you with a wide range of options to ensure a perfect fit.

      • Semantic UI: Frontend Development Framework

        Semantic UI is a development framework that uses Less and jQuery to create, style, animate and manipulate user interface elements that focus on visual interaction to achieve results. It includes high-level variables and an intuitive system for changing the appearance and behaviour of any web component. It includes over 3000 CSS variables, more than 50 UI definitions and over 2800 commits. With it oyu can modify and enhance as well: - Elements - Collections - Views - Modules - Behaviors It can be downloaded and used for free.

      • Cylon.js: Robotics JavaScript Framework

        Cylon.js allows you to create and command robots for all sorts of purposes. It has an extensible system for connecting hardware devices. You can use it in several physical systems and software platforms, like ARDrone, Arduino, Arduino YUN, Beaglebone Black, BLE, Crazyfile and many more platforms, and many more devices that use inter-integrated (I2C). Also, it can be used directly in-browser thanks to the browserify NPM module, and other development options.

      • Ionic: HTML5 Hybrid Mobile App Framework

        ​​Ionic is an exciting alternative for creating hybrid mobile apps, taking advantage of all the possibilities provided by HTML5. Built with SASS and optimized for AngularJS, this framework is fast, features a wonderful design and is completely open source, being handled through GitHub.

      • Sammy.js: A Small Web Framework

        A tiny piece of software (16K compressed and 5.2K compressed and gzipped) that will allow you to build your next web project with style. Its modular approach allows you to extract your code and use it again in the form of plugins. Additionally, the clean interface is made to be easy and fun for developers.

      • Backbone.js: JavaScript MVC Framework

        A complete open source JavaScript framework,  featuring a rich API that has been used in well-known projects such as Rdio, Hulu, USAToday and many more. It is also hosted on GitHub for a fast-evolving environment and the developers offer a full test suite, tutorials, examples and other tools.

      • AngularJS: JavaScript MVW Framework

        AngularJS is a toolkit that allows you to create the proper framework for your web project development. The main problem it tackles is the complexity of handling dynamic views with HTML, letting you extend HTML vocabulary to make it fit with your application. Angular is also quite extensible, adapting to any development workflow.

      • Agile CSS3 Engine

        ​Agile uses JavaScript in order to generate pure CSS3 without the need for anything other tool such as canvas or webGL. It has a special care for mobile devices, providing striking performance on any device while letting you create and display amazing animations and effects.

      • Famo.us: 3D JavaScript Framework

        Famo.us is an amazing JavaScript framework that integrates its very own 3D layout engine, opening a whole new world of possibilities for developers. This 3D layout engine also has a physics animation engine built in, allowing you to create natural, physics based animations. If you need to get up to date, Famo.us University contains a great amount of lessons so you can learn at your own pace.

      • WinJS: The Windows Library for JavaScript

        ​A JavaScript framework for Windows released as an open source project by Microsoft themselves. It allows you to create top applications (Windows Phone development is also possible) using HTML, CSS and JavaScript, offering advanced options such as List View, Flip View and Semantic Zoom. 

      • Riot.js: Client-side MVP Library

        ​A surprisingly small library that weights less than 1kb when gzipped and a mere 1.6kb when minified, containing only 3 public methods. The idea behind such small size is the ability to add things as you need them, not the other way around, allowing better control and understanding of you app's composition.

      • RaptorJS: JavaScript Toolkit for Module Creat...

        ​Raptor JS is a JavaScript toolkit that will allow you to create adaptive modules by packaging and optimizing them. Its widget framework makes their handling easy and allows them to communicate, while Raptor Templates lets users customize their experience without worrying about performance decrease.

      • Durandal: Single Page Apps Done Right

        ​​Durandal intends to make the creation and maintenance of single-page applications easy and enjoyable. This client framework bases itself on three principles: Comfort, providing familiar functions and mechanics; richness of features, everything you need to let your inspiration fly; finally its versatility lets you develop content for all kinds of devices and purposes.

      • Flight: Twitter's JS Framework

        A component-based JavaScript framework owned and used by Twitter to create their own web applications. The main difference between Flight and other similar tools is its lack of a default path in the way data is provided to an application, utilizing a fully agnostic approach, mapping behavior to DOM nodes.

      • Flowtime.js: Dynamic HTML Websites

        Create dynamic HTML presentations and websites with Flowtime. This JavaScript framework makes use of CSS3 animations to make the projects move in attractive and unexpected ways. It is compatible with al major browsers and supports touch interactivity while the keyboard controls a good part of the behavior on PCs.

      • Dashing: Dashboard Framework

        ​Dashing is a framework that will let you create dashboards, friendly user interfaces based on individual widgets that serve different purposes. It offers a few advantages, such as premade widgets, an intuitive drag and drop interface and the possibility to host your dashboards on Heroku.

      • Batman.js: Rails Development in Mind

        ​Batman.js was created with Rails development in mind, so if you're familiar with it, you'll be up and running in no time. Shopify is currently powered by it, this will give you an idea of how scalable the tool is. Additionally, it carries a good few features for user convenience, such as the familiar Rails conventions, data bindings and structured directories.

      • iio Engine: HTML5 Application Framework

        The iio Engine is an extensive application framework that helps with the creation and deployment of HTML5 applications. It provides a feature rich SDK, an advanced debugging system, and cross-platform deployment engine. Also, it has no dependencies and can be interfaced with Box2D. Its core platform is open source and totally free.

      • Lungo: HTML5 Cross Device Framework

        Here we have a framework for developers who want to design, build and share cross-device applications. The optimized apps created with the framework support open web standards, such as HTML5, CSS3 and JavaScript. It brings a consistent browser environment across mobiles, tvs and desktop devices.

      • Derby: Framework for Realtime Applications

        Derby is a Model View Controller framework that makes it easy to write realtime, collaborative applications that run in both Node.js and browsers. The features it includes are realtime collaboration, client and server routing, HTML templates and more.

      • Ember.js: Create Ambitious Apps

        Write dramatically less code with Ember’s Handlebars integrated templates that update automatically when the underlying data changes. It incorporates common idioms so you can focus on what makes your app special, not reinventing the wheel. This tool has been built for productivity and designed with developer ergonomics in mind, making it a friendly API to help you get your job done fast.

      • The M Project: Mobile HTML5 JavaScript Framew...

        The-M-Project is a Mobile HTML5 JavaScript Framework that helps you build great mobile apps, easy and fast. It is an open source software published under the MIT License that gives you total flexibility for your development. Build great free and commercial apps with it.

      • skel.js: Framework for Building Responsive Si...

        Here we have an online frontend framework that only weight 18kb in one file. Four dominant components: CSS Grid System Responsive Handler CSS Shortcuts Plugin System

      • Appium: Open Source Framework for Test Automa...

        Appium is an open source, cross-platform test automation tool for native, hybrid and mobile web apps. It supports iOS, Android and FirefoxOS platforms. It works by driving various native automation frameworks.For iOS support, it drives Apple’s UIAutomation library; for Android, it supports the UiAutomator framework and Selendroid for both newer and older versions of the OS, and for FirefoxOS, it supports Marionette.

      • TodoMVC: MV framework Helper

        This is a project that offers the same Todo application implemented using MV* concepts in many of today's popular JavaScript MV* frameworks. Create JavaScript apps, compile to JavaScript, MVC extension frameworks, and more.

      • KineticJS HTML5 Canvas Framework

        KineticJS is an HTML5 Canvas JavaScript framework for creating enterprise-class interactive web graphics. It enables high-performance animations, transitions, node nesting, layering, filtering, caching, event handling for desktop and mobile applications, and much more.

      • Collapse Expand List View all
This a test message in global notification
Your download will start shortly.
bypeople

Done!

Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.

Browse
Done

Thank You!

Your post has been received, and will be reviewed by a curator

bypeople