Collective #207

Inspirational Website of the Week: ANIMAL
A colorful design with some truly wild effects made us pick ANIMAL as our inspirational website of the week.
Get inspired
Get 5+ Job Offers with 1 Application
Let Hired bring jobs to you. Get job offers from top companies with salary and equity upfront.
Check it out
Bricks.js
A great masonry layout generator for fixed width elements made by Mike Cavalea.
Check it out
Creating Content Wireframes For Responsive Design
Tom Green shows his methods for getting from content to responsive wireframe, a step often neglected.
Read it
Free Font: Fenton
Fatih Günes designed this stunning typeface that comes in six weights.
Get it
Control CSS loading with custom properties
Jake Archibald shows how to control CSS loading with the power of CSS variables.
Read it
The design process of the Arriva logo
Veerle Pieters takes us on the inspiring journey of the Arriva logo creation.
Read it
A Message to Our Customers
An important message from Apple chief Tim Cook regarding the "backdoor" request by the FBI. Read the Hacker News comments, too.
Read it
Validating Product Ideas
An excerpt from Tomer Sharon book "Validating Product Ideas Through Lean User Research".
Read it
Issue and Pull Request Templates
GitHub introduces templates for Issues and Pull Requests for projects, helping contributors add the right details at the start of a thread.
Check it out
okayNav
This nav is not just "okay" but really great at solving a very important problem: it aims at progressively collapsing navigation links into an off-screen navigation instead of doing it for all links at the same time. Made by Vergil Penkov.
Check it out
Codeology
Codeology is an open-source project that brings the art and science of code to life. An algorithm analyzes GitHub projects and creates unique organic forms based on the codebase size and language.
Check it out
The Fab Four technique to create Responsive Emails without Media Queries
An interesting technique by Rémi Parmentier on making emails responsive.
Read it
Sliding Panels Template
A beautiful sliding panels template made by Claudia Romano form CodyHouse.
Check it out
Free Font: Weem
A lovely, playful serif typeface designed by Gatis Vilaks.
Get it
Collect UI
Some great inspiration hub from the daily UI challenges on Dribbble. Curated by Ahmet Sülek.
Check it out
Theme switcher using CSS custom properties
Michael Scharnagl shows how to create a theme switcher with CSS variables.
Check it out
Introducing: The Ultimate CSS Survey
Help collect some useful data on CSS proficiency and usage with this survey by Louis Lazaris.
Check it out
Introducing the Accessible Modal Dialog
Read about the process of revamping a modal dialog script and making it accessible. An article by Hugo Giraudel.
Check it out
GrapesJS
GrapeJS is a free and open source web template editor and tool. Made by Artur Arseniev.
Check it out
Understanding the box model by building a navigation bar
In this tutorial, Hui Jing explains the box model in detail by styling a navigation bar.
Read it