Fresh Resources for Web Designers and Developers — July 2013

Ah yes, the regular monthly roundup is back. This round, we have another 10 different tools, apps and services to help designers and developers.

In this set you will find a flipclock tool that can double as a countdown timer, a handy site that lets you grab the identity of colors easily, a cheatsheet for screen size & resolutions, as well as weather font icons!

iOS 7 Icon Template

Apple has just introduced iOS7, and one of the different thing is in the icons (but I’m not referring to their new look). The new icons for iOS has different rounded corners, grids and are a little different in size too. This PSD template lets you to design icons for iOS7 precisely.

Forecast Fonts

Forecast Fonts is a set of font icon for weather. It has a complete set of weather icons for weather patterns like Sunny, Drizzle, Sunset, Snow, Thunderstorm etc. It’s a perfect fit for a weather app!

Picksum Ipsum

Bored with Lorem ipsum? Try out Picksum Ipsum, a dummy text generator tool that generates the lines from legendary Hollywood actors, Michael Caine, Clint Eastwood, Morgan Freeman (and Jim Carrey). If you are a designer as well as a movie fan, Picksum Ipsum can help you mix things up a bit.


Recently Adobe introduced a CSS Framework that aims for performance, called Topcoat. It is equipped with a some additional components like UI, a set of icons, and a PSD to craft your design before getting into the codes.


Swiper is a free content/image slider that is optimized for mobile. It is responsive, and has support for touch interaction. It is a lightweight library which is only 6.5 Kb, and runs fast as it does not require a third-party library like jQuery to work.

Screensizes lists numerous size specifications for popular phones, tablets, and monitors. The dimensions shown include screen size, physical size, the pixel density etc. It’s a very useful “cheatsheet” when we are building a responsive website – worth bookmarking.

Flipclock JS

Flipclock is a jQuery plugin to build a clock with the flipping effect. You can use this library as a normal clock showing the current time, a timer that shows how much time has been passed, or a countdown timer, like those displayed in a “Coming Soon” page. The output is customizable through CSS and extendable with the provided APIs.


Since mobile devices have a very limited viewable area, it is common to hide the menu navigation on the side. The user simply clicks on the menu icon to reveal the navigation. Using Mmenu it is very easy to create a mobile-like menu on your website. It provides a set of options to customize the menu.


Pure is a super-tiny responsive framework that is developed by Yahoo. It is easily themable through the Skin Builder, and could be an alternative to some already popular framework like Bootstrap and Foundation.

Web Colour Data

Web Colours Data is a webapp that allows you to grab colors from other websites in a snap. Simply enter the URL and hit the “Get Color” button; the color scheme and the Hex number of the colors will be instantly generated.