5

Is it possible to use gradient as a background for generic GtkWidget?

Related question: How to change GtkWidget background in GTK3?

1 Answer 1

3

Sure you can!

ugly gradient widget

Gtk3 allows for theming using CSS. Here's a quick example I threw together in Python:

#!/usr/bin/python3
from gi.repository import Gtk, Gdk

button = Gtk.Button("Click Me")
grid = Gtk.Grid()
grid.add(button)
window = Gtk.Window()
window.set_size_request(200, 50)
window.add(grid)

css_provider = Gtk.CssProvider()
css = """
 .button {
      background-image: -gtk-gradient (linear,
                                       left top,
       left bottom,
       from (#d0e4f7),
       color-stop (0.5, darker (#d0e4f7)),
       to (#fdffff));
    }
"""

css_provider.load_from_data(css.encode('UTF-8'))
screen = Gdk.Screen.get_default()
style_context = window.get_style_context()
style_context.add_provider_for_screen(screen, css_provider,
                                          Gtk.STYLE_PROVIDER_PRIORITY_APPLICATION)

window.connect('delete-event', Gtk.main_quit)
window.show_all()
Gtk.main()

Carlos Garnacho has a great article on GNOME Journal that gets into the specifics.

2
  • 1
    It seems that older versions of GTK paint only children widgets. I've not found a reliable way to color the area of a widget. Sep 11, 2015 at 5:56
  • I can confirm that the CSS in use here still works as of February 2021.
    – shevy
    Feb 28, 2021 at 16:16

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .