Support for accent color in symbolic icons?

Development
1

Hello,

I am not a regular forum user, so thank you for your understanding.

I’m try to work on a GNOME application using GTK4 and libadwaita, and I have a question regarding symbolic icons and accent colors.

As far as I understand, symbolic SVG icons in GTK support: currentColor, success, warning, error

However, there does not seem to be support for using the system accent color within a symbolic icon.

My use case is the following:
I would like to use a single SVG symbolic icon where:

  • most of the icon follows curernt color

  • specific shapes (for example, small indicators or dots) follow the system accent color

I’m trying to keep my application consistent with GNOME design principles, do you have any advise to realise that simply ?

Thank you in advance for your support

2 Likes
2

Hi,

There are new capabilities for symbolic icons introduced in the brand new gtk-4.22 (basically still svg, but with custom sugar on top) that allows to use accent as color name.

Looks like this for a <path>, here the stroke uses the accent color, with a fallback rgb(0,34,255) if not available:


  <path
          id='path2'
          class='transparent-fill foreground-stroke'
          fill='none'
          stroke='url(#gpa:accent) rgb(0,34,255)'
          stroke-width='2'
          stroke-linecap='round'
          stroke-linejoin='round'
          d='M 3.35731 4.84911 C 3.35731 4.84911, 4.20074 2.59336, 6.5149 2.59336 C 10.4928 2.59336, 11.1144 15, 7 15 C 5.27144 15, 4.40984 13.6289, 4.40984 12.1803 C 4.40984 8.72578, 9.89965 4.8789, 12.1466 5.97699 C 13.7715 6.77114, 12.458 10.4885, 12.458 10.4885 C 12.458 10.4885, 12.6536 8.12563, 14.9351 7.10487'
          gpa:stroke-minwidth='0.5'
          gpa:stroke-maxwidth='4'
          gpa:stroke='accent'
          gpa:states='0 3'
          gpa:transition-type='animate'
          gpa:transition-easing='ease-out'
          gpa:transition-duration='500ms'
          gpa:transition-delay='500ms'>
  </path>

See the docs: Gtk – 4.0: Symbolic Icons
Also some blog posts mention the new icons format: https://blog.gtk.org/

3

Hi Gwillems,

Thank you very much for your feedback and you help

It s a good news I will wait Fedora 44 next month to test that

Thank you again

1 Like