Fresh Resources for Web Designers and Developers (March 2015)

Time for another round of fresh resources, for the month of March. In this round of series, we have a budding browser, mockups for a device of the wearable kind, a collection of icons that can morph, and a handful of other cool stuff.

For more fresh resources for web developers, follow the series.

CodePad

CodePad is a web app you can use to save and share codes. It supports multiple programming languages ranging from CSS to XSLT. You can set your code snippets to private access so only you can see it, or leave it publicly accessible, which also allows search engines to pick it up.

UINames

If picking a username when opening an account for any service online is hard for you, think of how hard it is for designers to come up with fake names as a content filler or placeholder in prototypes. UINames allows you to generate some random names – like Lorem Ipsum, but for people names instead. You can choose a name based on gender or even on countries (e.g. Japanese, Chinese, Vietnam).

DevTools App

The DevTools App is an application that allows you to debug your website. It works like the DevTools we can find in Chrome. This app is an experimental project to separate the DevTools from Chrome, which is a pretty rational idea since the majority of Chrome users won’t need or use DevTools – only Developers will.

Is.js

Is.js is a handy tiny JavaScript library that allows you to run evaluation intuitively using the is method. You can test almost any data types including String, Array, Time, RegEx (Regular Expression), and even Environment.

The following code example will evaluate whether we are in Internet Explorer 6:

var IE6 = is.ie(6)

if ( IE6 ) {
	// run function here	
}

TheatrJS

TheatrJS is a JavaScript library for creating typing effect, only unlike similar libraries, TheatrJS mimics how real humans type e.g. with a little delay, with typos, and correction.

TintUI

TintUI is a collection of color palettes derived from multiple sources. Here you can find the colors that were used in iOS, Android Material Design or in Microsoft Windows. This tool makes it easy to pick the color, simply click on any color tile to copy the Hex format of that color.

Transformicons

Transformicons is a collection of common toggle buttons that will transform into something different when clicked. You can find the popular “hamburger” icons that will change into a cross mark icon or an arrow. Transformicons also provides the Build tool which you can use to generate HTML, CSS, and JavaScript only for the selected icons.

Vivaldi

Vivaldi is a new browser built by the same team who built the early version of Opera with the Presto engine. Although Vivaldi is still in its infancy, it already ships with handy features like “Quick Commands” to customize navigational shortcuts, and Tab Stacks that group multiple tabs in a single tab. The development in ongoing, with more features to come like Mail and Extension support.

Apple Watch Mockup

We already have mockups for desktops, tablets and smartphones, so it is only a matter of time before there are mockups for smartwatches. If you need mockups for the Apple Watch, this is the site to bookmark. You will also find mockups for iOS icons and the iPhone 6.

Slot Font

Slot Font is a uniquely designed font. It’s a rounded font with a half-circle ornament within. The font comes in OTF format, and it’s good to use as a poster heading. It’s free for use in both personal and commercial projects.