App icon on Old Expensify don't support dark mode
If you haven’t already, check out our contributing guidelines for onboarding and email [email protected] to request to join our Slack channel!
Version Number: 9.0.50.6 Reproducible in staging?: Yes Reproducible in production?: If this was caught on HybridApp, is this reproducible on New Expensify Standalone?: If this was caught during regression testing, add the test name, ID and link from TestRail: Email or phone of affected tester (no customers): Logs: https://stackoverflow.com/c/expensify/questions/4856 Expensify/Expensify Issue URL: Issue reported by: @dubielzyk-expensify Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1729202799742179
Action Performed:
- Find Old Expensify on your homescreen
- Change to dark mode
Expected Result:
See the Old Expensify icon change to be dark mode compliant
Actual Result:
Icon still has white background color
Workaround:
Can the user still use Expensify without this being fixed? Have you informed them of the workaround?
Platforms:
Which of our officially supported platforms is this issue occurring on?
- [ ] Android: Standalone
- [ ] Android: HybridApp
- [ ] Android: mWeb Chrome
- [ ] iOS: Standalone
- [x] iOS: HybridApp
- [ ] iOS: mWeb Safari
- [ ] MacOS: Chrome / Safari
- [ ] MacOS: Desktop
Screenshots/Videos
Add any screenshot/video evidence
https://github.com/user-attachments/assets/0dd7d5c8-dae4-499f-b1c2-a2095ec97e3c
Triggered auto assignment to @muttmuure (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.
Hey @dubielzyk-expensify can you remind me what we need to do here? The linked thread doesn't contain your solution. Which I think is to provide a dark mode icon for OldDot?
According to their documentation we need to provide a dark mode asset. Light mode and tinted mode is working well already so here's the dark mode variations:
That should give us this look on mobile:
cc @Expensify/design
Looks good to me 👍
Thanks Jon.
The icons you shared have the squared edges and I wonder if that is desired or not? We're already using the rounded logo in production, so I'm not sure which is expected.
Rounded edges would be expected.
Ahh, I just used a Figma file I found but the wrong artboards. My bad! I'll fix
Here's another go :D app-icons.zip
@dubielzyk-expensify can I get Dark - App Store.png at 1024x1024 please?
@Julesssss @muttmuure @dubielzyk-expensify this issue was created 2 weeks ago. Are we close to a solution? Let's make sure we're treating this as a top priority. Don't hesitate to create a thread in #expensify-open-source to align faster in real time. Thanks!
Low priority for now.
Reopening as this wasn't fully implemented. I created a new PR that supports light, dark, and tinted icons here.
Hey @dubielzyk-expensify, the themed icon for Expensify looks a bit odd with the different shades. Should we use the same single shade for themed icons? (to match the NewDot logo) Or is it fine as-is?
Should we use the same single shade for themed icons? (to match the NewDot logo)
My 2 cents is a big yes to this. I think the ND one looks way better IMO.
Agree with big yes. Now there'll be no way to differentiate them though. I've made a white version which means the tint will apply fully. We could do a gradient or something else here or even have the outer rings be a bit more faded. Here's a few variations.
If we just want white, then use these: tinted-icon.zip
Oohh very nice.
Now there'll be no way to differentiate them though
The good news is that we're very close to delisting the New Expensify standalone app, so that won't be a problem. To align with the OS app icons I lean towards solid, but I am NOT-A-DESIGNER
@dannymcclain let us know your thoughts on the icon options and I'll implement.
My vote would be to go flat, since we don't use gradients really anywhere in our brand system.
Agree with flat! I actually also really like the faded outer ring version, but since we're going to be delisting "New Expensify" soon I think it makes sense to just go flat as that most closely represents the latest and greatest iteration of our iconmark. (Jon also knew Shawn and I were going to say flat which is why he went ahead and included the files for that one 🤣)
Great, thanks all.
@dubielzyk-expensify, maybe I missed it, but could you please share a 1024x1024 asset? I could only see up to 512x512. FYI, as of iOS 18, we now only need to provide a single asset, which is automatically resized.
(Jon also knew Shawn and I were going to say flat which is why he went ahead and included the files for that one 🤣)
😂 ❤️
but could you please share a 1024x1024 asset? I could only see up to 512x512. FYI, as of iOS 18, we now only need to provide a single asset, which is automatically resized.
Here you go: Tinted - App Store.png.zip
Thanks all
Awesome work Jules!