redesign app icon — glass-lens orb with depth

10-layer foreground: soft halo, warm amber body with 6-stop gradient,
cool glass overlay, bounce light, volume shadow, internal caustic
structure, elliptical specular + micro pinpoint glint, gradient rims.
Replaces the flat 5-layer amber ball that looked like an emoji.

Background: warmer cream (light) with vignette, deeper obsidian (dark)
with warm center glow. Monochrome: stronger contrast + rim for themed
icon legibility.
This commit is contained in:
Bruno Deanoz 2026-06-22 13:49:43 +02:00
parent ba7ebafe08
commit e62c525386
4 changed files with 165 additions and 57 deletions

View file

@ -5,16 +5,17 @@
android:height="108dp" android:height="108dp"
android:viewportWidth="108" android:viewportWidth="108"
android:viewportHeight="108"> android:viewportHeight="108">
<!-- Dark mode: Obsidian with subtle blue steel gradient --> <!-- Dark mode: deep obsidian with subtle warm center glow -->
<path android:pathData="M0,0h108v108h-108z"> <path android:pathData="M0,0h108v108h-108z">
<aapt:attr name="android:fillColor"> <aapt:attr name="android:fillColor">
<gradient <gradient
android:type="radial" android:type="radial"
android:centerX="54" android:centerX="54"
android:centerY="54" android:centerY="50"
android:gradientRadius="76"> android:gradientRadius="72">
<item android:color="#FF111824" android:offset="0.0" /> <item android:color="#FF141C28" android:offset="0.0" />
<item android:color="#FF0A0E16" android:offset="1.0" /> <item android:color="#FF0E1420" android:offset="0.5" />
<item android:color="#FF080C14" android:offset="1.0" />
</gradient> </gradient>
</aapt:attr> </aapt:attr>
</path> </path>

View file

@ -5,16 +5,17 @@
android:height="108dp" android:height="108dp"
android:viewportWidth="108" android:viewportWidth="108"
android:viewportHeight="108"> android:viewportHeight="108">
<!-- Light mode: warm off-white with subtle amber tint --> <!-- Light mode: warm cream with subtle vignette -->
<path android:pathData="M0,0h108v108h-108z"> <path android:pathData="M0,0h108v108h-108z">
<aapt:attr name="android:fillColor"> <aapt:attr name="android:fillColor">
<gradient <gradient
android:type="radial" android:type="radial"
android:centerX="54" android:centerX="54"
android:centerY="54" android:centerY="50"
android:gradientRadius="76"> android:gradientRadius="72">
<item android:color="#FFF8F4EE" android:offset="0.0" /> <item android:color="#FFF9F3EB" android:offset="0.0" />
<item android:color="#FFF1EBE3" android:offset="1.0" /> <item android:color="#FFF4ECE0" android:offset="0.5" />
<item android:color="#FFEAE0D0" android:offset="1.0" />
</gradient> </gradient>
</aapt:attr> </aapt:attr>
</path> </path>

View file

