For me, the usual approach is lowering the prominence of these elements by doing either of these:
- First: reducing the saturation (or completely desaturating, fading into grey, but having in mind that in some cases a confusion between an option being not selected and disabled may appear),
- Then, if this does not work: reducing the contrast against the background,
- Alternatively: lowering the shape size or weight (with the latter being a rather extreme solution, and in fact rarely possible).
This way, it does not translate to specific colours. Instead, you follow a simple rule.
If the icon is white, as in your case, there is no possibility to lower the saturation. But the second option, lowering the contrast, is possible (which you already did by making it 40% opaque). A disadvantage here is that this it may also look a little bit like disabled, and not inactive.
Should you consider marking the active element more prominent instead, you could add a marker above, around or beside the active element. Or a background. Or do the opposite with the weight of the active icon.