Free download: Flat / Skeuomorphic UI kit

UI kits are a great way to kick-start a user interface design. The best ones feature the most common elements required by developers. Most importantly, UI kits avoid the dreaded ‘blank screen’, giving you a jumping off point for your own innovations.

It’s rare however that you find a UI kit that is neutral enough to really be open to changes. Too many UI kits follow one design route or another: delivering on flat design but simultaneously imposing it; or delivering on skeuomorphism, but making it impossible to extract a flat design.

So we’re delighted to be able to bring you this fantastic free UI kit by Tempees.com. The UI kit comes in two versions: skeuomorphic and flat, meaning that whatever style fits your project, you’ll be able to make your start here.

The kits are monochromatic and set in an almost Yves Klein-like blue. The rich color can easily be modified, but sits beautifully with the low-contrast greys of the other elements.

There are three menus, profile boxes and UI buttons, but the central element is the tabbed log in/register panel that allows your visitors to elegantly switch between the two functions.

The standard kit features gradients and inner shadows aplenty, with buttons being treated as convex and input fields reversing the highlights and shadows to appear concave. The flat UI kit version on the other hand, removes the gradients, retaining some of the deep shadows and highlights, keeping the concave and convex style whilst creating an almost-flat aesthetic.

The kits are free for personal and commercial use; download them after the previews:

preview_standard
preview_flat

Have you built a project using these kits? Which do you prefer, standard or flat? Let us know in the comments.

Please enter your email address below and click the download button. The download link will be sent to you by email, or if you have already subscribed, the download will begin immediately.

0 shares
  • gerardo pacheco

    are components html?

    • http://facebook.com/shakegioh Giovanne Afonso

      No…

  • Anthony McLin

    Why does this post titled Skuemorphic? Absolutely nothing in the post or UI kit is skeumorphic or has anything to do with skeumorphism. Skeumorphic is not an antonym for Flat Design. A Flat Design could simultaneously be skeumorphic.

    • James

      I was thinking exactly the same thing…

    • Kiven Karter

      Me too i totally agree with you, even it’s not “FLAT DESIGN” FLAT must be respected as many standards like no corners no gradiants…
      Take a look at http://twittstrap.com/twittstrap I used by now it’s a flat version of Twitter Bootstrab.

    • some_design_guy

      Agreed, please someone explain how this is skuemorphic? I guess it was only used to make the post sounds cooler…

    • http://www.webdesignerdepot.com/ Benjie — WebdesignerDepot

      It’s the title of the UI kit.

      But equally, the gradients and push buttons are clearly skeuomorphic because they mimic the 3D nature of ‘real’ buttons and switches.

      Skeuomorphism shouldn’t be confused with figurative illustration.

    • John Wesley Baker

      I had to look it up but now it makes sense

      A skeuomorph /ˈskjuːəmɔrf/ is a derivative object that retains ornamental design cues from structures that were necessary in the original.

      The UI kit is trying to retain a flat feel while still allowing for some styling. Wether they accomplish this is for you to decide.

  • ananymous

    it just looks like bootstrap.. its copied..

  • 이슬비

    wow! good design