input[type=button] {
background: #FFFFFF;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='[h2]FFFFFF', endColorstr='[/h2]DEDEDE');
background: -webkit-gradient(linear, left top, left bottom, from([h2]FFFFFF), to([/h2]DEDEDE));
background: -moz-linear-gradient(top, [h2]FFFFFF, [/h2]DEDEDE);
background: -ms-linear-gradient(top, [h2]FFFFFF, [/h2]DEDEDE);
background: -o-linear-gradient(top, [h2]FFFFFF, [/h2]DEDEDE);
color: #000;
border: 1px solid #666;
opacity: 0.80;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=80);
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-o-border-radius: 3px;
-ms-border-radius: 3px;
border-radius: 3px;
padding: 5px;
font-size: 0.7em !important;
line-height: 0.8em;
}
input[type=button]:hover {
opacity: 1.0;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=100);
}
input[type=button]:active {
background: #FFFFFF;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='[h2]DEDEDE', endColorstr='[/h2]FFFFFF');
background: -webkit-gradient(linear, left top, left bottom, from([h2]DEDEDE), to([/h2]FFFFFF));
background: -moz-linear-gradient(top, [h2]DEDEDE, [/h2]FFFFFF);
background: -ms-linear-gradient(top, [h2]DEDEDE, [/h2]FFFFFF);
background: -o-linear-gradient(top, [h2]DEDEDE, [/h2]FFFFFF);
}
Click here for a quick guide on CSS. The easiest place to start tweaking that is the hex colors. Use a tool like this to pick colors you would like, and note that most of the above are gradients (so you will need to pick 2 similar colors).
Placing in index.html file
You'll want to place this in your index.html file right before the </style> tag. The problem with this technique is you will have to do this each time you update and export your game.
Dynamically inserting CSS with Clay.io
If you are using the Clay.io Plugin:
1) Visit the developer dashboard
2) Click "Settings" for your game
3) Scroll to the bottom and click "Add Unframed CSS"
4) Paste in the above CSS and save
Now you don't need to modify index.html, and the CSS will automatically be added when your game is loaded.
If you are not familiar with Clay.io, we help distribute your games (see tutorial), as well as a plugin for implementing features like user accounts, high scores, achievements, analytics, posting to Facebook/Twitter, and more (see tutorial).