Is there any way to change Flutter icons "secondary" color?


I am using Icons.verified in flutter and I can change the background color fine, but cannot change the inner tick color.
Any way to do that ?

const verifiedBadge = Icon(
  color: Color(0xFF27aae1),
  size: 28,

I looked into the available properties but do not see any secondary, highlightColor or something that might get the job done.

If I can’t do this with the Icons any other way to achieve it ?

PS: I tried a stack in which i used the component above and a tick trying to cover the tick and use new color but looked ugly

>Solution :

There aren’t any direct option to resolve this.
You may try putting it in a stack and place a coloured container below the icon instead putting it on the top

        children: [
            child: Align(
              child: Container(
                width: 20,
                decoration: const BoxDecoration(
                  color: Colors.yellow,
            color: Color(0xFF27aae1),
            size: 38,

Leave a ReplyCancel reply