Skip to content

feat: replace default favicon with svg brand mark#71

Merged
ejirocodes merged 1 commit into
mainfrom
feat/svg-favicon
May 4, 2026
Merged

feat: replace default favicon with svg brand mark#71
ejirocodes merged 1 commit into
mainfrom
feat/svg-favicon

Conversation

@ejirocodes

Copy link
Copy Markdown
Member

Summary

  • Delete the boilerplate `web/app/favicon.ico` (Next.js's default create-next-app icon).
  • Add `web/app/icon.svg` — the Rhema brand mark, 1024×1024 rounded square with white "Rh" glyphs on black.
  • File uses Next.js's `icon` metadata convention (not `favicon.svg`) so the App Router auto-injects the matching `<link rel="icon" type="image/svg+xml">` tag.

Why SVG

  • Renders crisply at every browser tab size and on retina displays.
  • One file replaces the multi-resolution ICO baggage.
  • Supports `prefers-color-scheme` natively if we ever want a dark/light variant.

Test plan

  • `bun run build` in `web/` — confirmed `out/icon.svg` exists and `out/index.html` contains `<link rel="icon" type="image/svg+xml" href="/icon.svg?...">`.
  • After merge, hard-refresh https://openrhema.com/ and confirm the new icon shows in the browser tab (browsers cache favicons aggressively — DevTools "Disable cache" or a private window helps).

Drops the Next.js boilerplate favicon.ico and serves an SVG icon at
app/icon.svg. SVG icons render crisply at every size, scale to retina
tab bars, and support prefers-color-scheme natively.

Filename uses Next.js's `icon` metadata convention rather than
`favicon.svg` because the App Router only auto-handles `favicon.ico` by
that exact name; SVG, PNG, and JPG go through the `icon` slot which
auto-generates the matching <link rel="icon"> tag.
@ejirocodes ejirocodes merged commit 0fc0878 into main May 4, 2026
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant