Embed Blocks: Unify the Styles for the Embed Block Icons

WordPress / gutenberg

The Block Editor project for WordPress and beyond. Plugin is available from the official repository.

https://wordpress.org/gutenberg/

Other

10k stars 4.02k forks source link

Embed Blocks: Unify the Styles for the Embed Block Icons #30755

Open deborah86 opened 3 years ago

deborah86 commented 3 years ago

What problem does this address?

The icons for the Embed blocks are terrible to look at. There are too many different styles and colors. The icons are different sizes. It looks terrible.

What is your proposed solution?

Pick a style for the embed block icons and stick with a single style. Create style guidelines for new embed blocks.

karmatosed commented 2 years ago

I think this might need design feedback over needing design because I think it's a matter of conversation if this is changed or not. There are 2 possible options:

Leave as it is: accepting that social icons have colour as their branding.
Make the social icons (embeds) have mono colouring where they are used in the library. I am reluctant to suggest changing sizes as it's a case of branding for many.

My input would be to leave as is because they are the ones that are tied to branding. If anything should change it would just be making them mono.

deborah86 commented 2 years ago

@karmatosed Not all the icons have the color of their branding. The Flickr logo does not. Also, some icons don't have the correct logo such as:

SoundCloud
CloudUp
CrowdSignal
Imgur
Issu
Kickstarter

These are using placeholder logos. If placeholder logos are going to be used instead of the official logos for some options then it is better to make all the logos mono.

hanneslsm commented 11 months ago

Design feedback from my side: Only use mono-colored icons.

The colored icons create unnecessary attention, especially in the slash inserter.
It feels like the colored ones have more advanced features, which is not the case.
With patterns and template parts we have introduced blocks with colors. UX hiraric they are higher and more important than Twitter, Youtube, Wordpress, Spotify, Vimeo and Animoto embeds.