The default icon for field types with no icon assigned has a too low color contrast

virag.jain → made their first commit to this issue’s fork.

You're absolutely right that the current default icon used for field types without specific icons lacks sufficient color contrast.

I support updating the default icon styling to meet the minimum contrast requirement. A simple change to the icon's fill color would go a long way in improving accessibility without impacting the overall design.

I'll provide a patch shortly to update the default field type icon styling so it meets the minimum 3:1 contrast ratio per WCAG 2.2 SC 1.4.11. This will ensure better visibility and accessibility for all users, even when no specific icon is assigned to a field type.

Looking forward to your feedback once the patch is up.

virag.jain → changed the visibility of the branch 3530862-the-default-icon to hidden.

virag.jain → changed the visibility of the branch 3530862-the-default-icon to active.

I'm working on this.

I have made the puzzle piece the same colour as the other core icons. The new one is in the core/misc/icons/55565b directory.

The original version remains in the core/misc/icons/cacbd2 directory. I'm not sure if it should be removed.

Moving to needs review.

thanks @lostcarpark! that looks good, going with the same color like the rest of the icons is definitely fixing the color contrast issue (it has a contrast of 6.7:1 now). the only thing i wonder, was it the intention by going with a lighter grey for the default icon to differentiate from the bespoke ones so it "stands out" somehow? I have no strong opinion either way as long as the contrast is meeting the minimum requirement.

about the question if the original version should be removed, definitely a valid question, but i dont know. i would assume it would make sense to clean that up if it is not needed anywhere else anymore.

I can't see how having the default icon a lighter color conveys any useful information to anyone except the maintainer of the module providing the field. If anything, it might make people think the field type is unavailable.

However, if anyone feels strongly that it should be a lighter shade, I can certainly find a color that gives sufficient contrast.

It's also worth noting that the Gin theme seems to override the default color for all icons, so in Gin the placeholder is a dark color by default, and a light color in dark mode.

I've searched the core codebase, and there are no other references to the puzzle_piece_placeholder.svg file, so I agree it makes sense to remove it.

Updated to remove the old version of the puzzle piece icon.

i not necessarily meant that the icon color should be lighter. i was just thinking out loud if there was some intention behind the lighter color choice for the default icon . but strictly speaking, if some information would be conveyed via a different color that would be against SC1.4.1, therefore a +1 for the consistent colors you've went with from my end. and i've also discussed that question in todays accessibility office hour with @katanshaw and @the_g_bomb and both agreed as well. overall this looks good to go imho. not sure if it would be ok for me to rtbc the issue, since i've opened it. maybe wait for a second opinion, but a +1 for RTBC from my end.

updated the user interface changes section in the issue summary (uploaded another screenshot so the before and after are both in a dialog modal.

We have tested using gitpod (drupal 11.3-dev) the MR and we have found a contrast of 6.66:1 using

Verified using MR!12413 , The contrast ratio of the icon's stroke color (#55565b) against the parent's background color (rgb(243, 244, 249)) is 6.67:1. This meets the WCAG AA standard for normal text (4.5:1) and large text (3:1).

Icon looks fine in Gin (light & dark), Claro theme. Attaching claro theme before and after screenshots

Steps Followed :
1. Install Drupal
2. In Content type , Navigate to Manage fields , Add fields
3. Check the field type icons.

RTBC+ , Keeping in ' Need Review ' for Further code review

This looks great.

Tested with geolocation module.