t3n News Design

UI-Kit: Die große t3n-Übersicht

UI-Kit: Die große t3n-Übersicht

UI-Kits sind eine gute Anlaufstelle zur Inspiration für neue Projekte. Im Web gibt es unzählige UI-Kits zum freien und wir haben für euch zwölf herausgesucht.

UI-Kit: Die große t3n-Übersicht

Zwölf UI-Kits. (Screenshot: Behance)

UI-Kits: Holt euch Inspiration fürs nächste Projekt

UI-Kits vereinen eine mal größere und mal kleinere Zahl an ausgestalteten User-Interface-Elementen. Damit sind sie gut geeignet um sich für die eigene Arbeit Dinge abzuschauen oder auch Elemente zu übernehmen (soweit es vom Designer des UI-Kits erlaubt ist). Wir haben uns für euch mal umgeschaut und ein paar Kits zusammengetragen, die uns gefallen haben.

Da Flat Design immer noch sehr angesagt ist sind die meisten der UI-Kits in dem Design-Stil gehalten oder wenigstens an ihn angelehnt.

Clean White

Das UI-Kit „Clean White“ von Tomasz Mazurczak bietet über 55 überwiegend hell gestaltete Elemente im Flat Design zum kostenlosen Download für private und kommerzielle Nutzung. Ihr erhaltet eine PSD-Datei.

„Clean white“ – UI-Kit von Tomasz Mazurczak. (Screenshot: Behance)
„Clean white“ – UI-Kit von Tomasz Mazurczak. (Screenshot: Behance)

Free Material UI-Kit

Im Material Design ist das UI-Kit „Free Material UI-Kit“ von Al Rayhan gestaltet. Im Download sind zehn Elemente enthalten, die im PSD-Format vorliegen.

„Free Material UI-Kit“ von Al Rayhan im Material Design. (Screenshot: PSDboom)
„Free Material UI-Kit“ von Al Rayhan im Material Design. (Screenshot: PSDboom)

Almost Flat UI

Bei „Almost Flat UI“ von Amit Gaur handelt es sich quasi um ein Live-UI-Kit, das mit Foundation erstellt wurde. Der große Vorteil ist hier, dass auch gleich Interaktionen integriert sind und es keine statische Datei ist.

„Almost Flat UI“ von Amit Gaur ist ein UI-Kit, mit dem ihr gleich im Browser arbeiten könnt. (Screenshot: websymphony.net)
„Almost Flat UI“ von Amit Gaur ist ein UI-Kit, mit dem ihr gleich im Browser arbeiten könnt. (Screenshot: websymphony.net)

Flat UI-Kit

Wieder vollkommen im Flat Design ist dieses UI-Kit von Sebastiaan Scheer gestaltet.

Dieses UI-Kit von Sebastiaan Scheer ist wieder komplett flach gestaltet. (Screenshot: Dribbble)
Dieses UI-Kit von Sebastiaan Scheer ist wieder komplett flach gestaltet. (Screenshot: Dribbble)

Flat dashboard

Im Namen steht zwar Flat, doch ganz flach ist es nicht. „Free flat UI dashboard by Prowebdesign“ stellt euch ein Design für ein Dashboard mit sechs verschiedenen UI-Elementen zur Verfügung.

„Flat dashboard“ von Prowebdesign. (Screenshot: prowebdesign.ro)
„Flat dashboard“ von Prowebdesign. (Screenshot: prowebdesign.ro)

Responsive Ui-Kit(PSD)

Ziemlich blau wirds bei diesem UI-Kit von Uipixels – alle Elemente sind in einigen wenigen Blautönen gehalten.

Alles so schön blau hier. (Screenshot: uipixels.com)
Alles so schön blau hier. (Screenshot: uipixels.com)

Android Material Design UI-Kit

Mal zur Abwechslung keine PSD-Datei zum Download sonder etwas für Nutzer von Sketch: Dieses UI-Kit von Ivan Bjelajac bietet euch verschiedene UI-Elemente im Material Design.

UI-Kit im Material Design für Sketch-Nutzer. (Screenshot: sketchappsources.com)
UI-Kit im Material Design für Sketch-Nutzer. (Screenshot: sketchappsources.com)

Eventray Free UI-Kit

Wieder Blau wird es bei diesem UI-Kit von Stanislav Hristov und Dtail Studio, das auf Event-Sites ausgelegt ist.

