Kode Warna HTML dan Cara Menggunakannya
Kode Warna HTML memang sangat di butuhkan untuk keperluan design tampilan blog meskipun tidak semua Blogger mengerti bagaimana cara menggunakan kode warna dalam dalam format HTML tersebut.
Oleh sebab itu tidak ada salahnya Saya tuliskan kembali kode warna lengkap sekaligus cara menggunakannya,melengkapi beberapa tulisan yang sudah eksis di internet sebelumnya.
Di awal-awal Saya mengenal dunia Blogging beberapa tahun yang lalu. Saya sangat penasaran dengan blog milik para webmaster kawakan yang berkeliaran di dunia internet.
Yang membuat penasaran adalah variasi warna yang di gunakan dalam menulis artikel mereka.
Dalam benak saya selalu berseliweran pertanyaan,"Kok Bisa Ya...?",hehe...
Berawal dari rasa penasaran tersebut di atas,Saya pun mulai browsing kesana kemari untuk sekedar mengetahui bagaimana cara membuat postingan artikel Blog dengan variasi tulisan berwarna.
Dasar Google serba tahu. Akhirnya pertanyaan Saya pun terjawab sudah.
Maklum,kan baru mengenal dunia blogging,jadi masalah yang lumayan sepele ini pun membuat penasaran.
Dan jawaban dari pertanyaan saya tersebut di atas ternyata hanya dengan menggunakan kode-kode Warna HTML seperti yang akan saya tampilkan di bawah ini.
Silahkan Anda lihat kode-kode warna CSS berikut,kemudian mulailah untuk belajar berkreasi dengan kode-kode warna ini.
Lalu bagaimana cara menggunakan kode warna CSS tersebut untuk di terapkan pada Blog?
Untuk mempraktikanya silahkan Anda perhatikan dengan cermat cara pemakaiannya berikut.
✔ Misalkan Saya ingin membuat kalimat berwarna merah,maka kode yang akan Saya pakai seperti ini.
<font color='#00ffff'>ISI KALIMAT YANG DI INGINKAN DI SINI</font>
Dan hasilnya akan seperti ini :
ISI KALIMAT YANG DI INGINKAN DI SINI
✔ Kalimat berwarna orange,maka kode yang di pakai seperti ini.
<font color='#FFA500'>ISI KALIMAT YANG DI INGINKAN DI SINI</font>
Hasilnya seperti ini :
ISI KALIMAT YANG DI INGINKAN DI SINI
Contoh di atas memperlihatkan kepada kita bahwa membuat tulisan berwarna di postingan blog tidaklah susah,bahkan di bilang sangat mudah.
Saya yakin setelah Anda melihat contoh di atas,pasti Anda sudah merasakan kemudahanya bukan?
Kode warna di atas tidak hanya di gunakan untuk membuat tulisan atau kalimat berwarna saja,tapi masih banyak lagi kegunaanya.
Seperti untuk membuat warna background website atau blog,background tabel,dan masih banyak lagi kegunaanya.jika saya tulis di sini semuanya,maka artikel ini tentulah sangat panjang.
Tapi baiklah,akan Saya kasih satu contoh lagi kegunaan kode warna HTML ini.
✔ Berikut adalah kode yang Saya pakai untuk membuat background tabel warna di atas :
Hasilnya seperti ini :
Nah sekarang cobalah berkreasi sendiri untuk menggunakan kode warna html ini.kalau sekedar di baca,maka hasilnya percuma saja.jadi praktekkan sekarang juga!
Oleh sebab itu tidak ada salahnya Saya tuliskan kembali kode warna lengkap sekaligus cara menggunakannya,melengkapi beberapa tulisan yang sudah eksis di internet sebelumnya.
Di awal-awal Saya mengenal dunia Blogging beberapa tahun yang lalu. Saya sangat penasaran dengan blog milik para webmaster kawakan yang berkeliaran di dunia internet.
Yang membuat penasaran adalah variasi warna yang di gunakan dalam menulis artikel mereka.
Dalam benak saya selalu berseliweran pertanyaan,"Kok Bisa Ya...?",hehe...
Berawal dari rasa penasaran tersebut di atas,Saya pun mulai browsing kesana kemari untuk sekedar mengetahui bagaimana cara membuat postingan artikel Blog dengan variasi tulisan berwarna.
Dasar Google serba tahu. Akhirnya pertanyaan Saya pun terjawab sudah.
Maklum,kan baru mengenal dunia blogging,jadi masalah yang lumayan sepele ini pun membuat penasaran.
Dan jawaban dari pertanyaan saya tersebut di atas ternyata hanya dengan menggunakan kode-kode Warna HTML seperti yang akan saya tampilkan di bawah ini.
Kode Warna HTML
Silahkan Anda lihat kode-kode warna CSS berikut,kemudian mulailah untuk belajar berkreasi dengan kode-kode warna ini.
| BLACK DAN SAUDARA-SAUDARANYA | ||
|---|---|---|
| Name | Code | Color |
| Black | #000000 | |
| Dark Slate Gray | #2F4F4F | |
| Slate Gray | #708090 | |
| Light Slate Gray | #778899 | |
| Dim Gray | #696969 | |
| Gray | #808080 | |
| Dark Gray | #A9A9A9 | |
| Silver | #C0C0C0 | |
| Light Gray | #D3D3D3 | |
| Gainsboro | #DCDCDC | |
| RED DAN SAUDARA-SAUDARANYA | ||
| Name | Code | Color |
| Dark Red | #8B0000 | |
| Fire Brick | #B22222 | |
| Red | #FF0000 | |
| Crimson | #DC143C | |
| Light Salmon | #FFA07A | |
| Dark Salmon | #E9967A | |
| Salmon | #FA8072 | |
| Light Coral | #F08080 | |
| Indian Red | #CD5C5C | |
| PINK DAN SAUDARA-SAUDARANYA | ||
| Name | Code | Color |
| Pale Violet Red | #DB7093 | |
| Medium Violet Red | #C71585 | |
| Deep Pink | #FF1493 | |
| Hot Pink | #FF69B4 | |
| Light Pink | #FFB6C1 | |
| Pink | #FFC0CB | |
| ORANGE DAN SAUDARA-SAUDARANYA | ||
| Name | Code | Color |
| Orange | #FFA500 | |
| Dark Orange | #FF8C00 | |
| Orange Red | #FF4500 | |
| Tomato | #FF6347 | |
| Coral | #FF7F50 | |
| YELLOW DAN SAUDARA-SAUDARANYA | ||
| Name | Code | Color |
| Dark Khaki | #BDB76B | |
| Khaki | #F0E68C | |
| Pale Goldenrod | #EEE8AA | |
| Peach Puff | #FFDAB9 | |
| Moccasin | #FFE4B5 | |
| Papaya Whip | #FFEFD5 | |
| Light Goldenrod Yellow | #FAFAD2 | |
| Lemon Chiffon | #FFFACD | |
| Light Yellow | #FFFFE0 | |
| Yellow | #FFFF00 | |
| Gold | #FFD700 | |
| GREEN DAN SAUDARA-SAUDARANYA | ||
| Name | Code | Color |
| Teal | #008080 | |
| Dark Cyan | #008B8B | |
| Light Sea Green | #20B2AA | |
| Dark Sea Green | #8FBC8F | |
| Medium Aquamarine | #66CDAA | |
| Dark Olive Green | #556B2F | |
| Olive | #808000 | |
| Olive Drab | #6B8E23 | |
| Yellow Green | #9ACD32 | |
| Dark Green | #006400 | |
| Green | #008000 | |
| Forest Green | #228B22 | |
| Sea Green | #2E8B57 | |
| Medium Sea Green | #3CB371 | |
| Spring Green | #00FF7F | |
| Medium Spring Green | #00FA9A | |
| Light Green | #90EE90 | |
| Pale Green | #98FB98 | |
| Lime Green | #32CD32 | |
| Lime | #00FF00 | |
| Lawn Green | #7CFC00 | |
| Chartreuse | #7FFF00 | |
| Green Yellow | #ADFF2F | |
| BLUE DAN SAUDARA-SAUDARANYA | ||
| Name | Code | Color |
| Midnight Blue | #191970 | |
| Navy | #000080 | |
| Dark Blue | #00008B | |
| Medium Blue | #0000CD | |
| Blue | #0000FF | |
| RoyalBlue | #4169E1 | |
| Medium Slate Blue | #7B68EE | |
| Cornflower Blue | #6495ED | |
| Dodger Blue | #1E90FF | |
| Deep Sky Blue | #00BFFF | |
| Light Sky Blue | #87CEFA | |
| Sky Blue | #87CEEB | |
| Light Blue | #ADD8E6 | |
| Powder Blue | #B0E0E6 | |
| Light Steel Blue | #B0C4DE | |
| Steel Blue | #4682B4 | |
| Cadet Blue | #5F9EA0 | |
| Dark Turquoise | #00CED1 | |
| Medium Turquoise | #48D1CC | |
| Turquoise | #40E0D0 | |
| Aquamarine | #7FFFD4 | |
| Pale Turquoise | #AFEEEE | |
| Light Cyan | #E0FFFF | |
| Cyan | #00FFFF | |
| Aqua | #00FFFF | |
| PURPLE DAN SAUDARA-SAUDARANYA | ||
| Name | Code | Color |
| Medium Slate Blue | #7B68EE | |
| Dark Slate Blue | #483D8B | |
| Slate Blue | #6A5ACD | |
| Indigo | #4B0082 | |
| Purple | #800080 | |
| Dark Magenta | #8B008B | |
| Dark Orchid | #9932CC | |
| Dark Violet | #9400D3 | |
| Blue Violet | #8A2BE2 | |
| Amethyst | #9966CC | |
| Medium Purple | #9370DB | |
| Medium Orchid | #BA55D3 | |
| Magenta / Fuchsia | #FF00FF | |
| Orchid | #DA70D6 | |
| Violet | #EE82EE | |
| Plum | #DDA0DD | |
| Thistle | #D8BFD8 | |
| Lavender | #E6E6FA | |
| BROWN DAN SAUDARA-SAUDARANYA | ||
| Name | Code | Color |
| Maroon | #800000 | |
| Brown | #A52A2A | |
| Sienna | #A0522D | |
| Saddle Brown | #8B4513 | |
| Chocolate | #D2691E | |
| Peru | #CD853F | |
| Dark Goldenrod | #B8860B | |
| Goldenrod | #DAA520 | |
| Sandy Brown | #F4A460 | |
| Rosy Brown | #BC8F8F | |
| Tan | #D2B48C | |
| Burly Wood | #DEB887 | |
| Wheat | #F5DEB3 | |
| Navajo White | #FFDEAD | |
| Bisque | #FFE4C4 | |
| Blanched Almond | #FFEBCD | |
| Cornsilk | #FFF8DC | |
| WHITE DAN SAUDARA-SAUDARANYA | ||
| Name | Code | Color |
| Misty Rose | #FFE4E1 | |
| Lavender Blush | #FFF0F5 | |
| Linen | #FAF0E6 | |
| Antique White | #FAEBD7 | |
| Ivory | #FFFFF0 | |
| Floral White | #FFFAF0 | |
| Old Lace | #FDF5E6 | |
| Beige | #F5F5DC | |
| Seashell | #FFF5EE | |
| White Smoke | #F5F5F5 | |
| Ghost White | #F8F8FF | |
| Alice Blue | #F0F8FF | |
| Azure | #F0FFFF | |
| Mint Cream | #F5FFFA | |
| Honeydew | #F0FFF0 | |
| Snow | #FFFAFA | |
| White | #FFFFFF | |
Cara Menggunakan Kode Warna HTML
Lalu bagaimana cara menggunakan kode warna CSS tersebut untuk di terapkan pada Blog?
Untuk mempraktikanya silahkan Anda perhatikan dengan cermat cara pemakaiannya berikut.
✔ Misalkan Saya ingin membuat kalimat berwarna merah,maka kode yang akan Saya pakai seperti ini.
<font color='#00ffff'>ISI KALIMAT YANG DI INGINKAN DI SINI</font>
Dan hasilnya akan seperti ini :
ISI KALIMAT YANG DI INGINKAN DI SINI
✔ Kalimat berwarna orange,maka kode yang di pakai seperti ini.
<font color='#FFA500'>ISI KALIMAT YANG DI INGINKAN DI SINI</font>
Hasilnya seperti ini :
ISI KALIMAT YANG DI INGINKAN DI SINI
Contoh di atas memperlihatkan kepada kita bahwa membuat tulisan berwarna di postingan blog tidaklah susah,bahkan di bilang sangat mudah.
Saya yakin setelah Anda melihat contoh di atas,pasti Anda sudah merasakan kemudahanya bukan?
Kode warna di atas tidak hanya di gunakan untuk membuat tulisan atau kalimat berwarna saja,tapi masih banyak lagi kegunaanya.
Seperti untuk membuat warna background website atau blog,background tabel,dan masih banyak lagi kegunaanya.jika saya tulis di sini semuanya,maka artikel ini tentulah sangat panjang.
Tapi baiklah,akan Saya kasih satu contoh lagi kegunaan kode warna HTML ini.
✔ Berikut adalah kode yang Saya pakai untuk membuat background tabel warna di atas :
<table><tr bgcolor='#ff0000'><th colspan='3' >RED DAN SAUDARA-SAUDARANYA</th></tr><tr bgcolor='#eee'><td>Name</td><td>Code</td><td>Color</td></tr><tr><td>Dark Red</td><td>#8B0000</td><td bgcolor='8B0000'></td></tr></table>
Hasilnya seperti ini :
| RED DAN SAUDARA-SAUDARANYA | ||
|---|---|---|
| Name | Code | Color |
| Dark Red | #8B0000 | |
Nah sekarang cobalah berkreasi sendiri untuk menggunakan kode warna html ini.kalau sekedar di baca,maka hasilnya percuma saja.jadi praktekkan sekarang juga!
Posting Komentar untuk "Kode Warna HTML dan Cara Menggunakannya"
PERHATIAN ... ! Komentar dengan menyertakan link aktif akan terhapus secara otomatis.