This is our popular weekly design news post where we share our favorite design related articles, resources and freebies from the past week.
You can sign-up to our awesome weekly newsletter for some more amazing articles, resources and freebies.
New Resources & Tools
Sassline →
Sassline is a set of rules and recommendations for base typography styling (and mixins) to set web text to a baseline grid easily with rems and Sass.
Tablesaw →
From the Filament Group, Tablesaw is a set of plugins for responsive tables. Plugins include Stack, Toggle, Add a Mini Map, Swipe, Add a Mini Map, Mode Switcher and Sortable.
multiscroll.js →
multiscroll.js is a simple jQuery plugin for creating multi scrolling websites with two vertical scrolling panels (half of the page slides up, the other slides down as you scroll).
Hover.css →
Hover.css is a bunch of CSS3 hover effects that can be easily applied to your own call to actions, buttons, logos, featured images and so on. Available in both SASS and CSS.
fb-flo →
From the Facebook GitHub repo, fb-flo is a Chrome extension that lets you modify running apps without reloading.
Octotree →
Octotree is a useful browser extension for Chrome, Firefox and Safari for displaying GitHub code in tree format.
Splitchar →
Splitchar is a jQuery plugin that allows you to style and design the first, second or both halves of a character.
Tutorials & Learning Resources
Google Web Fundamentals →
Google Web Fundamentals is an essential collection of information about modern web design and development.
A Complete Guide to Flexbox from CSS Tricks →
Recreating the "Design Samsung" Grid Loading Effect →
A Codrops tutorial on how to achieve the grid loading effect as seen on the "Design Samsung" site.
Android Design Tips →
Created by @destroywerk and @BPScott, Android Design Tips is a cheat sheet of suggestions and utilities for designing and developing on Android.
Free GUI Resources
Linea Iconset (160+ Icons in SVG, PNG & Icon Font Formats) →
iPhone Vector Wireframing Toolkit (AI) →
Charts and Diagrams Kit (PSD) →
Source Serif Pro (Regular, Semibold & Bold) →
Source Serif Pro is a serif font family from Adobe, designed to complement their Source Sans Pro font.
Something Inspiring
Retro-Style Poster Series of the World Cup Golden Ball Winners →
Designer Jon Rodgers has graphically designed, in a retro-style, the players that have previously won the world cup Golden Ball award.
Also Worth Reading
- A Guide To <picture> And srcset by Eric Portis →
- Using the :target pseudo-selector for alternative layouts by Vasilis van Gemert →
- Sass Color Variables That Don’t Suck by Landon Schropp →
- Tips for Creating Accessible SVG by Léonie Watson →
- The new srcset and sizes explained by Martin Wolf →