Tint UI

If you are a Designer like me you really have to know your colors. If you don't have them stored in Sketch and you need to know an official Material Design color for a project you'll end losing some time on Google to check it out – well, no more!

Instead of googling them around I created Tint UI to be the source of truth for branding colors and palettes. It was born from a personal need to check those forgetful hexadecimal color codes and quickly copy & paste them to your designs.  

That said, I was the founder, designer, coder and one of the +10.000 users that visited tintui.com in the first month. The project had an overwhelming reception and was featured in popular websites like DesignerNews, WebDevTools and Tympanus.

Not only it had a great number of visits but they would also return: 1 in every 3 users would come back in a 30-days time range. I ended up selling the project in early 2017 with 11 color palettes, over 4.000 visits/month and 46% of bounce rate.

Project goals

  1. Feature popular color palettes to inspire designers.
  2. Allow users to copy the hexadecimal code to their clipboard with 1 click.
  3. Provide feedback of which color code they copied to the clipboard.
  4. Keep adding new features and palettes as requested by the users.

Design process

When I was sketching the layout for this page I realised that it needed to be very simple because the colors already had a big impact.

The top bar displayed a brief guidance for users "Select a color to copy the hexadecimal code" and after a click it would show feedback of which color you copied. Apart from this, the only interaction left was the sidebar on the left to change to a different palette page. Simple!

After the launch I started receiving user requests, one of them being a switch to show/hide the hexadecimal codes on top of the respective color. The progress of the tool can be seen below together with some Twitter reactions. 

logo_tintui

Personal Project

2015-2016

Tint UI is a color picker tool to copy hexadecimal codes from official color palettes.

Tint UI is a color picker tool to copy hexadecimal codes from official color palettes.

Tint UI version 1

January 2015

When I launched the MVP version of Tint UI it used to look like this. Only 4 color palettes and no visible hexadecimal codes. It was only a click-and-copy tool.

Tint UI version 1.1

February 2015

Here you can the switch requested by the users: show/hide hexadecimal codes in the page. I also started adding more color palettes like the "Pantone 2015".

Tint UI version 1.2

2018

The project is no longer under my management but still has the same design and content when I sold it, with 11 palettes.

You can check it out here: http://tintui.com

What's next?

Check out João's full work experience and latest personal projects. 👨🏻‍💻

2018 All Rights Reserved

2018 All Rights Reserved

2018 All Rights Reserved