From e62658467f0cc0036d5635801ea19c8791c51a79 Mon Sep 17 00:00:00 2001
From: Andras Bacsai <5845193+andrasbacsai@users.noreply.github.com>
Date: Mon, 28 Sep 2026 11:09:13 +0200
Subject: [PATCH] feat(ui): add app icons and web manifest

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 public/apple-touch-icon.png            | Bin 0 -> 868 bytes
 public/favicon.ico                     | Bin 0 -> 1166 bytes
 public/icon-192.png                    | Bin 0 -> 890 bytes
 public/icon-512.png                    | Bin 0 -> 2211 bytes
 public/icon-maskable-512.png           | Bin 0 -> 2239 bytes
 public/site.webmanifest                |  14 ++++++
 resources/views/layouts/base.blade.php |   4 ++
 tests/Feature/AppIconsTest.php         |  59 +++++++++++++++++++++++++
 8 files changed, 77 insertions(+)
 create mode 100644 public/apple-touch-icon.png
 create mode 100644 public/favicon.ico
 create mode 100644 public/icon-192.png
 create mode 100644 public/icon-512.png
 create mode 100644 public/icon-maskable-512.png
 create mode 100644 public/site.webmanifest
 create mode 100644 tests/Feature/AppIconsTest.php

diff --git a/public/apple-touch-icon.png b/public/apple-touch-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..e9394964a27cff65f26dac29fd35d690020a414e
GIT binary patch
literal 868
zcmeAS@N?(olHy`uVBq!ia0vp^TR@nD2}o{QKQWbofmzbi#WAE}&YQdEyQZef9QgRW
zXW1e?xnQZ^=>jf7%omsSN=IwC>|P-KGAPPTZ%>253$`LviK{xRLL&_O5`BC*{rbw7
zYxzxz(#~1TKmYA}PTY@Ab{`(Met%J7CHo<M8XHUDgd>hZ?4B|zlrfepPJS3${dw|L
zZu!2$DaqMyf4$XC-d|aa#dN*{ZC?bUX36aQa_Fig`@a3(pU$u^)LC}&Q>Xaxy5hCy
zI+oZ*HPwFk_B?re-H*53TYIHVZEN2g`mC<smwtM&x^*(+n?RZMe)|1)e|>w`YdzaM
zd)KBtRj-cBJSejx%;S+lXR`|5Bnv3x65|h_4^N7p$60+o*TcO3-^Z^Be0&Zv%lqcm
z?|dBb|MTv6vwYrX2evv<Aw-A{&{;mqFB{fRkN;h9?8}plpWW4V|4F}c*u6ggeNJ!s
z>G<2<_eK8Cd9&TND|y@YFguIVKQX@Xk#+BTKZhSr+_Z6P+23zdH{OrYMz=3h@n7oy
z2lIdT&(FF3<>Sk_g(rN}CO>^Fo+fjns-pbNeWxQIFTamJJ7Ztnx4%HSV-vl#ucyiE
zD18oe%sNqckU<$+1iUxgd}sgT<MXq#P3QJ3U3!wSqU(QZc6F^zL+g*WFPUp}*2mfW
zerJ)A<8d<`E!cr(u-7@C`cr`|Igpq9{;@JJ{QvJ3e(MS_udsnK2{S{TP~h>Fh7UJ^
OA`G6celF{r5}E*6J8|X!

literal 0
HcmV?d00001

diff --git a/public/favicon.ico b/public/favicon.ico
new file mode 100644
index 0000000000000000000000000000000000000000..5dbb129549569e70343f736d4cd1426b695c56a5
GIT binary patch
literal 1166
zcmZQzU}Rus5D;Jh(h3Z&j0_BB3=9kk3K0GTAio-j4GbXsW+0oJnSr4*z|WnRONtAq
zl-JY4B?w3ZO<)k<U;~o!pZ_NUsb8Khjv*Cu-b}XbXDk#rmTtCt`sCd%#pO5WIH_Lz
zz$)UBvv{G{M_CV%I4&txuJ{JGwF-fmKRBEg3Iz&qIi+kY<9)sM!i}Y0P5%E+`Si!=
z<e9^VTqE^A8ZGZ}+^iwLz9>*^-W9J||Ek|iymFbrbKYzLg$Bv_KFb?9)H<b3b8qvI
z6ljWa+|J3t!5Y28bIW>}?nQYAF19qha9NbJI65Qi3p2C+E8c+Z4p)M{?e_PKG`44Z
zeIjGSpPhd#uRA~QlRft8hWl6j8;5`LACoAWF?s)j$mco_wqB85HuFaIR&~|qZzmkl
zk0^}x(l=vXt)l<ay<z2zpJDNP@?V@i1PrAA|0RP>dx4?A1_}jc2FC~CM?!CVt^tZL
zc)I$ztaD0e!V-uIKxqYVAQo3ueF28KD>M+N8+tPvO0@0QpZ=ON_uxV=QP&umEw}a;
zbUlA^VSW-Td#Pr~g|qb!Uc_+mU2>GY5_;w2!GnHcnylIxx1U^|GpAWBMylB3-cz~0
z{0a}Jio*;2zlCY)%NDZEa(a@oef5tOGa4UCh(AbB5dV59cf*ExfjM=oW!$m<fBP#Q
z(GZ%esV1~XJwDjrfXB_*zl0PHO_mq-xE>v9zTV)3Xn4az!wfGQe#MC?r+1p#ryS_a
zu>R-cFv&w9d49BW!0NkielO7crnHGE>;P8;qjo|J!(z89b=gba&vs8eDtCU%^7iS6
z#EwY3w|cSn0K?_PJpro{ybbTK*|D7K&&}R7r(JI}UFtk(J$-qaLvRdd+>wu&F1#LQ
z$5XQdKc2X7=f?5p0wzy4?JE{IBR;un<Nbzr%WwX4{<%_l-s6vY2kx`|tJO8v`@jc^
zk12<voPnVWjgPu>3IAq#Z#D;t;ENAnvS%;=$45BR&vsyZSU}_B=0-1OM*+46GmAyn
zZ47i`spj4(vdxUqa<zz^!v|TPnQ=iKt#f-r=Q&u52F4$7>$Yi};Kbc3uxaPqoZ<~j
zPP7Ub6({aXyE%XNqxNXNG9Hl^CT}!zA1I%=kb8gjXM>IfPqr|aGpibHu&>T6`Y4vR
zRO`WsV+|EDX;o}HW}ch5_I%X=%RBCiz8h@L+raCht^eQr&$i1m6%So+`abVA|Lm^@
z9@%U6#cL@v%wx=Z{a;x+^}qGM*~<-z^;Ykzx%<VD;cv^1Ovb#ZhS_2dma(ESm+CiM
zcAT|kmtF3&-(E4lE!LRzJFv+bc5bdSFXpItnSbxyr@wh~WPUsqW0{eC<ja@JyPv)F
z@6R_`w~Zs^g5YGA*6o)gQ|gqZx@8R&bsXG%yqB=<@CAnB|Nr(=SN#Gqpi!W6IfC=X
M_xY7T5qJ~;0KU}W!vFvP

literal 0
HcmV?d00001

diff --git a/public/icon-192.png b/public/icon-192.png
new file mode 100644
index 0000000000000000000000000000000000000000..ec59c83f1b30fb9c515efd76eef171320b8f099e
GIT binary patch
literal 890
zcmeAS@N?(olHy`uVBq!ia0vp^2SAvE2}s`E_d9@rfmz?v#WAE}&YQc2*>gi>8a@_J
zzGA|1dG!{zW|kuhxmX=bR&^v778eWIPbogAudw6B)uno@>aAx4FJ4=!nh-5jEPChu
zLH78(N%!+@|9^ZaWAQxh-rA={mJjydk`UnNaB)y!QW6yCZ17-lQBn|MoJg5a^y5Dj
zx!<o%m#?wc+q=H5;`@2=`kt=|?AWb1Sy^@JLHzc6KXOd{)Y;@@?#mW$WX9%#GgZR1
zJNDQ%&0YI?zs){-%S|_8VkE`y-h7p_Q6f9(T7zBv``dyxHa}m!mbafNapSh#j-B=C
zF(t2q&lj`^a$<UN&T{#y`eNPFx5v+y*s*D6^`|%65B8i3bx8g^_piS?+dP}UUte6@
zd$30)k*c9XVn}a_(3_sD*M9o8@M`Jg*Jq#p4rcCN-G1F}o<v0N=FL}M?s&29=g;ov
z%l(g4&G@?c{_+0z{%i7b-`u%TU7eIr{Pod;TkVf8-HzE~a;;6d2TMe!T$}wOb9uUd
zzg(TU;fGUKS606|{djG-{jcn=IY|$I0bn@Yl<S4O`uY0#5qEFyvXe+I|9vcL&FRVW
zaTr&h`se<)ZTxxf?n_R;*Zg>QvR)aEBo(t_InT3n9La)`#Q2Ymf#LuEw1(Syz#PN|
c$~w#pmM7dwLbtg|14S4-UHx3vIVCg!0KddV4gdfE

literal 0
HcmV?d00001

diff --git a/public/icon-512.png b/public/icon-512.png
new file mode 100644
index 0000000000000000000000000000000000000000..1a466bfde67b26bdaf0f8ed0e0e2554ed3f5dbe9
GIT binary patch
literal 2211
zcmeAS@N?(olHy`uVBq!ia0y~yU;;9k7&t&wwUqN(1_q7@PZ!6KiaBp?9PGMUD$)M&
z{>*=mEi6pcy(YUX^z9TB6J*hiV!PY8`-9e^?u?f~yIQ{qZs}0Te7Gny&qym+e5tTu
zieI?FF3a?`;(6zv%f-p<dv7xTJUfG}G;@OrBSVJ}LxaXBMPU%E$lTy&SNVOmv2{LQ
zgl6^c@9XaFFtI2SV{n+lz~I73JIa^&!Hl!_b{CZD96W1%oxOcC1H&Q~1_dwLQCU(p
zSErti@4Nc(?)mxuKmRxwvE{OLevbcc=4p@jH#Z+F6lh4du>YU1rf+>-ecAu_^2Zm=
zy>sX02GPW~7TL5+YM?lXt9>|kx?ikBcUk@W<@e?9Ngb#XY}i^<bjx;QWs=UV_4RkF
zw$zt1ygtg!LCY|rVepR{O?JeAQm%e|o%OVY<ZYJHn>S`eUw${aSvdLPxpy&jg}=8l
zp8ojb<o^A(f9eXJq<#KbQ}E=TU3u!~oo_d0<j>vt>(k0^=CD)u{_V{+*W>M*BQ8M8
zynV&Qg0K2_y^nNs@<l$jHA|jvKi8*P0Zh9E7K|2h+vRI)r#<-lc|Ko+?dI<FH8#^8
zJe&Kv`EVs8BP|OXU^#ZhBtkj<&xeN*P1pVFx9qOX1Lh?rT2~?~Zr0ezGkl3)U<hPl
y5KtYZs1OAInHd=V|9{Ha*#&HBuz}hb%nS#)J^I|z(vAT|7(8A5T-G@yGywp~t>4}N

literal 0
HcmV?d00001

diff --git a/public/icon-maskable-512.png b/public/icon-maskable-512.png
new file mode 100644
index 0000000000000000000000000000000000000000..19f8d194ca0ce62b88a4644249233c970e7cd62a
GIT binary patch
literal 2239
zcmeAS@N?(olHy`uVBq!ia0y~yU;;9k7&t&wwUqN(1_q82PZ!6KiaBp?Z0wto%Fy~S
zKP^4Q+^I}OOGm<V;{+yd?p14bwl4Z$v}WzfwQKh>YHLSJN$G0%^t3K&n&{EwB*5$?
zHn~@P!xMAKwENF@cA7ue30r-YVL`ebgNG19g9al*$0#+_f*^{=qU7b){(IH0Pc<n2
z`1pPG{QA!i6Ani*Fa$C&2&htp+A6_tJ|lbEo)52nCvSTHuEsJ#o{?eR%^WlPt$WRH
z6zC~XDebH{ny~iU{T~%J=Ij1`IXNTEE_%<8L#LY`zq>fuo^7^2!?m3MXP>Jw#NYk(
z<yEhC@~pW}Uv^hdXWzgX<3KInb~CnbOFJE`ey%T5?DJdp{yhE!VGf4>mK*QvEqK;!
zc=qt|^8J6`b~ENMi3>PPVPJ6KWEiCeNf2Dg*&4-r?fKWM|7N_IIywKnPT6r2>+ZeA
z>h~ot+sLxB`_Jd;+kKmVUHsm{)C~{Cnz!z%e1B_3PIYCGUFGTA^XKN>-fQxJW1h?(
z;~O>9Ow*t5*8ccAzaHp{ITbJ8G%TKZe%raX`>fS|fBpCM;4h8?g$3W&%O6X5?*EqG
zV%E=`!Z-%A`P>`|UJMM2SQsd!vJ4+wXg<FG&aU!YAJf~jblH#J{d?S=-|Rjpuzt*c
zqvIccXSdCRjD7ol-b|>aUPb~IKBm!Y!<ZZ7xGDAnbwXm)6w=eut9W4R<NyCnoeGnH
f3^q{vgPCF9Kfja<8%|#biZFP(`njxgN@xNA30DDj

literal 0
HcmV?d00001

diff --git a/public/site.webmanifest b/public/site.webmanifest
new file mode 100644
index 0000000000..f16ea8f718
--- /dev/null
+++ b/public/site.webmanifest
@@ -0,0 +1,14 @@
+{
+    "name": "Coolify",
+    "short_name": "Coolify",
+    "start_url": "/",
+    "scope": "/",
+    "display": "standalone",
+    "background_color": "#101010",
+    "theme_color": "#101010",
+    "icons": [
+        { "src": "/icon-192.png", "type": "image/png", "sizes": "192x192" },
+        { "src": "/icon-512.png", "type": "image/png", "sizes": "512x512" },
+        { "src": "/icon-maskable-512.png", "type": "image/png", "sizes": "512x512", "purpose": "maskable" }
+    ]
+}
diff --git a/resources/views/layouts/base.blade.php b/resources/views/layouts/base.blade.php
index 689b2fa0e8..27ddee9f33 100644
--- a/resources/views/layouts/base.blade.php
+++ b/resources/views/layouts/base.blade.php
@@ -156,8 +156,12 @@
     @env('local')
         <link rel="icon" href="{{ asset('coolify-logo-dev-transparent.png') }}" type="image/png" />
     @else
+        <link rel="icon" href="{{ asset('favicon.ico') }}" sizes="32x32" />
         <link rel="icon" href="{{ asset('coolify-logo.svg') }}" type="image/svg+xml" />
     @endenv
+    <link rel="apple-touch-icon" href="{{ asset('apple-touch-icon.png') }}" />
+    <link rel="manifest" href="{{ asset('site.webmanifest') }}" />
+    <meta name="apple-mobile-web-app-title" content="Coolify" />
     <meta name="csrf-token" content="{{ csrf_token() }}">
     @vite(['resources/js/app.js', 'resources/css/app.css'])
     <script>
diff --git a/tests/Feature/AppIconsTest.php b/tests/Feature/AppIconsTest.php
new file mode 100644
index 0000000000..82af3f915c
--- /dev/null
+++ b/tests/Feature/AppIconsTest.php
@@ -0,0 +1,59 @@
+<?php
+
+use App\Models\InstanceSettings;
+use App\Models\User;
+use Illuminate\Foundation\Testing\RefreshDatabase;
+use Illuminate\Support\Once;
+
+uses(RefreshDatabase::class);
+
+test('base layout links the app icons and web manifest', function () {
+    InstanceSettings::query()->forceCreate(['id' => 0]);
+    Once::flush();
+    User::factory()->create();
+
+    $this->get('/login')
+        ->assertSuccessful()
+        ->assertSee('<link rel="apple-touch-icon" href="'.asset('apple-touch-icon.png').'" />', false)
+        ->assertSee('<link rel="manifest" href="'.asset('site.webmanifest').'" />', false)
+        ->assertSee('<meta name="apple-mobile-web-app-title" content="Coolify" />', false);
+});
+
+test('icon files are opaque pngs with the required sizes', function (string $file, int $size) {
+    $image = getimagesize(public_path($file));
+
+    expect($image)->toMatchArray([0 => $size, 1 => $size, 'mime' => 'image/png']);
+})->with([
+    ['apple-touch-icon.png', 180],
+    ['icon-192.png', 192],
+    ['icon-512.png', 512],
+    ['icon-maskable-512.png', 512],
+]);
+
+test('favicon ico contains 16, 32 and 48 pixel images', function () {
+    $ico = file_get_contents(public_path('favicon.ico'));
+    $header = unpack('vreserved/vtype/vcount', $ico);
+    $sizes = collect(range(0, $header['count'] - 1))
+        ->map(fn (int $index) => ord($ico[6 + 16 * $index]))
+        ->all();
+
+    expect($header['type'])->toBe(1)
+        ->and($sizes)->toBe([16, 32, 48]);
+});
+
+test('web manifest lists the pwa icons', function () {
+    $manifest = json_decode(file_get_contents(public_path('site.webmanifest')), true, flags: JSON_THROW_ON_ERROR);
+
+    expect($manifest['name'])->toBe('Coolify')
+        ->and($manifest['display'])->toBe('standalone')
+        ->and(collect($manifest['icons'])->map(fn (array $icon) => [$icon['src'], $icon['sizes'], $icon['purpose'] ?? 'any'])->all())
+        ->toBe([
+            ['/icon-192.png', '192x192', 'any'],
+            ['/icon-512.png', '512x512', 'any'],
+            ['/icon-maskable-512.png', '512x512', 'maskable'],
+        ]);
+
+    foreach ($manifest['icons'] as $icon) {
+        expect(public_path(ltrim($icon['src'], '/')))->toBeFile();
+    }
+});