This is our web design and web development news series where we share our favorite design/development related articles, resources, tutorials and awesome freebies.

NEW DEVELOPMENT RESOURCES AND TOOLS

Fun Game for Learning CSS Selectors – CSS Diner

It’s a little game to help you learn CSS selectors. Type in the correct selector to complete each level.

Building Interactive, Multi-state Prototypes for Websites and Apps – Permit.js

Permit.js is a jQuery plugin that makes building interactive, multi-state prototypes for websites and apps.

PintJS – A Small, Concurrent Grunt JS Runner

Pint is a small, asynchronous, dependency aware wrapper around Grunt attempting to solve some of the problems that accompany a build process at scale.

A typical Gruntfile starts with, at a minimum, some variation of: jsHint, jasmine, LESS, handlebars, uglify, copy, and clean stack. Just these half dozen or so plugins can balloon your Gruntfile upwards of 300 lines and when you add complex concatenation, cache busting, and versioning can cause it to grow well in to the 1000+ lines. Pint allows you to break up and organize your build into small testable pieces.

Flexbox Grid

A grid system based on the flex display property. Responsive modifiers enable specifying different column sizes and offsets at hand, lap, desk & wall viewport widths.

jsDelivr – The Advanced Open Source Public CDN

PNotify – JavaScript Notifications for Bootstrap or jQuery UI

PNotify is a JavaScript notification plugin, developed by SciActive. Formerly known as Pines Notify. It is designed to provide an unparalleled level of flexibility, while still being very easy to implement and use. It can provide non-blocking notices. This allows the user to click elements behind the notice without even having to dismiss it.

CSS Generator for Animations – CSSynth

A fantastic and useful CSS generator for animations.

jQuery Credit Card Validation Plugin: Smart Validate

Smart Validate is a jQuery credit card validation plugin, that makes credit card format validation a simple task. It ensures that user has entered valid credit card number before making actual transaction.

JavaScript Framework for Building Brilliant Applications

Mithril is a client-side Javascript MVC framework. It’s a tool to make application code divided into a data layer, a UI layer, and a glue layer. Mithril is around 3kb gzipped, focused, API. It provides a templating engine with a virtual DOM diff implementation for performant rendering, utilities for high-level modelling via functional composition, as well as support for routing and componentization.

25 Free Themes for Ghost Blogging Platform

jQuery Content/Thumbnail Slider V2.0: jsCarousel V2.0

jsCarousel v2.0 is a jquery slider plugin that slides contents in multi direction. Now it supports both horizontal and vertical orientation, see the screen shot below. jsCarousel v2.0 slider can be used as a feature content slider as well. You can put any kind of contents you want whether images, text, videos, news etc. it’s up to you. One interesting thing about jsCarousel v2.0 slider is that you can make simple image gallery with thumbnail support by using it. jsCarousel v2.0 slider plugin gives you the source of image via callback function, when you click on some image within slider.

Modern, Simple and Elegant WYSIWYG Rich Text Editor – jQuery Notebook

A simple, clean and elegant WYSIWYG rich text editor for web aplications.

CSS Animations and Transitions Performance

XML-driven Vertical News Scroller Script using HTML and jQuery: vScroller

A free XML-driven vertical news scroller for websites and blogs. Powered by jQuery, vScroller displays categorized and color-code content is a vertical scroll. Feeds come from standardized XML file and styled with simple CSS3 for a clean and attractive interface.

FREE TEMPLATES AND THEMES

Free Responsive HTML5 Portfolio / Business Website Template: Brownie

Created by using the latest HTML5 and CSS3 techniques, Brownie is a simple and clean Free Responsive HTML5 portfolio and business website template.

[FREE] Coming Soon Responsive HTML Website Template: SeeYa

This simple HTML website template is based on responsive layout scheme which means it will render flawlessly on all platforms, devices and screen resolutions. We named this HTML template, SeeYa.

TemplateVamp: [FREE] Twitter Bootstrap Admin Template

Based on Twitter Bootstrap, TemplateVamp is a fully functional and customizable admin template that leverages the power and flexibility of HTML5 & CSS3. It can be used as a front-end toolkit for rapidly developing web applications that are lightweight, faster, and mobile-friendly; a great starting point.

TemplateVamp contains HTML and CSS-based design templates for typography, forms, buttons, charts, navigation and JavaScript extensions.

Free Responsive HTML5 Single Page Portfolio/Website Template: OnePager

OnePager is a Free Responsive HTML5 Responsive Template for portfolio and business websites. Simple, creative and focused! The template comes with a nice image slider for featured work and an image gallery with popup support. It also includes circular knobs for skills. Clients section standout this template in the crowd. Industries and contact form is also available and very easy to customize and setup to get emails right in your inbox.

DESIGN FREEBIES

New Twitter GUI PSD 2014

Make Your Own Grid Paper with Gridzzly

Stroke 7 Icon Font Set

This is a complete set of 140 thin stroke icons inspired by iOS 7. Those retina ready icons have a very modern style that will beautifully complement any project.

Free Animal Characters Set

Great Characters set of 11 amazing animal mascotts can make use for you in so many ways, while you working on some concepts or finishing project. All characters presented in layered EPS files, you can easily customize size, colors and any other details you want. EPS files ready for print, so characters will perfectly look on your tshirts, poster on the wall or smartphone case.

Free Font – Bliss Yeah

Bliss Yeah in three different thicknesses. Accessible and visible in small size.