36个扁平化设计资源

In contrast to skeuomorphic design, flat design focuses on simple shapes, colors and typography to emphasize clarity and usability. It was a term coined by Allan Grinshtein of LayerVault in his post “The Flat Design Era,” published last year. The release of iOS 7 proved flat design is no longer a passing fad, but rather a step forward.

The flatness of style means simplifying interface elements, removing extraneous elements and decoration — such as bevels, gradients and textures — to create a crisp, clean design thatfocuses on hierarchy.

To help you get started with flat design, we have compiled 36 beautifully designed premium and free UI PSD kits, each featuring a variety of interface components and elements for use in your projects.

Are there any flat design UI kits you would recommend? If so, please share the link in the comments below with our readers.

1. Flat UI Pro

Flat UI Pro is based on Twitter Bootstrap and designed in a flat style, containing a large number of basic components, icons and glyphs. The kit also includes a PSD version.

2. Flat UI Free

Flat UI is a free resource from Designmodo, and contains the basic major elements of a web interface for use in design.

3. Flat Design Toolkit

DesignerDepotKit

 

A free Flat UI kit designed by Freepik, this contains all of the essential user interface components, even providing graphs and user profiles.

4. Blog/Magazine Flat UI Kit

This is a free UI Kit aimed at blogs and magazines, which includes a wide range of components that can be used to create clean, colorful websites.

5. Vertical Infinity UI Kit

The Vertical Infinity UI Kit contains a large array of components, from menus, dropdowns, widgets, buttons and media players to forms and pagination. It’s also optimized for retina displays.

6. Flat UI Kit – Riki Tanone

This is a Flat UI PSD kit designed by Riki Tanone, with a calendar widget, maps, tags and more.

7. Flat UI PSD – Devin Schulz

This UI Kit from Devin Schulz has a creative set of components, including navigation, input boxes and buttons.

8. Metro Vibes UI Kit

Metro Vibes is a gorgeously designed premium UI Kit designed by Mike from Creative Mints and available on PixelKit, which pays supreme attention to details and features beautiful colors.

9. Flat UI PSD – Riki Tanone

This kit is another free offering from Riki Tanone, featuring more UI components, including a media player and user profiles.

10. Featherweight Flat UI Kit

Feather-Weight

 

A comprehensive UI kit from Sarah Justine, every element in Featherweight is vector based, retina-ready and distributed through layers. Text and colors are easily editable, with projects that are completely free for personal or commercial use.

11. Flat Web UI Kit

This is a premium flat GUI package that includes the design of form elements, controls, widgets, forms and loaders.

12. Flat UI Kit – Sebastiaan Scheer

This is a summer-inspired UI Kit that is free to download as a PSD, and comes with weather widgets, a media player and navigation elements.

13. Flat UI Kit – Hüseyin Yilmaz

Home Improvement inspired UI Kit from Hüseyin Yilmaz, this kit has the major UI components, including profiles, media players and forms.

14. Square UI

Square UI is a premium user interface pack including a set of beautiful and pure components, ideal for fast prototyping. There is also a free version available to download.

15. Flat UI Kit – Jamie Syke

A colorful UI Kit from Jamie Syke, this resource comes with an interesting mix of components and imagery and is available as a free PSD.

16. Flat Beach GUI

A summery, pastel-themed beach GUI from Mike Clarke, Flat Beach GUI is available as a free PSD and includes buttons, widgets and media components.

17. Flat UI Kit – Zachary VanDeHey

A summer-inspired UI Kit from Zachary VanDeHey, available as a Free Adobe Illustrator file, which features widgets, buttons, profiles, icons and a media player.

18. Design Shock Flat GUI

Flat-GUI

 

Design Shock’s Flat GUI is available in either a premium or free version, featuring an enormous number of components and elements.

19. UI Pixels Flat UI Widget

This is a responsive flat UI kit that uses only two colors, so it’s extremely easy to edit and comes packed with widgets and interface components. It is available as a free PSD.

20. Tempees Flat UI Kit

