Lucent UI

Lucent UI – A free, vector-based and retina ready UI kit

I love UI kits and so can you. My inner designer has been nagging for a fresh project and the result is Lucent UI, a new UI kit fresh out of the Photoshop oven. I took a slightly different approach to the design of this kit, placing an emphasis on graphing and plotting (bitches love data visualization) over traditional UI elements. Some of the charts are linked as Illustrator Smart Objects for easier replotting of visual data points. Every element is vector based, retina ready and distributed through layers. Text and colours are easily editable. This kit is completely free for use for personal or commercial projects.

The font used is Open Sans, available from Google Web Fonts for online or offline use.

Lucent_UI_posterLucent UI Download PSD

What do I do with this?

“What is a UI kit and what do I do with it?” You have a pretty PSD in your hands, now what?

The beauty of UI kits is that they aren’t meant for any specific reason or purpose. They’re assignment-agnostic and can be used to serve the broad range of tasks that may come your way. For example:

  • Reuse elements in your own design projects. The individual components of a UI kit are often more valuable than the sum of it’s parts.
  • Dissect to learn how how different effects are created and implemented.
  • Use the defined colours and fonts a base style guide for your project, or copy styles onto your own layers.
  • Use the vector shapes as a base to apply your own layer styles.
  • Do nothing. Use as an aesthetic reference for inspiration.

To learn more about what a UI kit is and how to use them, read up on designmodo’s article – What is a UI Kit and Why You Should Use It.

The creation of this PSD relied heavily on creating complex vector shapes in Illustrator and porting to Photoshop via pasting as shape layers. To learn more, visit my tutorial on shape layers here.


109,173 total views, 9 views today

Posted on October 24, 2013 by Sarah · 6 comments


  1. Pingback: Weekly Design News (N.208)

  2. Pingback: Weekly Design News (N.208) « Refined Sites Blog

  3. Pingback: Weekly Design News (N.208) | WordPress Webdesigner

  4. Pingback: Free Flat UI Kits for Web & Mobile UI Design | Design | Graphic Design Junction

  5. Pingback: Creative Flat UI Kits for Designers | Graphics Design | Design Blog

  6. Pingback: 50 Best Web & Mobile GUI Templates from 2013 - Speckyboy Design Magazine

Leave a Comment

Your email address will not be published. Required fields are marked *