Cara Penulisan Kode Warna RGB




Cara Penulisan Kode Warna RGB

Cara Penulisan Kode Warna RGB: CSS masih memiliki kode warna lain yang disebut dengan RGBA. Pada kesempatan kita akan membahas Pengertian dan Cara Penulisan Kode Warna RGB

Pengertian Kode Warna RGB
Bila kode warna RGB merupakan singkatan dari Red Green Blue, maka kode warna RGBA adalah singkatan dari Red Green Blue Alpha. Tambahan kata Alpha disini merujuk kepada alpha channel. Alpha channel adalah sebuah metode untuk menentukan tingkat transparan sebuah warna, yakni apakah sebuah warna akan melewatkan objek lain dibelakangnya atau tidak.

Untuk nilai dari alpha 0 akan membuat sebuah warna menjadi transparan (tembus pandang), dan nilai alpha 1 akan membuat warna pekat dan tidak akan melewatkan objek lain dibelakangnya (ini merupakan nilai default). Jika kita dapat membuat nilai alpha berada diantara 0 dan 1, dengan penulisan desimal seperti 0.5, 0.6, dan 0.9. Dengan demikian kita bisa membuat efek “tembus” dengan CSS, terutama untuk beberapa objek yang saling bertumpuk.

Berikut kode CSS Lengkap berdasarkan berdasarkan kode hexadecimal dan kode RGB. Referensi kode warna dibawah berdasarkan sumber dari situs w3schools yang telah saya tambahkan dengan kode RGB.    

 Nama WarnaHEXRGB
 
Alice Blue#F0F8FFrgb(240, 248, 254)
 
Antique White#FAEBD7rgb(251, 235, 217)
 
Aqua#00FFFFrgb(0, 255, 254)
 
Aquamarine#7FFFD4rgb(115, 255, 216)
 
Azure#F0FFFFrgb(239, 255, 255)
 
Beige#F5F5DCrgb(245, 245, 223)
 
Bisque#FFE4C4rgb(255, 227, 200)
 
Black#000000rgb(0, 0, 0)
 
Blanched Almond#FFEBCDrgb(255, 234, 208)
 
Blue#0000FFrgb(0, 0, 255)
 
Blue Violet#8A2BE2rgb(138, 43, 226)
 
Brown#A52A2Argb(165, 42, 42)
 
Burly Wood#DEB887rgb(222, 184, 135)
 
Cadet Blue#5F9EA0rgb(95, 158, 160)
 
Chartreuse#7FFF00rgb(127, 255, 1)
 
Chocolate#D2691Ergb(210, 105, 30)
 
Coral#FF7F50rgb(251, 127, 80)
 
Cornflower Blue#6495EDrgb(100, 149, 237)
 
Cornsilk#FFF8DCrgb(225, 248, 220)
 
Crimson#DC143Crgb(220, 20, 60)
 
Cyan#00FFFFrgb(62, 254, 255)
 
Dark Blue#00008Brgb(0, 0, 139)
 
Dark Cyan#008B8Brgb(29, 139, 139)
 
Dark Golden Rod#B8860Brgb(184, 134, 11)
 
Dark Gray#A9A9A9rgb(169, 169, 169)
 
Dark Green#006400rgb(19, 100, 0)
 
Dark Khaki#BDB76Brgb(189, 183, 107)
 
Dark Magenta#8B008Brgb(139, 0, 140)
 
Dark Olive Green#556B2Frgb(85, 107, 47)
 
Dark Orange#FF8C00rgb(251, 140, 1)
 
Dark Orchid#9932CCrgb(153, 50, 204)
 
Dark Red#8B0000rgb(139, 5, 0)
 
Dark Salmon#E9967Argb(233, 150, 122)
 
Dark Sea Green#8FBC8Frgb(143, 188, 144)
 
Dark Slate Blue#483D8Brgb(72, 61, 139)
 
Dark Slate Gray#2F4F4Frgb(47, 79, 79)
 
Dark Turquoise#00CED1rgb(48, 206, 209)
 
Dark Violet#9400D3rgb(148, 0, 211)
 
Deep Pink#FF1493rgb(249, 19, 147)
 
Deep Sky Blue#00BFFFrgb(43, 191, 254)
 
Dim Gray#696969rgb(105, 105, 105)
 
Dodger Blue#1E90FFrgb(30, 144, 255)
 
