Güzel renkler

dodgerblue

yellowgreen

darkblue

nicered

<style>

  .dodgerblue{

    color:dodgerblue;

  }

  .yellowgreen{

      color:yellowgreen;

  }

  .darkblue{

      color:darkblue;
}

  .nicered{

      color:9F0509;
}

</style>

<p class="dodgerblue">dodgerblue</p>

<p class="yellowgreen">yellowgreen</p>

<p class="darkblue">darkblue</p>
<p class="nicered">nicered</p>

Textbox ve Search button / turuncu tema

<style>

  .button6 {

    /*background-color: black;*/

    background-color: #393939 !important;

    color: orange !important;

    border: 2px solid #393939;

  }

  .button6:hover {

    border: 2px solid;

    text-decoration: none !important;

  }

</style>

<tr>

  <td class="gsc-input" style="width:162px !important; padding-right:3px !important">

    <input autocomplete="off" class="gsc-input" name="q" size="10" style="font-weight:bold; height:22px !important;  weight:188px; color:orange" title="search" type="text" value="">

  </td>

  <style>

    .buttonSearch {

      background-color: #4CAF50; /* Green */

      border: 1px solid orange;

      color: white;

      padding: 0px 11px;

      text-align: center;

      text-decoration: none;

      display: inline-block;

      font-size: 16px;

      margin: 4px 2px;

      -webkit-transition-duration: 0.4s; /* Safari */

      transition-duration: 0.4s;

      cursor: pointer;

      height:22px;

      margin-left:-6px;

    }

    .buttonSearchOrange {

      background-color: orange;

      color: white

        border: 2px solid green;

    }

    .buttonSearchOrange:hover {

      background-color: white;

      color: black;

      border-color: black;

      background-color:white;

      border-left-color: white;

    }

  </style>

  <td>

    <input class="buttonSearch buttonSearchOrange" placeholder="X" style="margin-top:4.5px !important" title="search" type="submit" value="Ara">

  </td>

</tr>

Text ve Textarea / turuncu tema

<style>

  input[type=text], textarea {

    -webkit-transition: all 0.30s ease-in-out;

    -moz-transition: all 0.30s ease-in-out;

    -ms-transition: all 0.30s ease-in-out;

    -o-transition: all 0.30s ease-in-out;

    outline: none;

    padding: 3px 0px 3px 3px;

    margin: 5px 1px 3px 0px;

    border: 1px solid #DDDDDD;

  }

  input[type=text]:focus, textarea:focus {

    box-shadow: 0 0 5px orange;

    padding: 3px 0px 3px 3px;

    margin: 5px 1px 3px 0px;

    border: 1px solid orange;

  }

</style>

<form action="#" method="post">

  <div>

    <label for="textId" style="color:orange">Text</label>

    <input type="text" id="textId" value="" tabindex="1" />

  </div>

  <div>

    <label for="textareaId" style="color:orange">Textarea</label>

    <textarea cols="40" rows="8" name="textarea" id="textareaId"></textarea>

  </div>

</form> 

<style>

  @import "compass/css3";

  input[type=text], textarea {

    @include transition(all 0.30s ease-in-out);

    outline: none;

    padding: 3px 0px 3px 3px;

    margin: 5px 1px 3px 0px;

    border: 1px solid orange;

  }

  input[type=text]:focus, textarea:focus {

    @include box-shadow(orange);

    padding: 3px 0px 3px 3px;

    margin: 5px 1px 3px 0px;

    border: 1px solid orange;

  }

  label {

    width: 150px;

    float: left;

  }

  input[type=text], textarea {

    -webkit-transition: all 0.30s ease-in-out;

    -moz-transition: all 0.30s ease-in-out;

    -ms-transition: all 0.30s ease-in-out;

    -o-transition: all 0.30s ease-in-out;

    outline: none;

    padding: 3px 0px 3px 3px;

    margin: 5px 1px 3px 0px;

    border: 1px solid #DDDDDD;

  }

  input[type=text]:focus, textarea:focus {

    box-shadow: 0 0 5px orange;

    padding: 3px 0px 3px 3px;

    margin: 5px 1px 3px 0px;

    border: 1px solid orange;

  }

</style>