Possible to hide the green symbol for completed checklists on the front of a card?

[Mats Berggren]

The green symbols clutter my board and take too much focus. Can I hide this symbol or change the green colour to grey?

[David Bakkers · Accepted solution]

Hello @Mats Berggren 

It can't be done within Trello itself, but you can do it on the browser side with an extension like Pro For Trello that can alter the CSS on the web page.

The CSS code you'd need to apply to make that green checkbox hidden when all the items in the checklist are complete would be:

.badge.is-complete {
    width: 0;
    padding: 0;
}

If there are still items to complete in the checklist, the normal checkbox appearance would apply:

If you don't want to hide the checkbox when all the items are complete, just make it have a light grey background, here is the CSS code for that:

.badge.is-complete {
    background-color: #DDDDDD;
}

which renders like this:

Note. These solutions only work for users that have the browser extension installed and the CSS code changes applied via that extension.

[Mats Berggren]

Think like a pro!

Thank you for helping me out. I'll definitely try Pro for Trello.