Fire Brick#B22222rgb(178, 34, 33)
 
Floral White#FFFAF0rgb(255, 250, 240)
 
Forest Green#228B22rgb(34, 139, 35)
 
Fuchsia#FF00FFrgb(249, 0, 255)
 
Gainsboro#DCDCDCrgb(220, 220, 220)
 
Ghost White#F8F8FFrgb(248, 248, 255)
 
Gold#FFD700rgb(253, 215, 3)
 
Golden Rod#DAA520rgb(218, 165, 32)
 
Gray#808080rgb(128, 128, 128)
 
Green#008000rgb(27, 128, 1)
 
Green Yellow#ADFF2Frgb(173, 255, 48)
 
Honey Dew#F0FFF0rgb(240, 255, 240)
 
Hot Pink#FF69B4rgb(240, 255, 240)
 
Indian Red#CD5C5Crgb(205, 92, 92)
 
Indigo#4B0082rgb(75, 0, 130)
 
Ivory#FFFFF0rgb(255, 255, 239)
 
Khaki#F0E68Crgb(240, 230, 140)
 
Lavender#E6E6FArgb(230, 230, 250)
 
Lavender Blush#FFF0F5rgb(254, 240, 245)
 
Lawn Green#7CFC00rgb(124, 252, 2)
 
Lemon Chiffon#FFFACDrgb(255, 250, 205)
 
Light Blue#ADD8E6rgb(173, 216, 230)
 
Light Coral#F08080rgb(240, 128, 128)
 
Light Cyan#E0FFFFrgb(224, 255, 255)
 
Light Golden Rod Yellow#FAFAD2rgb(250, 250, 210)
 
Light Gray#D3D3D3rgb(211, 211, 211)
 
Light Green#90EE90rgb(144, 238, 144)
 
Light Pink#FFB6C1rgb(252, 182, 193)
 
Light Salmon#FFA07Argb(251, 160, 122)
 
Light Sea Green#20B2AArgb(40, 178, 170)
 
Light Sky Blue#87CEFArgb(135, 206, 250)
 
Light Slate Gray#778899rgb(119, 136, 153)
 
Light Steel Blue#B0C4DErgb(176, 196, 222)
 
Light Yellow#FFFFE0rgb(255, 255, 224)
 
Lime#00FF00rgb(63, 255, 0)
 
Lime Green#32CD32rgb(50, 205, 50)
 
Linen#FAF0E6rgb(250, 240, 230)
 
Magenta#FF00FFrgb(249, 0, 255)
 
Maroon#800000rgb(128, 4, 0)
 
Medium Aqua Marine#66CDAArgb(102, 205, 170)
 
Medium Blue#0000CDrgb(0, 0, 205)
 
Medium Orchid#BA55D3rgb(186, 85, 211)
 
Medium Purple#9370DBrgb(147, 112, 219)
 
Medium Sea Green#3CB371rgb(60, 179, 113)
 
Medium Slate Blue#7B68EErgb(123, 103, 238)
 
Medium Spring Green#00FA9Argb(62, 250, 153)
 
Medium Turquoise#48D1CCrgb(72, 209, 204)
 
Medium Violet Red#C71585rgb(199, 21, 133)
 
Midnight Blue#191970rgb(25, 25, 112)
 
Mint Cream#F5FFFArgb(245, 255, 250)
 
Misty Rose#FFE4E1rgb(254, 228, 225)
 
Moccasin#FFE4B5rgb(254, 228, 181)
 
Navajo White#FFDEADrgb(254, 222, 173)
 
Navy#000080rgb(0, 0, 128)
 
Old Lace#FDF5E6rgb(253, 245, 230)
 
Olive#808000rgb(128, 128, 1)
 
Olive Drab#6B8E23rgb(107, 142, 35)
 
Orange#FFA500rgb(252, 165, 3)
 
Orange Red#FF4500rgb(250, 69, 1)
 
Orchid#DA70D6rgb(218, 112, 214)
 
Pale Golden Rod#EEE8AArgb(238, 232, 170)
 
Pale Green#98FB98rgb(152, 251, 153)
 
Pale Turquoise#AFEEEErgb(175, 238, 239)
 
Pale Violet Red#DB7093rgb(219, 112, 147)
 
Papaya Whip#FFEFD5rgb(254, 239, 213)
 
Peach Puff#FFDAB9rgb(253, 218, 185)
 
Peru#CD853Frgb(205, 133, 63)
 
Pink#FFC0CBrgb(252, 192, 203)
 
Plum#DDA0DDrgb(221, 160, 221)
 
Powder Blue#B0E0E6rgb(176, 224, 230)
 
Purple#800080rgb(128, 0, 128)
 
Rebecca Purple#663399rgb(102, 51, 153)
 
Red#FF0000rgb(255, 0, 0)
 
Rosy Brown#BC8F8Frgb(188, 143, 142)
 
Royal Blue#4169E1rgb(65, 105, 225)
 
Saddle Brown#8B4513rgb(139, 69, 19)
 
Salmon#FA8072rgb(250, 128, 114)
 
Sandy Brown#F4A460rgb(244, 164, 95)
 
Sea Green#2E8B57rgb(46, 139, 87)
 
Sea Shell#FFF5EErgb(255, 245, 238)
 
Sienna#A0522Drgb(160, 82, 45)
 
Silver#C0C0C0rgb(192, 192, 192)
 
Sky Blue#87CEEBrgb(135, 206, 235)
 
Slate Blue#6A5ACDrgb(106, 90, 205)
 
Slate Gray#708090rgb(112, 128, 145)
 
Snow#FFFAFArgb(255, 250, 250)
 
Spring Green#00FF7Frgb(63, 255, 128)
 
Steel Blue#4682B4rgb(70, 130, 180)
 
Tan#D2B48Crgb(210, 180, 140)
 
Teal#008080rgb(26, 128, 127)
 
Thistle#D8BFD8rgb(216, 191, 216)
 
Tomato#FF6347rgb(250, 99, 71)
 
Turquoise#40E0D0rgb(64, 224, 208)
 
Violet#EE82EErgb(238, 130, 238)
 
Wheat#F5DEB3rgb(245, 222, 179)
 
White#FFFFFFrgb(255, 255, 255)
 
White Smoke#F5F5F5rgb(245, 245, 245)
 
Yellow#FFFF00rgb(255, 255, 0)
 
Yellow Green#9ACD32rgb(154, 205, 49)

Cara Penggunaan

Berikut cara penggunaan kode warna CSS yang benar pada sebuah 

kode CSS.
.warna-teks {
    color: #FF6347;     /* mizipediacom*/
}
Atau anda bisa juga untuk penulisan warnanya seperti ini dalam bentuk rbg

Kode CSS
.warna-teks {
    color: rgb(250, 99, 71);     /* mizipediacom */
} 
Kode HTML
<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Kode Warna CSS</title>
</head>
<body>
 <p class="warna-teks">Warna Teks Berubah</p>
</body>
</html>
Kode CSSKode warna bisa juga di gunakan pada kode HTML seperti di bawah ini contohnya. 

Kode HTML
<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Kode Warna CSS</title>
</head>
<body>
 <p><font color="#FF6347">Warna Teks Berubah</font></p>
</body>
</html>
font-family: "helvetica neue", helvetica, arial, sans-serif; "segoe ui" , sans-serif; font-size: 14px; text-align: justify; word-spacing: 0px;">Kode CSSUntuk hasilnya terlihat seperti di bawah ini

Warna Tek Berubah
Atau jika anda mau bisa juga menggunakan inline style seperti berikut ini: 

Kode HTML
<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Kode Warna CSS</title>
</head>
<body>
 <p><font style="color:#FF6347">Warna Teks Berubah</font></p>
</body>
</html>
ut ini: Demikian penjelasan pada pagi ini, semoga bermanfaat artikel ini.

Share Google URL Shortener: Get Short URLloading short url

Bila Anda merasa memang artikel-artikel di blog ini bisa bermanfaat, maka Anda bisa membantu memberikan donasi melalui Paypal Dana hasil dari donasi akan digunakan untuk memperpanjang domain mizipedia.com - Terima kasih.

Comment Policy Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui.
Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

No comments

Peraturan Berkomentar di mizipediacom
1. Berkomentarlah dengan Relevan dan Sopan
2. Jangan Spam
3. Tidak Porn dan Sara
4. Berkomentar dengan link tanpa relevan maka akan otomatis terhapus
5. Semua komentar pasti akan saya baca dan dibalas. Show Emoticon. Klik ==>

+ Follow
Join on this site

with Google Friend Connect