Skip to content Skip to sidebar Skip to footer

Materi 20 : Tutorial Pewarnaan dengan CSS

Tutorial Pewarnaan dengan CSS – Teknik pewarnaan dalam css itu ada beberapa macam, salah satunya adalah dengan menuliskan nama warnanya. Misal warna latarnya ingin warna merah, maka kita tulis background-color: red. Dan begitu pula jika ingin warna lainnya, cukup kita tuliskan nama warnanya saja.

Tutorial Pewarnaan dengan CSS

Pada pembahasan kali ini, kita akan coba belajar tentang teknik pewarnaan. Ada banyak teknik pewarnaan, namun yang akan kita pelajari adalah teknik yang paling sering kita jumpai dan tentunya sangat sederhana. Beberapa cara berikut ini bisa kalian gunakan

Color Hexa

Color hex atau color hexadecimal merupakan teknik pewarnaan dengan menggunakan bilangan hexadecimal yaitu 0123456789ABCDEF. Cara membuat sebuah warna dengan hexadecimal adalah dengan menuliskan baris seperti ini #RRGGBB yang artinya RR itu adalah Red, GG itu adalah Green dan BB adalah Blue. Nah, RRGGBB ini nantinya kita ubah dengan cara mengisikan baris hexadecimal yang ada di atas dan tentunya hanya memilih 6 angka atau huruf saja. Misalnya kita akan membuat warna blue, maka kode warna hexa nya adalah #0000FF. Bagaimana mengimplementasikannya ke dalam css, background-color: #0000FF. Kalian bisa mengkombinasikan angka dan huruf hexadecimal di atas dan sesuaikan dengan warna yang kalian inginkan. Kalian juga bisa memilih warna dengan menggunakan Color Picker.

Color RGB

Teknik pewarnaan dengan RGB ini cukup sederhana di bandingkan dengan yang Color Hexa. Namun hampir sama karena metodenya adalah dengan menggambungkan nilai warna dari RGB (Red Green Blue). Lalu bagaimana cara penulisan kode warna dengan menggunakan RGB ini? Caranya adalah dengan menuliskan rgb(nilai red, nilai green, nilai blue). Adapun untuk nilai parameter RGB ini adalah dengan menggunakan tipe data integer yaitu angka 0 sampai 255. Contoh untuk menghasilkan sebuah warna merah dengan cara Color RGB ini adalah rgb(255, 0, 0). Artinya untuk nilai red kita beri 255 dan untuk nilai green dan blue kita berikan 0. Sekarang coba tebak, warna apa yang akan dihasilkan oleh kode warna RGB ini rgb(55, 70, 0)?.

Color Name

Dari dua teknik pewarnaan yang tadi, teknik yang satu ini jauh lebih mudah. Karena kita cukup menuliskan nama warnanya. Seperti red, yellow, white, black dan lain sebagainya. Tapi tidak semua dari kita hafal nama – nama warna dalam bahasa inggris dan juga mungkin kita pernah melihat sebuah warna tapi kita tidak tau itu warna apa. Maka dari itu, teknik yang satu ini cukup terbatas saat kita menginginkan warna lain. Adapun penggunaan dari teknik ini sudah di ulas pada pembukaan tadi yaitu cukup menuliskan nama warna yang diinginkan.
Masing – masing teknik perwarnaan itu pasti punya kurang dan lebihnya, lagi pula teknik pewarnaan tidak Cuma 3 melainkan ada banyak sekali teknik pewarnaan  yang bisa digunakan.
Baiklah jika ada yang belum jelas tentang materi Tutorial Pewarnaan dengan CSS ini, silahkan tinggalkan pertanyaan kalian di kolom komentar di bawah ini. Semoga bermanfaat dan sampai jumpa di materi berikutnya.