Tempees offers a flat UI design kit for your applications or websites, which includes various styles of buttons, icon menus, profile blocks and widgets. It is available as a free PSD download.

21. Eerste Flat UI Kit

A well-organized, free flat UI kit from Design Your Way, Eerste Flat UI Kit includes numerous graphical elements, including menus, social media profiles, comment forms, pricing tables, video players, calendars and more.

22. Metro UI Kit

The Metro UI Kit is another excellent free download from Tempees, and is a Microsoft Windows-inspired PSD featuring stats, charts, calendar, menus and search styles.

23. Flat UI Kit – Abhimanyu Rana

A gorgeously designed UI kit from Abhimanyu Rana pays great attention to detail and color, featuring widgets, media players and user profiles.

24. Flat UI – Andy Law

This impressive flat UI PSD is available for free download or on Creative Market (with lifetime updates). It features a slick color scheme, styling, media player, widgets and more.

25. UI Kit PSD – Piotr Kwiatkowski

A beautifully designed UI Kit from Piotr Kwiatkowski, this is available as a free PSD and features widgets, charts, galleries, maps and a checkout cart.

26. Simple & Bold UI Kit

Simple-Bold

 

Simple & Bold UI Elements is a free PSD kit from Gentian Edwards, featuring button states, news feeds, media players, list menus, sign-in panels, calendar widgets and more.

27. Flat UI/UX Kit – Asim Craft

A Flat UI Kit from Asim Craft of Vectornpixel, which contains form fields, buttons, navigation, photo hovers and more. It is available as a free PSD download.

28. Flat UI Kit PSD – Andreea Nicolaescu

This free UI elements kit from Andreea Nicolaescu features menus, media players, buttons, sign-in forms, calendars and dropdown lists, and is available as a free PSD download.

29. E-Commerce Flat UI Kit

The E-Commerce UI Kit is available as a free PSD download, and contains various UI elements for use in ecommerce projects, all of which are easily editable as shape layers.

30. Flat UI Elements – Andrew Beckwith

The Flat UI elements kit from Andrew Beckwith is a high quality free PSD, featuring gorgeously designed widgets and components with great attention to typography.

31. Polaris UI Kit

Polaris UI Free is a beautiful set of UI components that includes edit boxes, buttons, navigation and widgets for use in your design projects.

32. Free Flat UI Kit – Visual Creative

This is a free UI kit from Visual Creative that features a media player, buttons, a clock, login forms and user profiles. It is available as a PSD download.

33. Flat UI Kit PSD – Pro Web Design

Flat-UI-Kit-PSD

 

The Flat UI dashboard PSD from Pro Web Design is available for free and includes navigation, drop down user panels, area graphs, bar charts, circular segment graphs, input elements, range sliders, switches, buttons and widget areas.

34. Dark UI Kit – Hüseyin Yilmaz

Another high quality UI kit from Hüseyin Yilmaz, this one features a dark design, and includes social media buttons, widgets, contact forms and navigation.

35. Super Clean Flat UI Kit

This is a clean, well organized UI Kit from WeCreate, available as a Free PSD download. It is easily editable, containing several major interface components.

36. Flat UI PSD – Alexandre Crenn

This is a simple, well organized UI kit from Alexandre Crenn, which also features a flat iPhone wireframe design.


关注我

我的微信公众号:前端开发博客,在后台回复以下关键字可以获取资源。

  • 回复「小抄」,领取Vue、JavaScript 和 WebComponent 小抄 PDF
  • 回复「Vue脑图」获取 Vue 相关脑图
  • 回复「思维图」获取 JavaScript 相关思维图
  • 回复「简历」获取简历制作建议
  • 回复「简历模板」获取精选的简历模板
  • 回复「加群」进入500人前端精英群
  • 回复「电子书」下载我整理的大量前端资源,含面试、Vue实战项目、CSS和JavaScript电子书等。
  • 回复「知识点」下载高清JavaScript知识点图谱

每日分享有用的前端开发知识,加我微信:caibaojian89 交流