Collective #30

View All

CSS FilterLab * CSS Framework * Website Inspiration * Uninvited Redesigns * Free Font * Multi-Line Ellipsis * CSS3 Buttons * Site Maps

Collective 30

Inspirational Website of the Week


Startup Giraffe is our pick this week. It has a fresh color scheme and some really nice structures and effects.

Get inspired

CSS FilterLab


A great place to try out all the new filter awesomeness that is hopefully coming to all modern browsers soon.

Try it

Uninvited Redesigns


A blog that collects (and where you can submit) "uninvited" redesigns of existing websites.

Check it out

Kube CSS Framework


Kube is a new minimal CSS framework. It comes with everything needed and it is responsive.

Read it

How Apple Compresses Video Using JPEG, JSON, and <canvas>

David Bloom digs into the the iPhone 5 website and discovers some interesting techniques Apple used to pull off a cross-browser video implementation.

Read it

Free Font: Obey Typeface


William Suckling shares this creative display font with us.

Get it

DOM Enlightenment

Cody Lindley shares this prerelease of his online book with us. It explores the relationship between JavaScript and the modern HTML DOM.

Read it



Here you will find all the latest freebies the web has to offer. You can also submit your own resource here.

Check it out

SlickMap CSS


SlickMap CSS is a simple stylesheet for displaying finished site maps directly from an unordered list navigation. It was created by Matt Everson of Astuteo.

Try it

Divshot: Web App Interface Builder


With DivShot (beta) you can simply build your web apps with drag-and-drop and export everything to clean HTML and CSS.

Try it

Manage Multi-Line Ellipsis in Pure CSS


Roman Rudenko from Mobify shows us a clever solution for the multi-line ellipsis problem by just using CSS.

Read it

Cirque du Soleil: Movi Kanti Revo


This Chrome experiment will blow your socks off: it will use you camera to capture gestures so that you can dive into a magical world.

Dive in

Responsive Measure


Responsive Measure is a simple script that allows you to pass in a selector which generates the ideal font size needed to produce the ideal measure for your text.

Check it out

Fokus: Emphasized Text Highlighting


Fokus is another great script by Hakim El Hattab. It can be used to emphasize anything you select, i.e. text selection, by covering the rest of the page with semi-transparent black overlay.

Check it out

Screensharing A Browser Tab In HTML5?

Eric Bidelman shares his experience on how to implement a screensharing-like functionality using only browser technologies.

Read it

Jarallax: Easy Parallax Scrolling


Jarallax is an open-source JavaScript library which makes adjusting CSS-based on interaction easy. With Jarallax you can easily create parallax scrolling websites.

Try it

24 Free Vector Logo Elements


This vector set from WeGraphics includes 24 abstract logo elements. They are great to have on hand for creating modern style logo mockups.

Get them

CSS3 Patterned Buttons


Catalin Rosu shows you how to create some super-slick buttons with a subtle pattern. No images, but a base64 string is used to create the patterned effect.

Read it

Awesome Collection Of WebGL Works by Cartelle


Check out these ├╝bercool WebGL experiments by Cartelle, an interactive studio based in Amsterdam.

Check it out

Create a Custom WordPress Login Without Plugins


In this tutorial by Iain MacDonald you will learn how to customize your WordPress login page without installing any plugins.

Read it

trunk8: Intelligent Text Truncation for jQuery


trunk8 is an intelligent jQuery text truncation plugin. When applied to a large block of text, trunk8 will cut off just enough text to prevent it from spilling over.

Check it out

prettyCheckable jQuery Plugin


This plugin by Arthur Gouveia replaces the default checkboxes and radio inputs with custom ones. It was made mobile-friendly, i.e. the touch/click area is wide and you can easily customize the looks.

Check it out

Free Web GUI Pack (PNG & PSD)


A beautiful and stylish web UI pack with all the elements you need for your next design.

Get it

Endless Icon


Endless Icon is a project built by Min Kim where he shares creative stuff with the design community.

Check it out

Would you like to become a Collective sponsor?

You can sponsor a Collective issue with your own news item. Find out more.

Would you like to send us some news?

The Collective features the latest news and resources from the web design & web development community. If you have spotted or created something that you'd like see published in the next issue, just submit the resource or article here.