@ -6,86 +6,183 @@
android:viewportWidth="108" android:viewportWidth="108"
android:viewportHeight="108"> android:viewportHeight="108">
<!-- Soft ambient glow behind the orb --> <!-- L0: Soft outer halo — large, diffuse amber glow -->
<path android:pathData="M54,54m-30,0a30,30 0,1 1,60 0a30,30 0,1 1,-60 0"> <path android:pathData="M54,54m-34,0a34,34 0,1 1,68 0a34,34 0,1 1,-68 0">
<aapt:attr name="android:fillColor"> <aapt:attr name="android:fillColor">
<gradient <gradient
android:type="radial" android:type="radial"
android:centerX="54" android:centerX="52"
android:centerY="54" android:centerY="50"
android:gradientRadius="30"> android:gradientRadius="34">
<item android:color="#50E0A23E" android:offset="0.0" /> <item android:color="#40D4942A" android:offset="0.0" />
<item android:color="#18E0A23E" android:offset="0.6" /> <item android:color="#20D4942A" android:offset="0.4" />
<item android:color="#08D4942A" android:offset="0.7" />
<item android:color="#00000000" android:offset="1.0" /> <item android:color="#00000000" android:offset="1.0" />
</gradient> </gradient>
</aapt:attr> </aapt:attr>
</path> </path>
<!-- Orb body — rich amber radial gradient, light source top-left --> <!-- L1: Orb body — warm amber core, light source offset top-left -->
<path android:pathData="M54,54m-21,0a21,21 0,1 1,42 0a21,21 0,1 1,-42 0"> <path android:pathData="M54,54m-21,0a21,21 0,1 1,42 0a21,21 0,1 1,-42 0">
<aapt:attr name="android:fillColor"> <aapt:attr name="android:fillColor">
<gradient <gradient
android:type="radial" android:type="radial"
android:centerX="47" android:centerX="48"
android:centerY="45" android:centerY="46"
android:gradientRadius="28"> android:gradientRadius="26">
<item android:color="#FFFFFBE6" android:offset="0.0" /> <item android:color="#FFFCE8C0" android:offset="0.0" />
<item android:color="#FFFFD685" android:offset="0.25" /> <item android:color="#FFEAB86A" android:offset="0.28" />
<item android:color="#FFE0A23E" android:offset="0.50" /> <item android:color="#FFD49430" android:offset="0.52" />
<item android:color="#FFC8862A" android:offset="0.75" /> <item android:color="#FFBE7A20" android:offset="0.72" />
<item android:color="#FF7A4400" android:offset="1.0" /> <item android:color="#FF9A5A12" android:offset="0.88" />
<item android:color="#FF7A4410" android:offset="1.0" />
</gradient> </gradient>
</aapt:attr> </aapt:attr>
</path> </path>
<!-- Inner volume shadow — heavy darkening at bottom edge for 3D depth --> <!-- L2: Glass overlay — cool-tinted top half for lens refraction feel -->
<path android:pathData="M54,54m-21,0a21,21 0,1 1,42 0a21,21 0,1 1,-42 0"> <path android:pathData="M54,54m-21,0a21,21 0,1 1,42 0a21,21 0,1 1,-42 0">
<aapt:attr name="android:fillColor"> <aapt:attr name="android:fillColor">
<gradient <gradient
android:type="radial" android:type="radial"
android:centerX="50" android:centerX="50"
android:centerY="48" android:centerY="40"
android:gradientRadius="22"> android:gradientRadius="24">
<item android:color="#00000000" android:offset="0.0" /> <item android:color="#18FFFFFF" android:offset="0.0" />
<item android:color="#00000000" android:offset="0.50" /> <item android:color="#0CFFFFFF" android:offset="0.35" />
<item android:color="#993D1E00" android:offset="1.0" /> <item android:color="#00FFFFFF" android:offset="0.65" />
<item android:color="#00000000" android:offset="1.0" />
</gradient> </gradient>
</aapt:attr> </aapt:attr>
</path> </path>
<!-- Primary specular highlight — top-left, bright white gloss --> <!-- L3: Bottom-right accent warmth (bounce light from environment) -->
<path android:pathData="M46,44m-9,0a9,9 0,1 1,18 0a9,9 0,1 1,-18 0"> <path android:pathData="M54,54m-21,0a21,21 0,1 1,42 0a21,21 0,1 1,-42 0">
<aapt:attr name="android:fillColor">
<gradient
android:type="radial"
android:centerX="64"
android:centerY="66"
android:gradientRadius="14">
<item android:color="#50FFBE50" android:offset="0.0" />
<item android:color="#20FFBE50" android:offset="0.4" />
<item android:color="#00FFBE50" android:offset="1.0" />
</gradient>
</aapt:attr>
</path>
<!-- L4: Bottom shadow — dark crescent for volume/sphere feeling -->
<path android:pathData="M54,54m-21,0a21,21 0,1 1,42 0a21,21 0,1 1,-42 0">
<aapt:attr name="android:fillColor">
<gradient
android:type="radial"
android:centerX="52"
android:centerY="44"
android:gradientRadius="23">
<item android:color="#00000000" android:offset="0.0" />
<item android:color="#00000000" android:offset="0.55" />
<item android:color="#30301800" android:offset="0.78" />
<item android:color="#70301800" android:offset="0.92" />
<item android:color="#90201000" android:offset="1.0" />
</gradient>
</aapt:attr>
</path>
<!-- L5: Internal caustic structure — off-center radial for depth -->
<path android:pathData="M54,54m-18,0a18,18 0,1 1,36 0a18,18 0,1 1,-36 0">
<aapt:attr name="android:fillColor">
<gradient
android:type="radial"
android:centerX="58"
android:centerY="50"
android:gradientRadius="20">
<item android:color="#00FFFFFF" android:offset="0.0" />
<item android:color="#0AFFD890" android:offset="0.3" />
<item android:color="#14E8A030" android:offset="0.6" />
<item android:color="#00000000" android:offset="1.0" />
</gradient>
</aapt:attr>
</path>
<!-- L6: Primary specular — tight elliptical highlight top-left -->
<path android:pathData="M45,42.5a8,6.5 -15,1 1,16 0a8,6.5 -15,1 1,-16 0">
<aapt:attr name="android:fillColor"> <aapt:attr name="android:fillColor">
<gradient <gradient
android:type="radial" android:type="radial"
android:centerX="46" android:centerX="46"
android:centerY="44" android:centerY="42"
android:gradientRadius="9"> android:gradientRadius="8">
<item android:color="#E0FFFFFF" android:offset="0.0" /> <item android:color="#D0FFFFFF" android:offset="0.0" />
<item android:color="#40FFFFFF" android:offset="0.4" /> <item android:color="#60FFFFFF" android:offset="0.3" />
<item android:color="#18FFFFFF" android:offset="0.6" />
<item android:color="#00FFFFFF" android:offset="1.0" /> <item android:color="#00FFFFFF" android:offset="1.0" />
</gradient> </gradient>
</aapt:attr> </aapt:attr>
</path> </path>
<!-- Secondary warm reflection — bottom-right bounce light --> <!-- L7: Micro specular — sharp pinpoint glint -->
<path android:pathData="M63,63m-7,0a7,7 0,1 1,14 0a7,7 0,1 1,-14 0"> <path android:pathData="M44,40m-2.5,0a2.5,2.5 0,1 1,5 0a2.5,2.5 0,1 1,-5 0">
<aapt:attr name="android:fillColor"> <aapt:attr name="android:fillColor">
<gradient <gradient
android:type="radial" android:type="radial"
android:centerX="63" android:centerX="44"
android:centerY="63" android:centerY="40"
android:gradientRadius="7"> android:gradientRadius="2.5">
<item android:color="#80FFD080" android:offset="0.0" /> <item android:color="#F0FFFFFF" android:offset="0.0" />
<item android:color="#00FFD080" android:offset="1.0" /> <item android:color="#60FFFFFF" android:offset="0.5" />
<item android:color="#00FFFFFF" android:offset="1.0" />
</gradient> </gradient>
</aapt:attr> </aapt:attr>
</path> </path>
<!-- Crisp outer rim — thin glass edge --> <!-- L8: Secondary specular — bottom-right warm bounce -->
<path android:pathData="M63.5,64m-4,0a4,4 0,1 1,8 0a4,4 0,1 1,-8 0">
<aapt:attr name="android:fillColor">
<gradient
android:type="radial"
android:centerX="63.5"
android:centerY="64"
android:gradientRadius="4">
<item android:color="#50FFD890" android:offset="0.0" />
<item android:color="#20FFD890" android:offset="0.5" />
<item android:color="#00FFD890" android:offset="1.0" />
</gradient>
</aapt:attr>
</path>
<!-- L9: Outer rim — crisp glass edge -->
<path <path
android:pathData="M54,54m-20.6,0a20.6,20.6 0,1 1,41.2 0a20.6,20.6 0,1 1,-41.2 0" android:pathData="M54,54m-20.5,0a20.5,20.5 0,1 1,41 0a20.5,20.5 0,1 1,-41 0"
android:strokeWidth="0.6" android:strokeWidth="0.7"
android:strokeColor="#25FFFFFF" android:fillColor="#00000000">
android:fillColor="#00000000" /> <aapt:attr name="android:strokeColor">
<gradient
android:type="radial"
android:centerX="46"
android:centerY="42"
android:gradientRadius="30">
<item android:color="#40FFFFFF" android:offset="0.0" />
<item android:color="#18FFFFFF" android:offset="0.5" />
<item android:color="#08FFFFFF" android:offset="1.0" />
</gradient>
</aapt:attr>
</path>
<!-- L10: Inner rim — subtle inset edge for glass depth -->
<path
android:pathData="M54,54m-19.5,0a19.5,19.5 0,1 1,39 0a19.5,19.5 0,1 1,-39 0"
android:strokeWidth="0.4"
android:fillColor="#00000000">
<aapt:attr name="android:strokeColor">
<gradient
android:type="radial"
android:centerX="48"
android:centerY="44"
android:gradientRadius="26">
<item android:color="#20FFFFFF" android:offset="0.0" />
<item android:color="#08FFFFFF" android:offset="0.6" />
<item android:color="#04FFFFFF" android:offset="1.0" />
</gradient>
</aapt:attr>
</path>
</vector> </vector>

