goog.ui.Button and goog.ui.ToggleButton

# goog.ui.Button

The first Button was created programmatically, the second by decorating an <input> element:
Enable button:
Enable button:

## goog.ui.FlatButtonRenderer

Buttons made with <div>'s instead of <input>'s or <button>'s The first rendered, the second decorated:
Enable button:
My Flat Button
Enable button:
Combined
Buttons

## goog.ui.LinkButtonRenderer

Like FlatButtonRenderer, except the style makes the button appear to be a link.
Enable button:

## goog.ui.CustomButton & goog.ui.ToggleButton

These buttons were rendered using goog.ui.CustomButton:
These buttons were created programmatically:
These buttons were created by decorating some DIVs, and they dispatch state transition events (watch the event log):
Decorated Button, yay!
Decorated Disabled
Another Button
Archive
Delete
Report Spam
Use these ToggleButtons to hide/show and enable/disable the middle button:
Enable
Show
Combined toggle buttons:
Bold
Italics
Underlined
These buttons have icons, and the second one has an extra CSS class:
The button with the orange outline has keyboard focus. Hit Enter to activate focused buttons.
Event Log