Skip to content

Proposal: a red favicon #7957

Closed
Closed
@city41

Description

@city41

Is your proposal related to a problem?

CRA uses the same favicon as reactjs.org. When developing, I often have both my app running in a tab, and React documentation in other tabs:

image

Describe the solution you'd like

If CRA used a red favicon, it could help distinguish these tabs. The red favicon also draws a bit more attention to itself, to help the developer remember to replace it with the app's actual favicon.

I often use CRA as a "scratchpad" just to quickly try something out, and often in that case I'm also referring to React documentation. So in that case I don't really care about swapping to a new favicon. An already red favicon would be helpful in this situation.

Red is nice as the React dev tools use a red icon to indicate a site is in dev mode. It would convey a similar meaning here too. There may be accessibility concerns. I believe the dev tools have a slightly different icon along with the color change to help with that.

Additional context

This is obviously a small feature request and its impact is on the small side. But the effort to implement it is pretty small too IMO.

Activity

ianschmitz

ianschmitz commented on Nov 10, 2019

@ianschmitz
Contributor

Seems pretty reasonable. Let's see what the other maintainers think.

We could potentially use the React DevTools icon: https://github.com/facebook/react/blob/master/packages/react-devtools-extensions/icons/development.svg

heyimalex

heyimalex commented on Nov 12, 2019

@heyimalex
Contributor

I vote for just using the new logo, maybe with the colors reversed. I think using red conveys too much danger; people will release production sites without replacing the favicon, so it should still look professional.

city41

city41 commented on Nov 13, 2019

@city41
Author

That's a good idea. I'm mostly interested in a different favicon, being red isn't that important IMO.

heyimalex

heyimalex commented on Nov 14, 2019

@heyimalex
Contributor

example of new favicon in firefox and chrome

Here's my work so far. I think it's visually distinct enough, but the light border looks kinda muddy on light browsers.

iansu

iansu commented on Nov 14, 2019

@iansu
Contributor

We should not be using that logo in the templates. I think just the react logo but with a different colour will have to do.

heyimalex

heyimalex commented on Nov 14, 2019

@heyimalex
Contributor

alternative logos in firefox and chrome

Here's a different color of the original logo with a box around it. Not very visually distinct on chrome.

inverted alternative logo in firefox and chrome

Here's an inverted one. Not my favorite, but maybe with a different color combination it'd be alright.

ugh

Red actually looks pretty good, but it doesn't match the branding. Not sure that matters much.

iansu

iansu commented on Nov 14, 2019

@iansu
Contributor

I think the inverted one looks pretty good. We could maybe tweak the colour a bit but I like it and it definitely stands out.

city41

city41 commented on Dec 14, 2019

@city41
Author

Any more thoughts on this? I'd be happy to send in a PR, but I haven't as I feel it makes more sense for the core team to choose the favicon.

heyimalex

heyimalex commented on Dec 14, 2019

@heyimalex
Contributor

The templates use react branding, so I’ll submit a pr with the inverted react colors tomorrow. I think it’ll look good, it’s just the bright green that was kinda garish to me.

added this to the 3.4 milestone on Dec 16, 2019
added a commit that references this issue on Dec 19, 2019
c78357a
added a commit that references this issue on Dec 30, 2019
c03bb36
locked and limited conversation to collaborators on Jan 4, 2020
added a commit that references this issue on Jan 28, 2020
0dcf8da
added a commit that references this issue on Feb 19, 2020
102411c
added a commit that references this issue on Mar 22, 2020
b7da364
added a commit that references this issue on Mar 22, 2020
2d4e88b
added a commit that references this issue on Mar 31, 2020
9a35f3d
added a commit that references this issue on Apr 10, 2020
5b562e9
added a commit that references this issue on Jun 1, 2021
23b53f4
added a commit that references this issue on Oct 8, 2024
4874195
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

      Development

      Participants

      @city41@iansu@heyimalex@ianschmitz

      Issue actions

        Proposal: a red favicon · Issue #7957 · facebook/create-react-app