github-starred/open-webui
2
0
Fork 0
mirror of https://github.com/open-webui/open-webui.git synced 2026-05-05 18:38:17 -05:00
Code Issues 1.1k Packages Projects Releases 126 Wiki Activity

[GH-ISSUE #4461] macOS PWA Launchpad/Dock icon is a square, not a squircle #52286

New Issue
Closed
opened 2026-05-05 13:25:43 -05:00 by GiteaMirror · 8 comments
GiteaMirror commented 2026-05-05 13:25:43 -05:00
Owner
Copy Link

Originally created by @reddiedev on GitHub (Aug 8, 2024).
Original GitHub issue: https://github.com/open-webui/open-webui/issues/4461

Bug Report

Installation Method

Self-hosted Docker installation via Digital Ocean droplet. Add the PWA on macOS via the icon on the address bar in Chrome

Environment

  • Open WebUI Version: v0.3.12

  • Ollama (if applicable): None, I use Perplexity pipeline

  • Operating System: Ubuntu 24.04 LTS

  • Browser (if applicable): v119.0.6045.105 (Official Build) (arm64)

Confirmation:

  • I have read and followed all the instructions provided in the README.md.
  • I am on the latest version of Open WebUI
  • I have provided the exact steps to reproduce the bug in the "Steps to Reproduce" section below.

Expected Behavior:

image

Icon should be a squircle, as is the case in IOS PWA. Please see issue #1886

Actual Behavior:

Icons are square. Apart from the icon, the PWA works as expected

Dock
SCR-20240808-qbpx

Launchpad
SCR-20240808-qbxm

Description

Bug Summary:
macOS PWA Icon in launchpad/dock is square image

Reproduction Details

Steps to Reproduce:

  1. Deploy an instance of Open-webui
  2. Install the app as a PWA on your macOS device
  3. See the icon at Dock/Launchpad

Notes

This is a very minor bug, but I tried looking at the src code to see where it could be fixed but I can't find the references on how to resolve it. If anyone can provide any guides or points on where to start, that would be awesome. Thanks!

Originally created by @reddiedev on GitHub (Aug 8, 2024). Original GitHub issue: https://github.com/open-webui/open-webui/issues/4461 # Bug Report ## Installation Method Self-hosted Docker installation via Digital Ocean droplet. Add the PWA on macOS via the icon on the address bar in Chrome ## Environment - **Open WebUI Version:** v0.3.12 - **Ollama (if applicable):** None, I use Perplexity pipeline - **Operating System:** Ubuntu 24.04 LTS - **Browser (if applicable):** v119.0.6045.105 (Official Build) (arm64) **Confirmation:** - [x] I have read and followed all the instructions provided in the README.md. - [x] I am on the latest version of Open WebUI - [x] I have provided the exact steps to reproduce the bug in the "Steps to Reproduce" section below. ## Expected Behavior: ![image](https://github.com/user-attachments/assets/388ee465-34e5-453e-9951-191625c25c6c) Icon should be a squircle, as is the case in IOS PWA. Please see issue #1886 ## Actual Behavior: Icons are square. Apart from the icon, the PWA works as expected Dock <img width="50" alt="SCR-20240808-qbpx" src="https://github.com/user-attachments/assets/d63bb13e-b6ea-4363-81b1-b412d4ede6c2"> Launchpad <img width="181" alt="SCR-20240808-qbxm" src="https://github.com/user-attachments/assets/2e772df3-d0b2-4500-86dd-bc7c3702dd90"> ## Description **Bug Summary:** macOS PWA Icon in launchpad/dock is square image ## Reproduction Details **Steps to Reproduce:** 1. Deploy an instance of Open-webui 2. Install the app as a PWA on your macOS device 3. See the icon at Dock/Launchpad ## Notes This is a very minor bug, but I tried looking at the src code to see where it could be fixed but I can't find the references on how to resolve it. If anyone can provide any guides or points on where to start, that would be awesome. Thanks!
GiteaMirror commented 2026-05-05 13:25:44 -05:00
Author
Owner
Copy Link

@sebdanielsson commented on GitHub (Aug 8, 2024):

image

Looking good for me. How are you installing the PWA? What browser, how did you install it?

<!-- gh-comment-id:2275878454 --> @sebdanielsson commented on GitHub (Aug 8, 2024): <img width="116" alt="image" src="https://github.com/user-attachments/assets/68860f1a-77ce-4b75-a70f-ddd4551f668d"> Looking good for me. How are you installing the PWA? What browser, how did you install it?
GiteaMirror commented 2026-05-05 13:25:44 -05:00
Author
Owner
Copy Link

@reddiedev commented on GitHub (Aug 8, 2024):

image

I just used this button on the address bar.

For reference, my Open-webui instance is hosted on a digital ocean droplet and I access it with https via a Caddy server running a reverse proxy to the instance. Would that in any way affect how the logo is displayed?

I am using this version of Google Chrome:
Version 119.0.6045.105 (Official Build) (arm64)

And I am on macOS Sonoma v14.6

<!-- gh-comment-id:2276082473 --> @reddiedev commented on GitHub (Aug 8, 2024): <img width="104" alt="image" src="https://github.com/user-attachments/assets/ec6f90db-8365-4736-b47a-49113aef1c31"> I just used this button on the address bar. For reference, my Open-webui instance is hosted on a digital ocean droplet and I access it with https via a Caddy server running a reverse proxy to the instance. Would that in any way affect how the logo is displayed? I am using this version of Google Chrome: `Version 119.0.6045.105 (Official Build) (arm64)` And I am on macOS `Sonoma v14.6`
GiteaMirror commented 2026-05-05 13:25:44 -05:00
Author
Owner
Copy Link

@mfauveau commented on GitHub (Aug 8, 2024):

Hi @sebdanielsson, I have the same issue. I used the install app icon as well.
Chrome version: 127.0.6533.89 (Official Build) (arm64)
Mac OS: Sonoma v14.5

<!-- gh-comment-id:2276088974 --> @mfauveau commented on GitHub (Aug 8, 2024): Hi @sebdanielsson, I have the same issue. I used the install app icon as well. Chrome version: `127.0.6533.89 (Official Build) (arm64)` Mac OS: `Sonoma v14.5`
GiteaMirror commented 2026-05-05 13:25:45 -05:00
Author
Owner
Copy Link

@justinh-rahb commented on GitHub (Aug 8, 2024):

Adding to Dock from Safari will give a rounded icon like @sebdanielsson has, but doing so in Chrome gives a square.

<!-- gh-comment-id:2276093351 --> @justinh-rahb commented on GitHub (Aug 8, 2024): Adding to Dock from Safari will give a rounded icon like @sebdanielsson has, but doing so in Chrome gives a square.
GiteaMirror commented 2026-05-05 13:25:45 -05:00
Author
Owner
Copy Link

@reddiedev commented on GitHub (Aug 8, 2024):

Thank you for that. I just tried it and it's now giving the expected rounded icon

image
<!-- gh-comment-id:2276100005 --> @reddiedev commented on GitHub (Aug 8, 2024): Thank you for that. I just tried it and it's now giving the expected rounded icon <img width="76" alt="image" src="https://github.com/user-attachments/assets/2dd60529-1a71-4252-8f36-a76030b0fc5e">
GiteaMirror commented 2026-05-05 13:25:45 -05:00
Author
Owner
Copy Link

@sebdanielsson commented on GitHub (Aug 8, 2024):

Thank you for that. I just tried it and it's now giving the expected rounded icon

image

Please keep the issue open as users might want to use another browser than Safari for their PWAs.

Maybe relevant:

https://issues.chromium.org/issues/40190430#comment34

Looks like a maskable icon needs to be provided:

https://www.w3.org/TR/appmanifest/#icon-masks

<!-- gh-comment-id:2276135924 --> @sebdanielsson commented on GitHub (Aug 8, 2024): > Thank you for that. I just tried it and it's now giving the expected rounded icon > > <img alt="image" width="76" src="https://private-user-images.githubusercontent.com/105657266/356282724-2dd60529-1a71-4252-8f36-a76030b0fc5e.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjMxMzE2NDEsIm5iZiI6MTcyMzEzMTM0MSwicGF0aCI6Ii8xMDU2NTcyNjYvMzU2MjgyNzI0LTJkZDYwNTI5LTFhNzEtNDI1Mi04ZjM2LWE3NjAzMGIwZmM1ZS5wbmc_WC1BbXotQWxnb3JpdGhtPUFXUzQtSE1BQy1TSEEyNTYmWC1BbXotQ3JlZGVudGlhbD1BS0lBVkNPRFlMU0E1M1BRSzRaQSUyRjIwMjQwODA4JTJGdXMtZWFzdC0xJTJGczMlMkZhd3M0X3JlcXVlc3QmWC1BbXotRGF0ZT0yMDI0MDgwOFQxNTM1NDFaJlgtQW16LUV4cGlyZXM9MzAwJlgtQW16LVNpZ25hdHVyZT0wZDJkMDJmMWY2MjFmNjJmNWU3MDVhNGY0MzBjYTE2ZDdiZGFkMzc0NzRmN2I2NTdjMWNlNmUxOTNkZTc4ZjU5JlgtQW16LVNpZ25lZEhlYWRlcnM9aG9zdCZhY3Rvcl9pZD0wJmtleV9pZD0wJnJlcG9faWQ9MCJ9.6MJmqRpgr9qc8kd_EHc5iClOBErinG6G2zwHk3j0544"> Please keep the issue open as users might want to use another browser than Safari for their PWAs. Maybe relevant: https://issues.chromium.org/issues/40190430#comment34 Looks like a maskable icon needs to be provided: https://www.w3.org/TR/appmanifest/#icon-masks
GiteaMirror commented 2026-05-05 13:25:46 -05:00
Author
Owner
Copy Link

@tjbck commented on GitHub (Aug 14, 2024):

PR Welcome!

<!-- gh-comment-id:2288911949 --> @tjbck commented on GitHub (Aug 14, 2024): PR Welcome!
GiteaMirror commented 2026-05-05 13:25:46 -05:00
Author
Owner
Copy Link

@sebdanielsson commented on GitHub (Aug 14, 2024):

PR Welcome!

I could give it a shot. Where can I get a high resolution version of the icon? At least 512x512px.

<!-- gh-comment-id:2288968916 --> @sebdanielsson commented on GitHub (Aug 14, 2024): > PR Welcome! I could give it a shot. Where can I get a high resolution version of the icon? At least 512x512px.
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
bug
confirmed
confirmed issue
core
documentation
enhancement
good first issue
help wanted
non-core
pull-request
Mirrored from GitHub Pull Request
 python
question
testing wanted
No Label
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
GiteaMirror ninjasurge
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/open-webui#52286
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?