Contents Menu Expand Light mode Dark mode Auto light/dark mode
GNOME Human Interface Guidelines
Logo
GNOME Human Interface Guidelines
  • Design Principles
  • Tools & Resources
  • Guidelines
    • App Naming
    • App Icons
    • Pointer & Touch
    • Keyboard
    • UI Icons
    • UI Styling
    • Writing Style
    • Typography
    • Navigation
    • Scaling & Adaptiveness
    • Accessibility
  • Patterns
    • Containers
      • Windows
      • Header Bars
      • Popovers
      • Utility Panes
      • Boxed Lists
      • Grid Views
      • List & Column Views
      • Selection & Edit Modes
    • Navigation
      • Browsing
      • View Switchers
      • Tabs
      • Sidebars
      • Search
    • Controls
      • Buttons
      • Menus
      • Switches
      • Text Fields
      • Checkboxes
      • Radio Buttons
      • Drop-Down Lists
      • Sliders
      • Spin Buttons
      • Overlaid Controls
    • Feedback
      • Notifications
      • Toasts
      • Banners
      • Progress Bars
      • Spinners
      • Dialogs
      • Placeholder Pages
      • Tooltips
  • Reference
    • Standard Keyboard Shortcuts
    • Palette
    • Backgrounds
Back to top
Edit this page

Controls#

Controls include the most basic interactive UI elements, such as buttons and switches.

  • ../_images/controls-buttons.svg ../_images/controls-buttons-dark.svg

    Buttons

  • ../_images/controls-menus.svg ../_images/controls-menus-dark.svg

    Menus

  • ../_images/controls-switches.svg ../_images/controls-switches-dark.svg

    Switches

  • ../_images/controls-textfields.svg ../_images/controls-textfields-dark.svg

    Text Fields

  • ../_images/controls-checkboxes.svg ../_images/controls-checkboxes-dark.svg

    Checkboxes

  • ../_images/controls-radiobuttons.svg ../_images/controls-radiobuttons-dark.svg

    Radio Buttons

  • ../_images/controls-dropdowns.svg ../_images/controls-dropdowns-dark.svg

    Drop-Down Lists

  • ../_images/controls-sliders.svg ../_images/controls-sliders-dark.svg

    Sliders

  • ../_images/controls-spinbuttons.svg ../_images/controls-spinbuttons-dark.svg

    Spin Buttons

  • ../_images/controls-overlaid.svg ../_images/controls-overlaid-dark.svg

    Overlaid Controls

Next
Buttons
Previous
Search