GTK+ Style Classes and Element Names
This page tracks the progress of the transition in the 3.19 cycle where we move away from having just type names and style classes for widgets to having proper element name(s) for CSS nodes, and possibly multiple CSS nodes per widget. This blog post describes the motivations behind the changes.
Note that this page is not meant as documentation; it is a tracking page and may be incomplete and inaccurate. The official documentation for supported element names and style classes will appear in the API documentation for GTK+ when the transition is done.
Widget |
Current style classes (before conversion) |
New element names (after conversion) |
CSS node conversion status |
CSS gadget conversion status |
Style property deprecation status |
GtkLabel |
label |
label |
done |
done |
not needed |
GtkImage |
|
image |
done |
done |
not needed |
GtkButton |
button, image-button, text-button, flat, suggested-action, destructive-action |
button |
done |
done |
done |
GtkToggleButton |
button |
button.toggle |
done |
inherited |
not needed |
GtkCheckButton |
button, check |
button.check, checkbutton check |
done |
done |
done |
GtkRadioButton |
radio |
button.radio, radiobutton radio |
done |
done |
not needed |
GtkLinkButton |
|
button.link |
done |
inherited |
not needed |
GtkMenuButton |
|
button.popup |
done |
inherited |
not needed |
GtkScaleButton |
|
button.scale |
done |
inherited |
not needed |
GtkVolumeButton |
|
button.scale |
done |
inherited |
not needed |
GtkLockButton |
|
button.lock |
done |
inherited |
not needed |
GtkFontButton |
|
button.font |
done |
inherited |
not needed |
GtkColorButton |
|
button.color |
done |
inherited |
not needed |
GtkFileChooserButton |
|
button.file |
done |
inherited |
not needed |
GtkModelButton |
button, image-button, check, radio, expander, menuitem |
button, modelbutton radio check |
done |
done |
not needed |
GtkSwitch |
slider, trough |
switch, slider |
done |
done |
done |
GtkNotebook |
notebook, top, bottom, left, right, reorderable-page, prelight-page, active-page, frame, header |
notebook, tabs, tab |
done |
done |
stepper properties |
GtkRange |
button, top, bottom, left, right, trough, highlight, dragging, fine-tune, progressbar, slider |
|
done |
done |
done |
GtkScale |
scale, mark, has-marks-above, has-marks-below, separator |
scale, slider, marks, mark, highlight, fill |
done |
done |
value-spacing |
GtkScrollbar |
|
scrollbar, slider, button |
done |
done |
stepper properties, fixed-slider-length |
GtkEntry |
entry, image, read-only, left, right, progressbar, pulse |
entry, image, progress |
done |
done |
invisible-char |
GtkSpinButton |
spinbutton, button |
spinbutton, entry, button |
done |
done |
done |
GtkSearchEntry |
|
entry.search |
done |
inherited |
not needed |
GtkSpinner |
spinner |
spinner |
done |
done |
not needed |
GtkInfoBar |
|
infobar |
done |
inherited |
done |
GtkProgressBar |
trough, progressbar, pulse, left, right, top, bottom |
progressbar, progress, trough |
done |
done |
done |
GtkLevelBar |
|
levelbar, trough, block |
done |
done |
done |
GtkStatusBar |
statusbar |
statusbar |
done |
inherited |
not needed |
GtkActionBar |
|
actionbar |
done |
done |
not needed |
GtkSearchBar |
|
searchbar |
done |
figure out what to do about peeking out |
not needed |
GtkHeaderBar |
header-bar |
headerbar |
done |
done |
not needed |
GtkAccelLabel |
label, accelerator |
label, accelerator |
done |
to do |
not needed |
GtkTreeView |
view, rubberband, cell, separator, dnd, expander |
treeview.view, header, rubberband |
cells, separators, dnd |
to do |
to do |
GtkIconView |
|
iconview.view, rubberband |
cells |
to do |
done |
GtkTextView |
|
textview.text text, border.left, border.right, ... |
done |
to do |
to do |
GtkSeparator |
separator, horizontal, vertical |
separator |
done |
done |
not needed |
GtkAssistant |
|
assistant |
done |
to do |
done |
GtkComboBox |
the-button-in-a-combobox |
combobox button.combo |
done |
done |
appears-as-list |
GtkComboBoxText |
combobox-entry |
combobox entry.combo |
done |
inherited |
not needed |
GtkCellView |
|
cellview |
done |
done |
not needed |
GtkToolbar |
toolbar |
toolbar |
done |
done |
button-relief |
GtkToolButton |
|
toolbutton |
done |
not needed |
icon-spacing |
GtkToolItem |
|
toolitem |
done |
not needed |
not needed |
GtkToggleToolButton |
|
toolbutton |
done |
not needed |
not needed |
GtkRadioToolButton |
|
toolbutton |
done |
not needed |
not needed |
GtkSeparatorToolItem |
|
separator |
done |
done |
not needed |
GtkToolPalette |
|
toolpalette |
done |
to do |
not needed |
GtkToolItemGroup |
|
toolitemgroup |
done |
to do |
to do |
GtkColorSwatch |
|
colorswatch overlay |
done |
done |
not needed |
GtkScrolledWindow |
overshoot, undershoot, scrollbars-junction, frame |
scrolledwindow, overshoot.top, ..., undershoot.top, ..., junction |
done |
done |
scrollbar-spacing |
GtkViewport |
|
viewport |
done |
done |
not needed |
GtkCalendar |
|
calendar |
done |
to do |
to do |
GtkPlacesSidebar |
sidebar, has-open-popup, sidebar-new-bookmark-row |
placessidebar |
done |
to do |
not needed |
GtkSidebarRow |
sidebar-placeholder-row |
row |
done |
inherited |
not needed |
GtkPlacesView |
|
placesview |
done |
inherited |
not needed |
GtkPaned |
wide |
paned, separator |
done |
done |
done |
GtkTooltip |
|
tooltip |
done |
to do |
not needed |
GtkStack |
|
stack |
done |
done |
not needed |
GtkStackSwitcher |
needs-attention |
stackswitcher |
done |
inherited |
not needed |
GtkStackSidebar |
sidebar, sidebar-item, needs-attention |
stacksidebar |
done |
inherited |
not needed |
GtkListBox |
list |
list |
done |
done |
not needed |
GtkListBoxRow |
list-row, activatable |
row |
done |
done |
not needed |
GtkFlowBox |
rubberband |
flowbox, rubberband |
done |
done |
not needed |
GtkFlowBoxChild |
grid-child |
flowboxchild |
done |
done |
not needed |
GtkWindow |
window-frame, csd, solid-csd, ssd, tiled, popup, tooltip, message-dialog |
decoration |
done |
to do |
decoration-resize-handle |
GtkDialog |
|
dialog |
done |
to do |
to do |
GtkMessageDialog |
message-dialog |
messagedialog |
done |
to do |
to do |
GtkFrame |
frame, flat |
frame |
done |
done |
not needed |
GtkAspectFrame |
|
frame |
done |
inherited |
not needed |
GtkMenu |
|
menu, arrow.top, arrow.bottom |
done |
in progress |
done |
GtkMenuBar |
|
menubar |
done |
done |
done |
GtkMenuItem |
|
menuitem, arrow |
done |
done |
done |
GtkCheckMenuItem |
|
menuitem, check |
done |
done |
done |
GtkRadioMenuItem |
|
menuitem, radio |
done |
done |
not needed |
GtkSeparatorMenuItem |
|
separator |
done |
done |
not needed |
GtkPopover |
popover, background |
popover, popover.menu |
done |
to do |
not needed |
GtkPopoverMenu |
popover, background |
popover.menu |
done |
to do |
not needed |
touch selection popup |
touch-selection |
popover.touch-selection |
done |
to do |
not needed |
GtkTextHandle |
cursor-handle |
cursor-handle |
done |
to do |
not needed |
GtkMagnifier |
osd |
popover.magnifier |
done |
to do |
not needed |
GtkRevealer |
|
revealer |
done |
to do |
not needed |
drag highlight |
dnd, frame |
:dnd pseudoclass |
done |
not needed |
not needed |
GtkExpander |
expander |
expander, title, arrow |
done |
done |
done |
GtkPrintUnixDialog |
paper, frame, view |
paper, printdialog |
done |
not needed |
not needed |
GtkBox |
|
box |
done |
done |
not needed |
GtkGrid |
|
grid |
node ordering |
done |
not needed |
GtkButtonBox |
|
|
done |
done |
done |
GtkColorChooserWidget |
|
colorchooser |
done |
not needed |
not needed |
GtkFileChooserWidget |
|
filechooser |
done |
not needed |
not needed |
GtkAppChooserWidget |
|
appchooser |
done |
not needed |
not needed |
GtkFontChooserWidget |
|
fontchooser |
done |
not needed |
not needed |
GtkColorScale |
|
scale.color |
done |
inherited |
not needed |