The base UI elements in Chrome OS are styled after the default form controls. Any CSS changes are applied to this base, rather than causing a dramatic change from a native widget to a CSS one.
Default button style is a simple white to gray gradient.
Base attributes
Stroke 1px #8F8F8F
Corner radius 3px
Disabled:
Stroke: B7B7B7
Text: 50% black
Focused:
Stroke 2px #507ad5
Buttons:
Gradient: #ffffff (0.0) to #ffffff (0.5) to #d8d8d8 (1.0) - these are (stops)
Drop Shadow: #ffffff (0, -1) no blur
Pressed:
Gradient: #959595 (0.0) to #e3e3e3 (1.0)
Text Field:
Gradient: #c5c5c5 (0) to #ffffff (0.2) to #ffffff (1.0)
Selected text highlight: #DCE4FA
Tooltips
10px radius 2px thick
Fill #3e578b
Font: bold 11pt white
50% white stroke
Menus
Stroke: 33% black
Drop shadow: 33% black, 4px blur, 2px offset.
Highlight color DCE4FA
Sliders:
5px tall, Rounded corners
Stroke 1px #8F8F8F
Scroll bars:
Background: f0f0f0
Thumb: same as active button, even in depressed state
Menus
Menus use the same gradient with a stronger drop shadow.
When possible, they are displayed attached to their source.