View file

@ -6,31 +6,40 @@
android:viewportWidth="108" android:viewportWidth="108"
android:viewportHeight="108"> android:viewportHeight="108">
<!-- Simple orb circle for themed icons --> <!-- Orb body — solid-to-fade for themed icon legibility -->
<path android:pathData="M54,54m-22,0a22,22 0,1 1,44 0a22,22 0,1 1,-44 0"> <path android:pathData="M54,54m-22,0a22,22 0,1 1,44 0a22,22 0,1 1,-44 0">
<aapt:attr name="android:fillColor"> <aapt:attr name="android:fillColor">
<gradient <gradient
android:type="radial" android:type="radial"
android:centerX="48" android:centerX="48"
android:centerY="46" android:centerY="44"
android:gradientRadius="24"> android:gradientRadius="26">
<item android:color="#FFFFFFFF" android:offset="0.0" /> <item android:color="#FFFFFFFF" android:offset="0.0" />
<item android:color="#80FFFFFF" android:offset="1.0" /> <item android:color="#CCFFFFFF" android:offset="0.5" />
<item android:color="#60FFFFFF" android:offset="1.0" />
</gradient> </gradient>
</aapt:attr> </aapt:attr>
</path> </path>
<!-- Specular dot --> <!-- Specular dot — makes it read as a sphere, not a flat circle -->
<path android:pathData="M54,54m-22,0a22,22 0,1 1,44 0a22,22 0,1 1,-44 0"> <path android:pathData="M45,43m-5,0a5,4 0,1 1,10 0a5,4 0,1 1,-10 0">
<aapt:attr name="android:fillColor"> <aapt:attr name="android:fillColor">
<gradient <gradient
android:type="radial" android:type="radial"
android:centerX="45" android:centerX="45"
android:centerY="43" android:centerY="43"
android:gradientRadius="8"> android:gradientRadius="5">
<item android:color="#FFFFFFFF" android:offset="0.0" /> <item android:color="#FFFFFFFF" android:offset="0.0" />
<item android:color="#80FFFFFF" android:offset="0.4" />
<item android:color="#00FFFFFF" android:offset="1.0" /> <item android:color="#00FFFFFF" android:offset="1.0" />
</gradient> </gradient>
</aapt:attr> </aapt:attr>
</path> </path>
<!-- Rim -->
<path
android:pathData="M54,54m-21,0a21,21 0,1 1,42 0a21,21 0,1 1,-42 0"
android:strokeWidth="0.8"
android:strokeColor="#40FFFFFF"
android:fillColor="#00000000" />
</vector> </vector>