Kode Warna untuk Blog

Setelah beberapa hari lalu saya merilis (jiaa kesannya) desain simple dengan basis warna hitam dan putih. Ngga sedikit ya yang pengen punya juga dengan warna favorit hehehe. Sebetulnya, desain yang saya buat itu adalah basic. Maksudnya mudah di customize untuk diganti dengan warna lainnya. Tapi tentu saja dengan mempertimbangkan kombinasi warna yang dipakai. Jadi usahakan hanya memakai maksimal tiga warna untuk mempertahankan kesan minimalis. Warna putih sudah seharusnya menjadi warna utama. Karena warna putih paling mudah dikombinasikan dengan warna apapun.

Untuk mengganti warnanya cukup mudah ya. Kita hanya perlu mengetahui kode warna (hex code) untuk diterapkan pada template tersebut. Kode yang dibutuhkan adalah kode yang diawali tagar dan enam huruf/angka untuk membentuk warna yang dapat terbaca oleh browser. Contohnya untuk kode warna hitam adalah #000000 dan kode warna putih adalah #FFFFFF. Nah untuk kode warna lain, sudah saya buatkan. Buat yang membutuhkan bisa contek kode warnanya disini :

hex-code

Kalau masih ada yang kurang puas dengan kombinasi warnanya bisa atau belum nemu warna kesukaannya bisa lihat warna lainnya diΒ http://design-seeds.com/. Cara lihat warnanya bisa dicek disini. Selamat hunting warna yah hehehe.

Kalau udah siapin warna apa yang mau dipakai, gimana sih caranya ganti di template basic hitam putih itu?. Caranya mudah banget, silahkan cari kode berikut yang sudah dicopy ke blog template designer :

/* Edit Judul Widget */

h2 {

margin: 0 0 1em 0;

font: 13px ‘Lato’,sans-serif;

color: #fff;

text-align: center;

background: #000;

padding: 0.5em 0;

text-transform: lowercase;

}

Kemudian ganti item BACKGROUND: #000; dengan warna pilihan. Jadi kalau misalnya pengen background ungu (duh ungu hahaha #ditimpukin) kodenya akan jadi —> background: #825CA1; udah gitu doang hehehe. Tapi jangan salah ya, bukan item color yang diganti. Karena color tersebut mengindentifikasi warna font bukan background. Sedangkan untuk mengganti judul Header bisa menambahkan item pada kode ( color: #KodeWarna ) seperti dibawah ini :

/* Judul Blog */

.Header h1 {

text-align: center;

font: 70px ‘Lily Script One’, cursive;

text-shadow: 0 0 0 rgba(0, 0, 0, 0.2);

color: KODE WARNA;

}

Gimana sudah cukup jelas. Bisa juga kok berekperimen dengan warna dan kode yang sudah saya kasi. Jadi pastikan hanya mengganti pada bagian color atau background atau apapun yang membutuhkan kode warna. Begitu juga dengan template designer yang bisa kita input sesuai warna favorit kita (untuk menu). Kalau ada pertanyaan silahkan tinggalkan komentar yaa ^^.

Advertisements

8 thoughts on “Kode Warna untuk Blog

  1. wah saya suka otak atik template mak, pengen rombak total ala themes-nya mak Shinta yg simple begini, izin ubek2 blognya ya mak, semoga bisa biin sendiri, kalo nggak izin banyak tanya nanti ya mak hehehe

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s