Checkbox override property alternative

In the previous version of atlassian checkbox I was using overrides property to change icon.
How can I use custom icon for checkbox in the latest version as overrides property is removed in latest version?

Not sure which icon you’d want to change, but there are a few ways to adjust the styling of the Checkbox in the latest version. There is the label property which accepts a ReactNode that allows you to style the label. In addition, now that Checkbox has been migrated to Emotion, you can use the css property to override other styles.

Thanks for the reply @remie .

I want to change checkbox icon to subtask icon shown in below image
Screenshot 2021-12-01 at 4.59.16 PM

Previously I was able to do it by following code

              Icon: {
                  currentType.type === "across" ? SubtaskIcon : CheckboxIcon

In latest version of checkbox do we have anything similar to this?

Hi Megha,

I’m an engineer on the Design Systems team here at Atlassian. Unfortunately we’re moving away from the overrides pattern in all of our components. While powerful, it turned out to be quite a maintenance burden (which made upgrades really difficult) and terrible for performance. If you want that old behaviour you will have to replicate the old implementation using a more custom approach going forward (which should make upgrades easier too).

Kind regards,


Thanks for the information @scurtis.