← ClaudeAtlas

zero-bloat-icon-favicon-skilllisted

Generator icon, favicon, app touch icon, dan PWA web asset berstandar ganda: Cupertino Crystal Glass (skill.megapass.web.id) dan Minimalist Flat (pastree.megapass.web.id): grid 64x64, rasio squircle emas, Lucide-scale 24x24 geometry, highlight refraction bevel, multi-size C-native slicing (ICO 16/32/48/64, Apple 180, PWA 192/512), tanpa dependensi Node.js.
4ntiDandruff/zero-bloat-skills · ★ 1 · Web & Frontend · score 74
Install: claude install-skill 4ntiDandruff/zero-bloat-skills
# Zero-Bloat Icon & Favicon Engine Skill (Cupertino Glass & Pastree Standard) SOP rekayasa dan generator aset visual digital web (favicon, touch-icon, app icon, dan manifest) berbasis siluet vektor geometris presisi, zero build-step, dan bebas dependensi Node.js/npm. Terinspirasi langsung dari dua proyek kanonikal ruko Megapass Intra Solusindo: 1. `skill.megapass.web.id`: Apple Cupertino Crystal Glass squircle (`rx="18"`), gradien dua arah (`#2563EB` -> `#6366F1`), highlight bevel refleksi atas, dan simbol vektor Lucide scale-2. 2. `pastree.megapass.web.id`: Minimalist flat squircle (`rx="16"`), latar warna Deep Emerald (`#0E7C61`), dan siluet kanopi organik padat. --- ## 1. Dua Standar Fisika Visual Favicon Ruko ### A. Gaya Cupertino Crystal Glass (`--style glass`) Merupakan standar visual utama pada portal modern (`skill.megapass.web.id`). Memiliki 4 elemen konstruksi fisik: 1. **Lempengan Gradien Direksional**: Kanvas `64x64` dengan `rx="18"` diisi gradien diagonal dari kiri-bawah ke kanan-atas (`x1="0%" y1="100%"` ke `x2="100%" y2="0%"`). 2. **Highlight Refraction Bevel (Efek Kaca Kristal)**: Stroke bagian dalam selebar 1.5px (`rect x="1" y="1" width="62" height="62" rx="17"`) dengan gradien putih vertikal opasitas 0.45 di bagian atas meredup ke 0 di bagian bawah. Memberikan efek bias cahaya kaca tebal tanpa membebani GPU. 3. **Geometri Vektor Lucide Scale-2**: Menggunakan koordinat baku ikon 24x24 yang ditransformasikan via `<g transform="translate(8, 8) scale(2)">`.