CSS3 Buttons : Simpel CSS3 Framework untuk Membuat Link Tombol Gaya GitHub

CSS3 memang mulai mempermudah kita dalam membangun sebuah website, mungkin dulu kita hanya mengenal dengan javascript framework, php framework, grid framework dll,  bisa dibilang sekarang sudah jamannya semuanya serba framework.

Kemaren saya menemukan sebuah framework yang hanya untuk sebuah tombol, CSS3 Button adalah framework sederhana untuk membuat sebuah link tombol gaya GitHub. Cara kerja framework ini cukuup sederhana, yaitu menggunakan class=”button” sedangkan untuk memanggil icon-iconnya cukup menambahkan nama class sesuai icon tersebut, mari kita lihat contohnya :

Class Contoh Tombol
.book View Log
.calendar Add to Calendar
.chat Start Chat
.check Approve Registration
.clock Register Work Time
.cog Settings
.comment Add Comment
.cross Remove Item
.downarrow Move Down
.fork Create Branch
.heart Add to Favorites
.home Back to Frontpage
.key Password Protect
.leftarrow Move Left
.lock Lock Article
.loop Resend Message
.magnifier Search
.mail Send Newsletter
.move Move
.pen Edit Post
.pin Pin to Map
.plus Add Post
.reload Reload Page
.rightarrow Move Right
.rss Subscribe to RSS Feed
.tag Add Tag
.trash Delete Post
.unlock Unlock Article
.uparrow Move Up
.user Add New User
Baca Juga:  Mengganti Scroll Browser dengan CSS3

Jadi, misalkan kita ingin menggunakan tombol kalender, kita cukup menuliskan :

// memanggil tombol saja
<a href="#" class="button">Kalender</a>

// memanggil tombol dengan icon kalender
<a href="#" class="button"><span class="calendar icon"></span>Kalender</a>

Hasil dari kode diatas adalah :

memanggil tombol saja
Kalender

memanggil tombol dengan icon kalender
Kalender

Cukup mudah bukan 🙂 Website ini sudah menggunakan CSS3 Button.

Download / Demo CSS3 Buttons Framework

Download / Demo CSS3 Buttons Framework

Lisensi : Unlicense

Komentar

comments

zulsdesign

Seorang Web Designer, Web Developer, Wordpress Development dan independen Blogger. Spesialisasi Personal Branding. Selalu haus akan ilmu tentang perkembangan dunia Web Design, Social Media, Online Marketing. Kadang-kadang juga berprofesi sebagai konsultan Website dadakan :)

grain storage instagram türk takipçi satın al