Skip to content

Instantly share code, notes, and snippets.

@lordofthedanse
Last active August 4, 2025 16:34
Show Gist options
  • Save lordofthedanse/911b9b952de7d79c25986e7a47e96565 to your computer and use it in GitHub Desktop.
Save lordofthedanse/911b9b952de7d79c25986e7a47e96565 to your computer and use it in GitHub Desktop.
Making Favicons
# Cheers to https://railsdesigner.com/favicons-in-rails/
```
inkscape ./icon.svg --export-width=32 --export-filename="./tmp.png"
magick ./tmp.png ./public/favicon.ico
rm ./tmp.png
inkscape ./icon.svg --export-width=512 --export-filename="./public/icon-512.png"
inkscape ./icon.svg --export-width=192 --export-filename="./public/icon-192.png"
inkscape ./icon.svg --export-width=180 --export-filename="./public/apple-touch-icon.png"
npx svgo --multipass icon.svg
cat <<EOF > ./public/manifest.webmanifest
{
"name": "Rails Designer",
"icons": [
{ "src": "/icon-192.png", "type": "image/png", "sizes": "192x192" },
{ "src": "/icon-512.png", "type": "image/png", "sizes": "512x512" }
]
}
EOF
cat <<EOF > app/views/shared/_favicons.html.erb
<link rel="icon" href="/favicon.ico" sizes="32x32">
<link rel="icon" href="/icon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="manifest" href="/manifest.webmanifest">
EOF
```
# In layout:
# = render partial: "shared/favicons"
# To see it take effect, you probably need to clear the cache (or open an incognito browser).
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment