Halaman

misther-junett.blogspot.com
  • Web
  • misther-junett
  • Sabtu, 19 Februari 2011


    New Daftar isi Blog Berdasarkan Label

    daftar isi blog new
    Keberadaan daftar isi sangat dibutuhkan bagi setiap orang yang hendak mengeksplore sebuah bacaan. Sebetulnya saya sudah pernah membuat posting tentang cara membuat daftar isi seperti disini. Namun pada postingan kali ini saya ingin menampilkan daftar isi yang lain dari postingan sebelumnya. Sebelum anda melanjutkan membaca tulisan ini alangkah baiknya anda lihat dulu
    seperti apa hasil jadinya nanti, silahkan  anda klik tab Daftar isi blog ini.
    Nah kalau sudah mari kita lanjutkan belajarnya…:d

    Pada postingan Daftar isi blog berdasarkan label ini juga dilengkapi dengan penanda khusus kalau-kalau anda membuat postingan baru maka akan muncul tanda khusus berupa tulisan “New”. Ada 2 model yang bisa anda pilih yakni Daftar isi blog berdasarkan label tanpa scroll dan Daftar isi blog yang memakai scroll.
    Silahkan copy kode di bawah ini dan paste di blog anda,

    Ini Kode daftar isi Tanpa scroll:
    <script
    style="text/javascript" src="http://kodecode.googlecode.com/files/daptarisiblog.txt"></script><script
    src="http://namablog.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>

    Dan ini Kode daftar isi Dengan Scroll:
    <div
    style="overflow:auto;width:450px; height:200px; padding:10px;border:1px
    solid #eee"><script style="text/javascript" src="http://kodecode.googlecode.com/files/daptarisiblog.txt"></script><script
    src="http://namablog.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script></div>

    Keterangan:
    1. namablog.blogspot.com : gantilah dengan alamat blog anda
    2. width:450px : Ganti Lebar sesuai dengan yang anda inginkan, sesuaikan dengan template
    3. height:200px : Ganti tingginya sesuai dengan keinginan anda
    4. postingan tanpa label tidak muncul di daftar isi ini

    Catatan :
    Daftar isi ini bisa di pasang di side bar maupun di halaman posting. Bila mau dipasang di side bar sebaiknya gunakanlah yang model scroll untuk menghemat ruang.

    Daftar isi Blog Berdasarkan Label

    Membuat daftar isi dari sebuah blog sudah banyak ditulis di berbagai blog tutorial. Hanya saja, sebagian dari cara yang dikemukakan tidak menampilkan seluruh daftar isi yang ada pada blog.
    Tips kali ini juga merupakan cara membuat daftar isi blo secar lengkap yang ditampilkan dalam bentuk tabel. Kelebihan dari daftar isi ini dapat ditampilkan dan juga dapat disembunyikan, anda tinggal klik kata untuk menampilkan atau menyembunyikan daftar isi.

    Post ini diperoleh dari sumbernya aslinya yaitu : BEAUTIFUL BETA
    Ikuti langkah-langkah dibawah ini bagi anda yang ingin mencoba.

    • Langkah Pertama


      1. Masuk ke Blogger dengan ID anda.
      2. Pilih Tata Letak.
      3. pilih Edit HTML.
      4. Back up dulu templatnya jika takut gagal.
      5. Cari kode ini : ]]></b:skin> 
      6. Copy kode dibawah ini, kemudian paste tepat diatas kode tadi.


        #toc { border: 0px solid #000000; background: #ffffff; padding:2px; width:495px; margin-top:10px;}

        .toc-header-col1, .toc-header-col2,

        .toc-header-col3 { background: #B5CBFA; color: #000000; padding-left: 5px; width:250px;}

        .toc-header-col2 { width:75px;}

        .toc-header-col3 { width:125px;}

        .toc-header-col1 a:link, .toc-header-col1 a:visited,

        .toc-header-col2 a:link, .toc-header-col2 a:visited, .toc-header-col3 a:link,

        .toc-header-col3 a:visited { font-size:100%; text-decoration:none;}

        .toc-header-col1 a:hover,

        .toc-header-col2 a:hover,

        .toc-header-col3 a:hover { font-size:100%; text-decoration:underline; color:#3D3F44;}

        .toc-entry-col1, .toc-entry-col2, .toc-entry-col3 { padding-left: 5px; font-size:100%; background:#f0f0f0;}



      7. Klik Tombol Simpan Template



    • Langkah Kedua
      1. Masuk ke Elemen Halaman.
      2. Pilih Tambah Gadget.
      3. Klik tanda + pada HTML/JavaScript.
      4. Copy kode dibawah ini kemudian paste pada kolom yang tersedia


        <div id="toclink"> <a href="javascript:showToc();"> <img border="0" src="http://h1.ripway.com/ades40/image/add2.png"/><font color="#808000"><b> Lihat Semua Daftar Posting</b></font></a>
        </div>
        <script style="text/javascript" src="http://h1.ripway.com/ades40/blogtoc.js"></script>
        <script src="http://namablog anda.blogspot.com/feeds/posts/default?alt=json-in-script&max-results=999&callback=loadtoc"></script>



      5. KLik tombol Simpan

    • Langkah Ketiga

      1. Masih di Elemen Halaman.
      2. Klik Tambah Gadget.
      3. Klik tanda + pada HTML /JavaScript.
      4. Copy kode dibawah ini, kemudian paste pada kolom yang tersedia.


        <div id="toc"></div>
      5. Klik tombol Simpan

    • Selesai.
    • Selamat mencoba, semoga bermanfaat.



    Kategori Otomatis hanya Thumbnail

    Dalam posting sebelumnya mengenai fitur Kategori Otomatis Dengan Thumbnail ada yang request, bagaimana jika yang tampil adalah hanya thumbnail saja dan berderet ke samping? ini bisa saja di lakukan, namun tentu dengan sedikit modifikasi.
    Contoh screenshot dari kategori otomatis hanya menampilkan thumbnail:

    kategori otomatis hanya thumbnail


    Berikut adalah langkah-langkahnya :
     

    Langkah pertama

    1. Login ke blogger dengan ID anda.
    2. Klik Rancangan.
      rancangan
    3. Klik tab Edit HTML.
    4. Disarankan untuk membuat backup terlebih dahulu, klik pada tulisan Download Template Lengkap.
    5. Carilah kode ]]></b:skin>, copy lalu paste kode berikut persis diatas kode ]]></b:skin>
      /*** Labels Thumbs ***/
      img.label_thumb{
      float:left;
      border:1px solid #ccc;
      width:85px;
      height:70px;
      margin-right:10px;
      margin-bottom:10px;
      }
    6. Carilah kode </head>, copy lalu paste kode berikut persis diatas kode </head>
      <script type='text/javascript'>
      //<![CDATA[
      function labelthumbs(json){document.write('<div>');for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){var commenttext=entry.link[k].title;var commenturl=entry.link[k].href;}
      if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break;}}
      var thumburl;try{thumburl=entry.media$thumbnail.url;}catch(error)
      {s=entry.content.$t;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){thumburl=d;}
      else thumburl='';}
      document.write('<a href="'+posturl+'" title="'+posttitle+'"><img class="label_thumb" src="'+thumburl+'"/></a>');
      if(i!=(numposts-1))
      document.write('');}
      document.write('</div>');}
      //]]>
      </script>
    7. Klik tombol SIMPAN TEMPLATE.
    8. Langkah pertama selesai.

    Langkah kedua

    1. Klik tab Rancangan.
      rancangan
    2. Jika masih dalam posisi tab Elemen Laman, silahkan klik terlebih dahulu tab menu Elemen Laman.
      elemen laman
    3. Klik Tambah Gadget untuk menambahkan gadget baru.
      tambah gadget
    4. Setelah muncul jendela baru, klik tanda plus untuk HTML/JavaScript
      html javascript
    5. Copy script dibawah ini, lalu paste pada kolom yang tersedia. Beri juga judul yang sesuai dengan yang anda inginkan. Namun sebelumnya anda harus mengubah tulisan yang di beri warna merah dengan nama kategori yang di inginkan.
      <script type='text/javascript'>var numposts = 6;</script>
      <script type="text/javascript" src="/feeds/posts/default/-/namalabelmu?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>

       script label
    6. Klik tombol SIMPAN
    7. Langkah kedua Selesai.
    Jika anda ingin menambahkan widget lain untuk nama kategori yang lain, anda hanya melakukan hal yang sama dengan urutan Langkah Kedua.
    Untuk pengaturan custom seperti mengubah ukuran thumbnail, border dan lainnya, anda dapat mengubah pengaturan di bagian CSS, silahkan kreasikan sendiri :


    /*** Labels Thumbs ***/
    img.label_thumb{
    float:left;
    border:1px solid #ccc;
    width:85px;
    height:70px;
    margin-right:10px;
    margin-bottom:10px;
    }
    Untuk mengatur jumlah thumbnail yang ingin tampil anda tinggal mengubah angka 6 dengan nilai angka yang lain.

    <script type='text/javascript'>var numposts = 6;</script>
    Manampilkan kategori hanya thumbnail, mungkin cocok untuk blog yang bersifat gallery template, gallery photo dan sejenisnya.

    New Related Posts + Thumbnails (Alternatif selain LinkWithin)

    Sudah pernah memasang widget related posts dari layanan Linkwithin? kalo belum, paling tidak rekan pernah melihat widget ini ya. sebagai contoh rekan bisa melihat contoh widget tersebut di blog saya yang versi english disini dan disini. silahkan buka salah satu postingan saya, dan lihat sample widget tersebut pada akhir postingan.



    Nah, Kali ini saya coba berbagi lagi tutorial alternarif pengganti layaknya widget Linkwithin, tampilannyapun sangat mirip sekali. Tapi yang ini agak berbeda, dan kita mesti repot sedikit karena semua dilakukan secara manual. Widget ini sebenarnya sudah dibahas tuntas oleh pembuatnya Aneesh diblognya disini

    Biar gak bingung saya translate aja ya caranya disini:

    1. Pertama, masuk dulu ke halaman Edit HTML, jangan lupa memberi tanda centang pada  "Expand Widget Templates"

    2. Cari kode ini </head>

    3. Kemudian ganti dengan kode dibawah ini


    <!--Related Posts with thumbnails Scripts and Styles Start-->
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <style type="text/css">
    #related-posts {
    float:center;
    text-transform:none;
    height:100%;
    min-height:100%;
    padding-top:5px;
    padding-left:5px;
    }

    #related-posts h2{
    font-size: 1.6em;
    font-weight: bold;
    color: black;
    font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
    margin-bottom: 0.75em;
    margin-top: 0em;
    padding-top: 0em;
    }
    #related-posts a{
    color:black;
    }
    #related-posts a:hover{
    color:black;
    }

    #related-posts  a:hover {
    background-color:#d4eaf2;
    }
    </style>
    <script src='http://blogergadgets.googlecode.com/files/relatedthumbs21.js' type='text/javascript'/>
    </b:if>
    <!--Related Posts with thumbnails Scripts and Styles End-->
    </head>


    4. Sekarang cari lagi kode dibawah

    <div class='post-footer-line post-footer-line-1'>

    Jika tidak menemukan kode diatas, coba cari kode seperti ini

    <p class='post-footer-line post-footer-line-1'>

    Kalo sudah ketemu, tinggal masukan semua kode dibawah ini dibawah salah satu dari kode diatas yang rekan temukan.

    <!-- Related Posts with Thumbnails Code Start-->
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div id='related-posts'>
    <b:loop values='data:post.labels' var='label'>
    <b:if cond='data:label.isLast != &quot;true&quot;'>
    </b:if>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop><a href='http://www.bloggerplugins.org/2009/08/related-posts-thumbnails-blogger-widget.html' style='display:none;'>Related Posts with thumbnails for blogger</a><a href='http://www.bloggerplugins.org/' style='display:none;'>blogger widgets</a>
    <script type='text/javascript'>
    var currentposturl=&quot;<data:post.url/>&quot;;
    var maxresults=5;
    var relatedpoststitle="Related Posts";
    removeRelatedDuplicates_thumbs();
    printRelatedLabels_thumbs();
    </script>
    </div><div style='clear:both'/>
    </b:if>
    <!-- Related Posts with Thumbnails Code End-->

    5. jangan lupa disimpan dah lihat hasilnya

    Untuk menampilkan berapa banyak jumlah related posts bisa dengan mengedit kode dibawah ini:

    var maxresults=5;

    Untuk mengganti title, kita bisa mengedit kode ini:

    var relatedpoststitle="Related Posts";

    Selamat Mencoba aja :)

    Tabel Warna dan Kode Warna

    QuantcastUntuk memperindah dan mempercantik website biasanya kita hiasi dengan warna-warna yang menarik sesuai selera kita. Kombinasi warna yang tepat akan memberikan nilai tambah untuk sebuah website, dan tentunya lebih membuat pengunjung website betah berlama-lama mengunjungi website kita.

    Color Values

    CSS colors can be defined as a hexadecimal notation for the combination of Red, Green, and Blue color values (RGB).
    The lowest value that can be given to one light source is 0 (hex #00) and the highest value is 255 (hex #FF).
    The table below shows the result of combining Red, Green, and Blue light sources:
    Color
    Color HEX
    Color RGB

    #000000rgb(0,0,0)

    #FF0000rgb(255,0,0)

    #00FF00rgb(0,255,0)

    #FFFF00rgb(255,255,0)

    #00FFFFrgb(0,255,255)

    #FF00FFrgb(255,0,255)

    #C0C0C0rgb(192,192,192)

    #FFFFFFrgb(255,255,255)

    W3C Standard Color Names

    W3C has listed 16 color names that will validate with a CSS validator.
    The color names are: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow.

    Cross-browser Color Names

    A collection of nearly 150 color names are supported by all major browsers.
    View the cross-browser color names

    Cross-browser Color Values

    Some years ago, when most computers only supported 256 different colors, a list of 216 Web Safe Colors was suggested as a Web standard. The reason for this was that the Microsoft and Mac operating system used 40 different “reserved” fixed system colors (about 20 each).
    We are not sure how important this is now, since most computers today have the ability to display millions of different colors, but the choice is left to you.
    The 216 cross-browser color palette was created to ensure that all computers would display the colors correctly when running a 256 color palette:
    000000
    000033
    000066
    000099
    0000CC
    0000FF
    003300
    003333
    003366
    003399
    0033CC
    0033FF
    006600
    006633
    006666
    006699
    0066CC
    0066FF
    009900
    009933
    009966
    009999
    0099CC
    0099FF
    00CC00
    00CC33
    00CC66
    00CC99
    00CCCC
    00CCFF
    00FF00
    00FF33
    00FF66
    00FF99
    00FFCC
    00FFFF
    330000
    330033
    330066
    330099
    3300CC
    3300FF
    333300
    333333
    333366
    333399
    3333CC
    3333FF
    336600
    336633
    336666
    336699
    3366CC
    3366FF
    339900
    339933
    339966
    339999
    3399CC
    3399FF
    33CC00
    33CC33
    33CC66
    33CC99
    33CCCC
    33CCFF
    33FF00
    33FF33
    33FF66
    33FF99
    33FFCC
    33FFFF
    660000
    660033
    660066
    660099
    6600CC
    6600FF
    663300
    663333
    663366
    663399
    6633CC
    6633FF
    666600
    666633
    666666
    666699
    6666CC
    6666FF
    669900
    669933
    669966
    669999
    6699CC
    6699FF
    66CC00
    66CC33
    66CC66
    66CC99
    66CCCC
    66CCFF
    66FF00
    66FF33
    66FF66
    66FF99
    66FFCC
    66FFFF
    990000
    990033
    990066
    990099
    9900CC
    9900FF
    993300
    993333
    993366
    993399
    9933CC
    9933FF
    996600
    996633
    996666
    996699
    9966CC
    9966FF
    999900
    999933
    999966
    999999
    9999CC
    9999FF
    99CC00
    99CC33
    99CC66
    99CC99
    99CCCC
    99CCFF
    99FF00
    99FF33
    99FF66
    99FF99
    99FFCC
    99FFFF
    CC0000
    CC0033
    CC0066
    CC0099
    CC00CC
    CC00FF
    CC3300
    CC3333
    CC3366
    CC3399
    CC33CC
    CC33FF
    CC6600
    CC6633
    CC6666
    CC6699
    CC66CC
    CC66FF
    CC9900
    CC9933
    CC9966
    CC9999
    CC99CC
    CC99FF
    CCCC00
    CCCC33
    CCCC66
    CCCC99
    CCCCCC
    CCCCFF
    CCFF00
    CCFF33
    CCFF66
    CCFF99
    CCFFCC
    CCFFFF
    FF0000
    FF0033
    FF0066
    FF0099
    FF00CC
    FF00FF
    FF3300
    FF3333
    FF3366
    FF3399
    FF33CC
    FF33FF
    FF6600
    FF6633
    FF6666
    FF6699
    FF66CC
    FF66FF
    FF9900
    FF9933
    FF9966
    FF9999
    FF99CC
    FF99FF
    FFCC00
    FFCC33
    FFCC66
    FFCC99
    FFCCCC
    FFCCFF
    FFFF00
    FFFF33
    FFFF66
    FFFF99
    FFFFCC
    FFFFFF
    Colors are displayed combining  RED, GREEN, and BLUE light sources.

    Color Values

    CSS colors are defined using a hexadecimal notation for the combination of Red, Green, and Blue color values (RGB). The lowest value that can be given to one light source is 0 (hex #00). The highest value is 255 (hex #FF).

    16384 Different Colors

    Most modern monitors are capable of displaying at least 16384 different colors.
    If you look at the color table below, you will see the result of varying the red light from 0 to 255, while keeping the green and blue light at zero.
    To see a full list of 16384 different colors based on red light varying from 0 to 255, click on one of the hexadecimal or rgb values below.

    #000000rgb(0,0,0)

    #080000rgb(8,0,0)

    #100000rgb(16,0,0)

    #180000rgb(24,0,0)

    #200000rgb(32,0,0)

    #280000rgb(40,0,0)

    #300000rgb(48,0,0)

    #380000rgb(56,0,0)

    #400000rgb(64,0,0)

    #480000rgb(72,0,0)

    #500000rgb(80,0,0)

    #580000rgb(88,0,0)

    #600000rgb(96,0,0)

    #680000rgb(104,0,0)

    #700000rgb(112,0,0)

    #780000rgb(120,0,0)

    #800000rgb(128,0,0)

    #880000rgb(136,0,0)

    #900000rgb(144,0,0)

    #980000rgb(152,0,0)

    #A00000rgb(160,0,0)

    #A80000rgb(168,0,0)

    #B00000rgb(176,0,0)

    #B80000rgb(184,0,0)

    #C00000rgb(192,0,0)

    #C80000rgb(200,0,0)

    #D00000rgb(208,0,0)

    #D80000rgb(216,0,0)

    #E00000rgb(224,0,0)

    #E80000rgb(232,0,0)

    #F00000rgb(240,0,0)

    #F80000rgb(248,0,0)

    #FF0000rgb(255,0,0)

    Shades of Gray

    Gray colors are displayed using an equal amount of power to all of the light sources. To make it easier for you to select the right gray color we have compiled a table of gray shades for you:

    RGB(0,0,0)#000000

    RGB(8,8,8)#080808

    RGB(16,16,16)#101010

    RGB(24,24,24)#181818

    RGB(32,32,32)#202020

    RGB(40,40,40)#282828

    RGB(48,48,48)#303030

    RGB(56,56,56)#383838

    RGB(64,64,64)#404040

    RGB(72,72,72)#484848

    RGB(80,80,80)#505050

    RGB(88,88,88)#585858

    RGB(96,96,96)#606060

    RGB(104,104,104)#686868

    RGB(112,112,112)#707070

    RGB(120,120,120)#787878

    RGB(128,128,128)#808080

    RGB(136,136,136)#888888

    RGB(144,144,144)#909090

    RGB(152,152,152)#989898

    RGB(160,160,160)#A0A0A0

    RGB(168,168,168)#A8A8A8

    RGB(176,176,176)#B0B0B0

    RGB(184,184,184)#B8B8B8

    RGB(192,192,192)#C0C0C0

    RGB(200,200,200)#C8C8C8

    RGB(208,208,208)#D0D0D0

    RGB(216,216,216)#D8D8D8

    RGB(224,224,224)#E0E0E0

    RGB(232,232,232)#E8E8E8

    RGB(240,240,240)#F0F0F0

    RGB(248,248,248)#F8F8F8

    RGB(255,255,255)#FFFFFF

    CSS Color Names

    The table below provides a list of the color names that are supported by all major browsers.
    Note: If you want your pages to validate with an HTML or a CSS validator, W3C has listed 16 color names that you can use: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow. If you want to use other colors, you must specify their RGB or HEX value.
    Click on a color name (or a hex value) to view the color as the background-color along with different text colors:
    Color NameColor HEXColor
    AliceBlue#F0F8FF
    AntiqueWhite#FAEBD7
    Aqua#00FFFF
    Aquamarine#7FFFD4
    Azure#F0FFFF
    Beige#F5F5DC
    Bisque#FFE4C4
    Black#000000
    BlanchedAlmond#FFEBCD
    Blue#0000FF
    BlueViolet#8A2BE2
    Brown#A52A2A
    BurlyWood#DEB887
    CadetBlue#5F9EA0
    Chartreuse#7FFF00
    Chocolate#D2691E
    Coral#FF7F50
    CornflowerBlue#6495ED
    Cornsilk#FFF8DC
    Crimson#DC143C
    Cyan#00FFFF
    DarkBlue#00008B
    DarkCyan#008B8B
    DarkGoldenRod#B8860B
    DarkGray#A9A9A9
    DarkGreen#006400
    DarkKhaki#BDB76B
    DarkMagenta#8B008B
    DarkOliveGreen#556B2F
    Darkorange#FF8C00
    DarkOrchid#9932CC
    DarkRed#8B0000
    DarkSalmon#E9967A
    DarkSeaGreen#8FBC8F
    DarkSlateBlue#483D8B
    DarkSlateGray#2F4F4F
    DarkSlateGrey#2F4F4F
    DarkTurquoise#00CED1
    DarkViolet#9400D3
    DeepPink#FF1493
    DeepSkyBlue#00BFFF
    DimGray#696969
    DodgerBlue#1E90FF
    FireBrick#B22222
    FloralWhite#FFFAF0
    ForestGreen#228B22
    Fuchsia#FF00FF
    Gainsboro#DCDCDC
    GhostWhite#F8F8FF
    Gold#FFD700
    GoldenRod#DAA520
    Gray#808080
    Green#008000
    GreenYellow#ADFF2F
    HoneyDew#F0FFF0
    HotPink#FF69B4
    IndianRed #CD5C5C
    Indigo #4B0082
    Ivory#FFFFF0
    Khaki#F0E68C
    Lavender#E6E6FA
    LavenderBlush#FFF0F5
    LawnGreen#7CFC00
    LemonChiffon#FFFACD
    LightBlue#ADD8E6
    LightCoral#F08080
    LightCyan#E0FFFF
    LightGoldenRodYellow#FAFAD2
    LightGray#D3D3D3
    LightGreen#90EE90
    LightPink#FFB6C1
    LightSalmon#FFA07A
    LightSeaGreen#20B2AA
    LightSkyBlue#87CEFA
    LightSlateGray#778899
    LightSteelBlue#B0C4DE
    LightYellow#FFFFE0
    Lime#00FF00
    LimeGreen#32CD32
    Linen#FAF0E6
    Magenta#FF00FF
    Maroon#800000
    MediumAquaMarine#66CDAA
    MediumBlue#0000CD
    MediumOrchid#BA55D3
    MediumPurple#9370D8
    MediumSeaGreen#3CB371
    MediumSlateBlue#7B68EE
    MediumSpringGreen#00FA9A
    MediumTurquoise#48D1CC
    MediumVioletRed#C71585
    MidnightBlue#191970
    MintCream#F5FFFA
    MistyRose#FFE4E1
    Moccasin#FFE4B5
    NavajoWhite#FFDEAD
    Navy#000080
    OldLace#FDF5E6
    Olive#808000
    OliveDrab#6B8E23
    Orange#FFA500
    OrangeRed#FF4500
    Orchid#DA70D6
    PaleGoldenRod#EEE8AA
    PaleGreen#98FB98
    PaleTurquoise#AFEEEE
    PaleVioletRed#D87093
    PapayaWhip#FFEFD5
    PeachPuff#FFDAB9
    Peru#CD853F
    Pink#FFC0CB
    Plum#DDA0DD
    PowderBlue#B0E0E6
    Purple#800080
    Red#FF0000
    RosyBrown#BC8F8F
    RoyalBlue#4169E1
    SaddleBrown#8B4513
    Salmon#FA8072
    SandyBrown#F4A460
    SeaGreen#2E8B57
    SeaShell#FFF5EE
    Sienna#A0522D
    Silver#C0C0C0
    SkyBlue#87CEEB
    SlateBlue#6A5ACD
    SlateGray#708090
    Snow#FFFAFA
    SpringGreen#00FF7F
    SteelBlue#4682B4
    Tan#D2B48C
    Teal#008080
    Thistle#D8BFD8
    Tomato#FF6347
    Turquoise#40E0D0
    Violet#EE82EE
    Wheat#F5DEB3
    White#FFFFFF
    WhiteSmoke#F5F5F5
    Yellow#FFFF00
    YellowGreen#9ACD32