Umfangreiches UI-Kit unter anderem auch mit einem Timeline-Design. (Screenshot: http://dtailstudio.com)
Umfangreiches UI-Kit unter anderem auch mit einem Timeline-Design. (Screenshot: http://dtailstudio.com)

Tethr

Mit über 250 UI-Elementen sehr umfangreich und für Photoshop sowie Sketch zu haben ist „Tethr“, ein iOS-UI-Kit von ui8.

Ein sehr umfangreiches UI-Kit für iOS. (Screenshot: invisionapp.com)
Ein sehr umfangreiches UI-Kit für iOS. (Screenshot: invisionapp.com)

Futurico

Dieses UI-Kit, entworfen von Vladimir Kudinov und gecoded von Sergii Iurevych ist wieder ein Kit von Elementen, die direkt in HTML/CSS vorliegen.

Mal ganz weg vom Flat Design: Futurico. (Screenshot: railsware.com)
Mal ganz weg vom Flat Design: Futurico. (Screenshot: railsware.com)

Azure UI Kit

Bei dem UI-Kit Azure von Yolqin Alimov werden teilweise auch schon ganze Seiten-Layouts gezeigt.

Das UI-Kit Azure liefert auch ein paar fertige Layouts. (Screenshot: http://graphicburger.com)
Das UI-Kit Azure liefert auch ein paar fertige Layouts. (Screenshot: http://graphicburger.com)

Landing page for restaurant

Dieses UI-Kit von Volodymyr Kurbatov setzt auf den Einsatz großer Bilder und zeigt verschiedene Arten von UI-Blöcken für Landingpages von Restaurants.

Ein UI-Kit für Landingpages von Restaurante. (Screenshot: Behance)
Ein UI-Kit für Landingpages von Restaurante. (Screenshot: Behance)

Diese Übersicht ist natürlich sehr subjektiv und beleuchtet nur einen sehr kleinen Teil der großen Menge an UI-Kits, die es frei im Web gibt. Wenn ihr ein UI-Kit kennt, das unbedingt noch genannt werden sollte, dann schreibt es doch in einen Kommentar!

Dieser Artikel ist eine Überarbeitung eines Artikels aus dem Jahr 2013. Autor des Originalartikels ist Ilja Zaglov.

Newsletter Newsletter

Abonniere unseren Newsletter und erhalte einen exklusiven Artikel aus dem aktuellen t3n Magazin.

Jetzt lesen: t3n Newsletter Nr. 562

Vorheriger Artikel Zurück zur Startseite Nächster Artikel
9 Antworten
  1. von feenhaar am 03.05.2013 (11:50 Uhr)

    supi, diese Tipps haben mir noch gefehlt für meine Recherche zu einem neuen Artikel: Gestaltung von Online Shops optimieren. Danke - Link bereits als Tipp eingebaut. LG Susangeli

    Antworten Teilen
  2. von Inkassounternehmen am 05.05.2013 (11:49 Uhr)

    Wirklich ein toller Tip! Das sind wirklich sehr gute Designideen bei!

    Antworten Teilen
  3. von Designophil am 05.05.2013 (18:42 Uhr)

    Vor allem "Freebie PSD: Flat UI Kit" und das "UI Kit" halte ich für optisch sehr gelungen. Ausgewogene und stimmige Farbpalette, nette Details und insgesamt einfach professionell gestaltet. Danke für diese tollen Tipps.

    Antworten Teilen
  4. von Jens Richter am 06.05.2013 (20:03 Uhr)

    Super Sammlung um sich inspirieren zu lassen :)

    Antworten Teilen
  5. von CRIGO am 21.10.2013 (11:25 Uhr)

    Schöne Sammlung, vielen Dank für's Teilen!

    Antworten Teilen
  6. von nullzwoelf am 13.12.2013 (01:50 Uhr)

    Nett, aber warum legen die das alle als PSD an? Vektoren sind doch viel effektiver.

    Antworten Teilen
  7. von Jakobrohlaender am 26.07.2014 (19:13 Uhr)

    Tolle Sammlung, aber zum In­s­pi­rie­ren nutze ich lieber Dribbble.com

    Antworten Teilen
  8. von MarcHe am 14.06.2015 (10:39 Uhr)

    Danke für die Überarbeitung, tolle Sachen dabei

    Antworten Teilen
Deine Meinung

Bitte melde dich an!

Du musst angemeldet sein, um einen Kommentar schreiben zu können.

Jetzt anmelden

Mehr zum Thema Download
Was Google alles weiß: Lade dir deinen kompletten Suchverlauf runter
Was Google alles weiß: Lade dir deinen kompletten Suchverlauf runter

Einsehen konnten Google-Nutzer ihren Suchverlauf schon länger. Jetzt aber ist erstmals ein Download der kompletten Historie möglich – das kann allerdings leicht peinlich werden. » weiterlesen

Schicke kostenlose Social-Media-Buttons im Responsive Design für deine Website
Schicke kostenlose Social-Media-Buttons im Responsive Design für deine Website

An Social-Media-Buttons scheiden sich die Geister. Bei diesen schicken Buttons im Responsive Design dürften aber selbst Zweifler schwach werden. » weiterlesen

30 kostenlose WordPress-Themes für Responsive Design
30 kostenlose WordPress-Themes für Responsive Design

Das Angebot an kostenlosen Templates für die eigene Website wächst stetig. Auch die Auswahl an Wordpress-Themes, die Responsive Webdesign unterstützen, ist inzwischen beachtlich. » weiterlesen

Alle Hefte Jetzt abonnieren – für nur 35 €

Kennst Du schon unser t3n Magazin?

t3n 40 jetzt kostenfrei probelesen! Alle Inhalte des t3n Magazins Diesen Hinweis verbergen