// ───────────────────────────────────────────────────────────── // Kelappa — final brand applications // All built on the canonical KelappaLogo (brown disc + 3 cream dots // + Hanken Grotesk "kelappa" + coral smile under "app"). // ───────────────────────────────────────────────────────────── // ── Cover ─────────────────────────────────────────────────── function FinalCover({ t }) { return (
Brand identity · final
Ubud · Denpasar
est. 2026
A small studio crafting calm, careful apps for Mac, iPhone and Apple Watch — from a warm corner of the tropics.
kelappa.studio —— Identity v1.0
); } // ── Logo system board ─────────────────────────────────────── function FinalLogoSystem({ t }) { const tiles = [ { bg: t.cream, fg: t.ink, mark: KELAPPA_BROWN, dots: t.cream, accent: t.coral, name: 'Primary', note: 'On cream' }, { bg: t.shell, fg: t.ink, mark: KELAPPA_BROWN, dots: t.cream, accent: t.coral, name: 'On shell', note: 'Surfaces' }, { bg: KELAPPA_BROWN, fg: t.cream, mark: t.cream, dots: KELAPPA_BROWN, accent: t.coral, name: 'On husk', note: 'Cards · packaging' }, { bg: t.coral, fg: t.cream, mark: t.cream, dots: t.coral, accent: t.cream, name: 'On coral', note: 'Stamp · accent' }, { bg: t.ink, fg: t.cream, mark: t.cream, dots: t.ink, accent: t.coral, name: 'Dark', note: 'Inverted' }, { bg: t.lagoon, fg: t.ink, mark: KELAPPA_BROWN, dots: t.cream, accent: t.coral, name: 'On lagoon', note: 'Editorial' }, ]; return (
01 — Logo
One mark. Six surfaces.
Husk-brown disc, three cream dots, coral smile under app. That's the system.
{tiles.map((tile) => (
{tile.name} {tile.note}
))}
); } // ── App icons — all built around the disc + dots ──────────── function FinalIcon({ size = 200, bg, mark, dots, radius, smile = false, accent }) { const r = radius ?? size * 0.225; return (
{smile && ( )}
); } function FinalAppIcons({ t }) { return (
02 — App icons
One DNA. Three shapes.
macOS squircle. iOS squircle. watchOS circle.
The disc-and-dots reads from 1024px to 16px.
{/* macOS */}
macOS · 1024
The Studio
Primary brand icon
{/* iOS */}
iOS · 1024
Color variants
Each app picks one tone
{/* watchOS */}
watchOS · circle
On the wrist
Same DNA, circular crop
); } // ── Web hero ──────────────────────────────────────────────── function FinalWebHero({ t }) { return (
{/* nav */}
AppsStudioJournalContact
Hire us
A studio of three · Bali
Calm apps for the  ones you already own .
Mac. iPhone. Apple Watch. Small, considered software shipped from a slow corner of the tropics — for people who would rather have one good tool than ten loud ones.
See our apps →
Read the journal
{/* product strip */}
{[ { bg: t.cream, mark: KELAPPA_BROWN, dots: t.cream, name: 'Coconut', meta: 'Notes · macOS' }, { bg: t.coral, mark: t.cream, dots: t.coral, name: 'Matahari', meta: 'Daylight · iOS' }, { bg: t.saffron, mark: t.cream, dots: t.saffron, name: 'Pohon', meta: 'Habits · watchOS' }, { bg: KELAPPA_BROWN, mark: t.cream, dots: KELAPPA_BROWN, name: 'Kawan', meta: 'Messaging · iOS' }, ].map((p) => (
{p.name}
{p.meta}
))}
); } // ── Business cards ────────────────────────────────────────── function FinalCardFront({ t }) { return (
App studio · Bali
); } function FinalCardBack({ t }) { return (
Nyoman Putri
Founder · Designer
nyoman@kelappa.studio
+62 361 555 0124
Jl. Raya Ubud · Bali
kelappa.studio
); } // ── Watch face ────────────────────────────────────────────── function FinalWatchFace({ t }) { return (
Thu 14 9:41
Pagi.
Sunrise 06:12
27° · sunny
); } // ── Stationery / In the wild board ───────────────────────── function FinalStationery({ t }) { return (
03 — In the wild
How the brand lives.
A coconut, a smile, a calm sans.
That is the entire system.
kelappa.studio
Cards
watchOS face
); } Object.assign(window, { FinalCover, FinalLogoSystem, FinalAppIcons, FinalWebHero, FinalCardFront, FinalCardBack, FinalWatchFace, FinalStationery, FinalIcon, });