Mac app icon for LiveReload

Andrey Tarantsov picked a winning design in their button or icon contest. For just $401 they received 84 designs from 24 designers.

Here’s a peek at the client’s brief

Contest title


Mac app icon for LiveReload


Design an outstanding icon for a breakthrough Mac app!

Background information

Organization name


Description of the organization and its target audience

LiveReload is a desktop application + a Safari/Chrome/Firefox extension that:

1. Applies CSS and Image changes when you save a file, without reloading a page.

2. Automatically reloads a page when any other file changes (html, server-side script, etc).

3. Optionally compiles SASS/LESS/Stylus/HAML/Jade/CoffeeScript files into css/html/js.

See (the content is there, design is not finalized)

Version 1.x has been free and open-source, and had only a command-line interface:

Now I'm making version 2.x for the Mac (and, eventually, Windows) which includes 3 most-requested features: (1) native Mac UI, (2) easy installation, (3) compilers support (feature #3 above).

Content details


Mac application icon, to be used in:

1) Mac App Store (sizes up to 512x512)
2) icon of the application bundle
3) Mac menu bar when the app is running, in several states

The app is recognized as a revolution in web designer's workflow, so I want something bold. I also want it to look crisp and polished. Can be playful and crazy, can be clean and professional or anything in between, you decide.

The menu bar icon should match the small-size app icon and is needed in several color-coded states (see the for referenced examples):

* inactive: no browser connected. Icon: grayed out or something like that (see example of how a similar system icon looks: system-wifi-bluetooth-off.png)

* active: normal state, browser(s) connected (see example of how a similar system icon looks: system-wifi-bluetooth-on.png)

* highlighted: while the app popup is open; white, displayed over the blue system highlight background (see example of how a similar system icon looks: system-wifi-highlighted.png, system-bluetooth-highlighted.png)

* change detected: displayed for about 0.25sec after each change; green right now, should be something colorful and noticeable because it's only visible for a short time

* drop target: while dragging a folder into the app's icon; blue right now, but I would like some glowing effect instead (see example: twitter-glowing.png)

Old menubar icons attached in Note that the height is fixed, but the width is flexible, +/- couple of pixels is no problem.

Please pay attention that we're creating an utility here, not a document app, and what Apple Icon Guidelines say about those:…Icons.html


* Reeder:…5554?mt=12 (simply good icon)
* Wikibot:…8583?mt=12
* Divvy:…7545?mt=12 (this is very close to our case; note how an element of the big icon becomes the small icon in menubar, on the screenshot)
* Code Runner:…5799?mt=12
* FaceTime, utility app from Apple:…7850?mt=12
* a few more random utilities:…5721?mt=12,…9079?mt=12
* Coda:…1464?mt=12 (very brave and bold, and I do love it, but I wouldn't want my icon to look as abstract as that)

*…4640?mt=12 (good icon and to the point, but too obvious and boring)
*…2759?mt=12 (nice icon, but too crowded, could use more simplification)

Graphic design made easy

99designs gives you quality graphic design at an affordable price. Just tell us what you need, get dozens of designs and choose your favorite.