Du hast deinen AdBlocker an?

Es wäre ein Traum, wenn du ihn für t3n.de deaktivierst. Wir zeigen dir gerne, wie das geht. Und natürlich erklären wir dir auch, warum uns das so wichtig ist. Digitales High-five, deine t3n-Redaktion

Entwicklung & Design

Kostenlose PSD-Vorlagen: 15 Button-Templates für deine Projekte

(Grafik: Shutterstock)

Buttons können das Erscheinungsbild einer Website entscheidend mit prägen, im guten wie im schlechten Sinne. Eine kleine Auswahl optisch besonders gut gelungener Exemplare in Form von kostenlosen PSD-Vorlagen stellen wir euch in diesem Artikel vor.

Egal, ob als Verweis zu Social-Media-Anwendungen, zum Starten einer Suchanfrage oder Absenden eines Kommentars – kaum eine Website, kaum ein Blog, Webshop oder Content-Management-System kommt ohne Buttons aus. Das ist mitunter ganz gut so.

HTML5 und CSS3 bieten heute von Haus aus schon diverse Möglichkeiten, mit Rundungen, Schatten, Transparenzen und anderen Spielereien gelungene Schaltflächen zu gestalten. Mit Anwendungen wie Photoshop sind der Kreativität keine Grenzen gesetzt und für grau-triste, uninspirierte Buttons gibt es eigentlich keine Entschuldigung mehr.

Ausgewählte Button-Designs im PSD-Format

Wir haben uns für euch nach sehenswerten Beispielen auf die Suche gemacht und tragen euch hier eine kleine, aber feine Auswahl von Buttons vor. Die gezeigten Vorlagen liegen alle im PSD-Format vor, sodass sie direkt übernommen oder bearbeitet werden oder auch als Inspiration dienen können.

Links zu den Websites, auf denen die PSD-Dateien zum Download bereitstehen, befinden sich in den Bildunterschriften sowie in den Beschreibungen in der Bildergalerie. Die ausgewählten PSD-Files sind allesamt sorgsam gegliedert und akkurat beschriftet, was die Wiederverwendung und das Editieren vereinfacht.

E-Commerce-Button-Set

Hier steht ein text
Set aus Social Media und Download-Buttons sowie Call-to-Action Slogans: http://sixrevisions.com.

Diese Zusammenstellung von Buttons aus dem E-Commerce-Kontext besticht durch harmonische Farbverläufe, Schattierungen, Beleuchtungseffekte und kraftvolle Farben. Das Set beinhaltet neben den hier im Bild dargestellten Buttons noch als Handschriften animierte Call-to-Action Slogans, die sich mit den Buttons kombinieren lassen.

UI-Komplettpaket White&Blue

Hier ein anderer Text
User Interface Komplettpaket in blau und grau:  http://www.psdchest.com.

Das farblich in modernem Blau-Grau gehaltene Set an UI-Elementen beinhaltet neben klassischen Buttons noch diverse weitere Elemente wie Lautstärkeregler, Checkboxen oder Toggle-Buttons. Somit bietet diese Zusammenstellung für jeden Anwendungsfall eine sorgfältig gearbeitete Lösung, die sich auch als Komplettpaket verwenden lässt.

Farbenfrohe Buttons für unterschiedliche Anwendungen

ebenso text
Sechs kostenlose PSD-Vorlagen für Buttons für verschiedene Zwecke: http://tempees.com.

Dieses kleine, aber feine Set beinhaltet nur sechs Buttons, die dafür aber umso gelungener gestaltet sind. Die Darstellung der Icons ist sehr präzise und und die gewählten Symbole aussagekräftig. Die Schattierungen der Schaltflächen hinterlassen ebenso wie die Beleuchtungseffekte einen sehr hochklassigen Eindruck.

Sticker-Button-Set

test
Verschiedenste Buttons im zweidimensionalen Sticker-Stil: http://xoo.me.

Ohne den Einsatz von Schlagschatten wirken die Buttons zweidimensional wie Sticker. Die Gestaltung der Icons ist teils sehr minimalistisch, bei den Buttons, die zum Dateidownload anregen, wiederum sehr präzise und detailliert.

Toggle-Buttons für soziale Netzwerke

text
Toggle-Buttons für neun Social Media Sites: http://xoo.me.

Die hier dargestellte Sammlung besteht aus 18 Toggle-Buttons von neun verschiedenen Social-Media-Sites. Zu jedem Button wird jeweils der aktivierte und der deaktivierte Status dargestellt. Die Icons sind präzise gestaltet und erwecken durch die Schattierungen die Illusion von Dreidimensionalität.

Kostenlose PSD-Vorlagen: 10 weitere Button-Templates für Photoshop

1 von 10

Noch mehr kostenlose PSD-Vorlagen

Weitere sehenswerte für die Bearbeitung in Photoshop erstellte Vorlagen findet ihr zum Beispiel in unseren Artikeln „Diese 15 Web-Templates musst du gesehen haben“ oder „10 kostenlose Logo-Vorlagen, die das Designerherz höher schlagen lassen“.

Finde einen Job, den du liebst

Bitte beachte unsere Community-Richtlinien

5 Reaktionen
https://hipp.design

Lieber graue bzw. einfarbige Buttons als diese hier.

Antworten
Matze

Willkommen in den 90ern !

Antworten
Kort Inaten

Das dachte ich mir auch. Das Design der vorgestellten Elemente ist altbacken und obsolet.

Antworten
WeSiDe

Spätestens seit den CSS3-Möglichkeiten sind grafische Buttons generell überflüssig.

Benny Lava

Wird schon seinen Grund haben, warum die kostenlos sind.

Antworten

Melde dich mit deinem t3n-Account an oder fülle die unteren Felder aus.

Abbrechen