What is Gojek Superapp?
Gojek turned the chaos of Jakarta's streets into a single green tile grid — and in doing so invented the visual language of Southeast Asian superapp design.
Gojek Superapp in brief
Gojek Superapp design is the visual and interaction system developed by and for Gojek, Indonesia's dominant multi-service platform. At its core, the style organizes dozens of heterogeneous services — rides, food delivery, payments, logistics, healthcare bookings — behind a single, scannable interface built from colored tile grids, flat iconography, and a palette anchored by a vivid, saturated green. The system's central promise is that complexity can be made navigable without being made smaller: all the services remain present, but the grid imposes a calm, rhythmic order on what would otherwise be overwhelming.
The visual identity draws from two intertwined sources: the practical demands of serving an enormous, mobile-first user base across diverse Android and iOS devices, and the specific cultural and linguistic context of Indonesia. The typeface chosen for the 2019 brand refresh — Plus Jakarta Sans — was purpose-built for Bahasa Indonesia, accommodating the language's diacritical range and vertical rhythm while remaining highly legible at the small scales required by densely packed mobile interfaces. This localization runs deeper than font choice: the tile grid itself reflects the visual culture of Indonesian street markets and wayfinding signage, where dense grids of colored panels are a familiar organizing device.
What distinguishes Gojek's design system from generic material-influenced flat design is its specific balance between density and calm. The interface is information-rich — it must be, given the breadth of services — but the consistent tile sizing, the restrained secondary palette, and the disciplined use of the Gojek green as a primary anchor prevent the density from tipping into visual noise. The result reads less like a cluttered marketplace and more like a well-organized transit map: a system where finding anything is fast because everything is in its place.
Where does Gojek Superapp come from?
Gojek was founded in Jakarta in 2010 by Nadiem Makarim and Kevin Aluwi as a motorcycle-taxi dispatch service operating through a telephone call center. In its earliest form there was no app, no visual system — just a phone number connecting passengers to the vast informal fleet of ojek (motorcycle taxi) drivers already woven into the fabric of Jakarta's traffic. The informality was the point: Gojek was formalizing something that already existed, giving it a name, a number, and eventually a color.
The move to a smartphone application in 2015 forced the creation of a scalable visual identity for the first time. Early versions of the app were functional but visually unremarkable — green was established as the brand color from the outset, linked to the green helmets and jackets that uniformed Gojek drivers, but the interface borrowed heavily from generic flat-design conventions of the period. As the platform expanded — adding GoPay (its digital payment system), GoFood, GoSend, and eventually more than twenty service verticals — the early visual system began to strain. A brand architecture designed for a ride-hailing app could not gracefully accommodate a superapp.
The decisive moment came in 2019, when Gojek commissioned the London-based brand consultancy Wolff Olins to lead a comprehensive brand and identity refresh, internally called 'Solv.' The brief was to create a visual system that could hold dozens of services in coherent relationship without privileging any single one, while also communicating Gojek's ambition to operate beyond Indonesia into broader Southeast Asia. Wolff Olins worked with Indonesian type designer Gumpita Rahayu to develop Plus Jakarta Sans — the custom typeface that became the typographic backbone of the new identity. The typeface's name deliberately honored Jakarta, grounding the international brand in its local origin.
The Solv refresh also resolved the tension between the helmet silhouette — Gojek's most recognizable brand mark, evoking the ojek driver who remains the company's founding image — and the demands of a multi-service digital platform that had long outgrown its motorcycle-taxi origins. The solution was to retain the silhouette as an anchor while building around it a flexible tile system that could accommodate any service category through consistent iconographic logic. By 2020, the refreshed system was fully deployed across the app, marketing materials, and physical touchpoints such as driver uniforms and delivery packaging. The visual language that resulted is now the de facto reference point for superapp design across the region.
What defines the Gojek Superapp look?
Gojek Green as Structural Anchor
The brand green — vivid, warm-leaning, and distinctly saturated — functions not merely as a color but as the primary organizing signal of the entire interface. It appears on the navigation bar, key call-to-action buttons, active states, and the app icon, creating a consistent thread that runs through every screen. The green is never used decoratively; it marks decision points and primary actions. Secondary colors within service tiles are allowed more variety — warm oranges for food, cooler blues for logistics — but all defer to the green hierarchy. The overall effect is that of a transit system with clear line colors: the green is always the main line.
Tile Grid Navigation
The signature structural element of Gojek's interface is the tile grid: a regular array of equally sized, rounded-corner squares, each containing a flat icon and a short label, through which users access the full breadth of services. The tile system solves the superapp's central design problem — how to surface dozens of services without overwhelming the user — by using size consistency and visual rhythm to create a browseable map rather than a long scrollable list. Tiles are grouped by category into logical clusters but maintain identical proportions, so scanning the grid feels like reading a well-indexed reference rather than searching through unorganized inventory.
Flat Iconography with Cultural Specificity
The icon system is fully flat — no gradients, no simulated depth, no illustrative detail beyond what is necessary for recognition. Each service icon is reduced to its most immediately legible silhouette: a motorcycle helmet, a bag of food, a wallet, a box. But the iconography carries cultural specificity that differentiates it from generic platform design: the food icons reference Indonesian street food conventions, the transportation icons reflect the ojek motorcycle rather than the generic taxi car, and the overall register is warm and approachable rather than clinical. The icons are designed to work at very small sizes without losing identity, a necessity in the densely packed tile grid.
Plus Jakarta Sans Typography
Plus Jakarta Sans, the custom typeface developed for Gojek's 2019 refresh, is the typographic voice of the entire system. It is a humanist sans-serif — meaning its letterforms retain subtle human-drawn qualities rather than being purely geometric — making it legible and approachable at body text sizes while remaining authoritative at display scale. Designed specifically to accommodate Bahasa Indonesia's linguistic requirements, it handles diacriticals and the language's longer compound words with composure. In the interface, type is used at high contrast between labels and backgrounds, with size and weight doing the work of hierarchy rather than decorative styling. The typeface is not varied — one family, controlled weights — which gives the system its typographic consistency.
Restrained Depth and Elevation
Gojek's interface uses soft elevation cues rather than the hard-shadow aesthetic of older flat-design revivals. Cards and modal sheets lift very slightly from the background — enough to signal interactivity and layer separation, but never so dramatically that the interface begins to feel three-dimensional. This restraint is functional: on diverse mobile hardware and variable ambient light conditions, subtle elevation reads better than extreme depth contrasts. The approach means the system belongs to the tradition of material-influenced flat design — depth is acknowledged but never performed.
Warm, Approachable Micro-Interactions
Motion in the Gojek interface is purposeful and warm rather than spectacular. Loading states, confirmation animations, and state transitions use simple, quick motions that feel responsive without being distracting — a brief scale-up on tile tap, a smooth fade for content loading, a gentle bounce on order confirmation. The emotional register of these interactions is friendly and reassuring: appropriate for an app whose most frequent use case is a transaction involving trust — a stranger delivering your food, a driver carrying you through the city. The micro-interaction language avoids the mechanical coldness that can accompany highly geometric visual systems.
Helmet Silhouette as Brand Anchor
Gojek's most durable visual symbol is the ojek helmet silhouette — a simple, rounded form derived from the motorcycle helmet worn by the platform's founding driver-partners. The silhouette functions as a brand compact: it acknowledges the gig-economy workers whose labor underpins the platform, while simultaneously serving as a bold, scalable logomark. In the Wolff Olins refresh, the silhouette was retained and refined into a more geometrically resolved form that works cleanly across every scale — from app icon to billboard. Its presence across the system is a reminder that under the sophistication of the superapp interface, the brand's identity remains grounded in the street.
Who shaped Gojek Superapp?
Makarim co-founded Gojek in 2010 in Jakarta, beginning with a motorcycle-taxi dispatch call center before transforming the company into Southeast Asia's most expansive superapp platform. His vision of aggregating Indonesia's fragmented informal service economy behind a single digital interface shaped the fundamental design problem that the Gojek visual system was built to solve: how to make radical complexity navigable for a mass, mobile-first audience. He served as CEO until 2019, when he was appointed Indonesia's Minister of Education — a departure that marked the end of the founding chapter and coincided with the brand's Wolff Olins refresh.
Aluwi co-founded Gojek alongside Makarim and led the company as co-CEO through its most consequential growth phase — the transition from a ride-hailing service to a multi-vertical superapp. His operational leadership during the scaling of GoPay, Gojek's digital payments system, was central to establishing the financial infrastructure that makes the superapp model work: when payment is embedded in the platform, every service category becomes more coherent. The GoPay visual integration within the Gojek tile system reflects this architectural decision, giving financial services the same visual weight as transportation or food.
The London-based brand consultancy Wolff Olins led the 2019 identity refresh — internally named 'Solv' — that transformed Gojek from a ride-hailing brand into a visual system capable of supporting a superapp. Their work resolved the central tension of the brief: how to create a brand architecture flexible enough to hold more than twenty service categories while still feeling like a single, coherent product. The tile grid, the refinement of the helmet silhouette, and the commissioning of Plus Jakarta Sans were all outcomes of this engagement. Wolff Olins had previously led transformative brand work for companies including Google, Uber, and the London 2012 Olympics; the Gojek project stands among their most contextually specific, given its deliberate grounding in Indonesian visual culture.
Indonesian type designer Gumpita Rahayu collaborated with Wolff Olins to develop Plus Jakarta Sans, the custom typeface that became the typographic foundation of Gojek's refreshed identity. The design brief required a sans-serif that could serve Bahasa Indonesia's specific linguistic needs — accommodating its diacritical range and the visual rhythm of its longer compound words — while remaining highly legible at the small sizes required by mobile interfaces and retaining a warmth and approachability appropriate for a consumer platform. Rahayu's contribution represents the project's most deliberate act of local grounding: an Indonesian typeface, named for Jakarta, at the heart of an internationally ambitious brand.
The Gojek visual system did not emerge in isolation — it was shaped by and contributed to the broader Southeast Asian superapp paradigm that also produced Grab (Singapore/Malaysia), Sea Group's Shopee, and others. This regional design context differs from Western app design in key ways: mobile-first as a baseline assumption, extremely diverse device ecosystems including many budget Android handsets, very high information density expected by users accustomed to dense markets and signage, and the coexistence of multiple languages and scripts within single markets. Gojek's tile grid and clear iconographic logic represent the region's best-known solution to this specific design environment, and the system's influence can be traced in subsequent superapp design efforts across Vietnam, the Philippines, and Thailand.
How do you use Gojek Superapp today?
Gojek Superapp style translates well into a range of contemporary design contexts because its core logic — dense information organized by a consistent grid and a strong single-color anchor — is structurally sound and broadly applicable. Applying it correctly requires understanding the system as an information architecture decision first and an aesthetic decision second: the style emerges from organizing real complexity, and applying it to artificially sparse content produces work that feels borrowed rather than purposeful.
For presentation slides, the style works strongest on covers and service-overview pages. A cover built in this language uses a bold field of Gojek green or a deep contrasting tone as background, the headline in high-weight Plus Jakarta Sans or a humanist sans equivalent, and a grid of simple flat icons previewing the content ahead. Service or feature overview slides should use the tile grid directly: equal-sized cards, each with an icon and a label, grouped into logical rows. Data slides translate naturally into the system's visual logic — charts and diagrams are treated as tile-like modules, with a green accent marking the primary data series and warm or cool secondaries marking supporting series.
For web interfaces, the Gojek system is best suited to dashboards, product landing pages, and multi-service directories where breadth of information is a feature rather than a problem. The approach: establish a warm off-white or light neutral background, define a strong grid (twelve columns on wide screens, four on mobile), use the brand green exclusively for primary interactive elements such as buttons and active navigation states, and deploy category colors for service or data groupings. Cards should have slightly rounded corners and subtle elevation — enough to read as distinct units on the background, never so pronounced as to feel dimensional. Navigation should be flat and typographic; avoid icon-only navigation in contexts where service labels add clarity.
For editorial and marketing material — including social cards, event banners, and campaign pages — Gojek style supports bold, information-forward compositions. A marketing page in this language uses full-width alternating sections: Gojek green backgrounds for feature callouts, light backgrounds for supporting copy. Service grids can be adapted as feature matrices, with each cell highlighting a product capability. The tile logic also adapts well to pricing pages: each plan becomes a tile with consistent structure, differentiated by a secondary color accent rather than divergent layouts. The overall tone should feel kinetic and confident — evoking the sense of a city system that is moving and working — rather than quiet or contemplative.
A common mistake when applying this style is mistaking visual density for visual richness. The Gojek tile grid works because everything within it is consistent — same size, same corner radius, same icon style, same label treatment. Introducing variety within the grid (different tile sizes, mixed icon styles, inconsistent type scales) breaks the system's fundamental rhythm and produces visual noise rather than organized complexity. Similarly, overextending the green: the brand color functions as an anchor because it is used selectively. When green appears on every element, it loses its structural role and the interface flattens into undifferentiated brightness. Restraint in the primary color is what makes density readable.
Gojek Superapp — FAQ
Is Gojek style the same as Material Design?
They share a common ancestor — both are flat-design systems that use elevation, color, and typography for hierarchy rather than skeuomorphic simulation — but Gojek style is a culturally specific evolution rather than a Material Design implementation. Material Design is a generic system designed for maximum adaptability across product types and geographies. Gojek's system is purpose-built for a specific use case: a superapp serving Indonesian and Southeast Asian users on predominantly mobile hardware. The tile grid, the helmet silhouette, the humanist typeface tuned for Bahasa Indonesia, and the warm register of the micro-interactions all distinguish it from a Material Design application. When applying Gojek style, drawing directly from Material Design components will produce something too generic; the specific warmth and cultural grounding must be introduced deliberately.
Can this style work for products outside Southeast Asia?
Yes, with appropriate adaptation. The core structural principles — single dominant color as system anchor, tile grid for service navigation, flat iconography with strong silhouettes, humanist typeface at controlled weights — are not geographically specific and transfer well to any multi-service or multi-category product. What does not automatically transfer is the cultural warmth: the specific green, the helmet icon, and Plus Jakarta Sans are identity elements rather than transferable design tokens. A product applying this style outside its original context should replace these culturally specific elements with equivalents that carry equivalent weight in the target context, while maintaining the underlying grid logic and color hierarchy. Applied without this substitution, the style risks feeling like a Gojek imitation rather than a considered design system.
How does Gojek handle dark mode?
Gojek's system is primarily designed for light backgrounds — the warm off-white or pure white ground is structural to how the tile grid reads, and the green is calibrated for light-mode contrast. A dark-mode inversion is technically possible but requires care. On a dark background, the saturated green must be desaturated or shifted in value to avoid becoming too dominant; the warm neutrals that give the light mode its approachable quality need dark equivalents that retain warmth rather than going cold grey. The tile grid in dark mode tends to work best when tiles carry a slightly elevated dark surface rather than being recessed — the distinction between tile background and page background must remain clear for the navigational logic to hold. In practice, dark mode for this style rewards restraint: fewer tiles, wider spacing, and a single well-placed green accent rather than green distributed across all interactive elements.
What kinds of products is this style unsuited for?
Gojek style works best for products where comprehensiveness, speed of navigation, and systemic clarity are the primary user values. It struggles in contexts that require intimacy, editorial richness, or emotional resonance. A luxury goods platform, a mental health application, a premium editorial publication, or a children's learning product — all of these demand visual languages that prioritize sensory warmth, organic texture, or personal specificity over the organized efficiency that the tile grid communicates. The style also sits awkwardly in contexts where the brand identity is built on exclusivity or scarcity: the tile grid implies abundance and open access, which works for a superapp but contradicts the visual logic of a premium or highly curated product. Knowing the difference between where systemic clarity is a value and where it reads as impersonal efficiency is the key judgment when deciding whether to apply this style.
How should the tile grid be adapted when there are only a few services or categories?
The tile grid derives its visual logic from density: the rhythm and order it creates depend on having enough tiles to fill the grid meaningfully. With very few categories — say, three or four — a full tile grid reads as sparse and arbitrary rather than organized. In this case, the tile logic should be adapted rather than directly applied: use the same sizing and corner-radius principles, but arrange tiles in a single row or as a small featured cluster rather than a full grid. Alternatively, expand each tile to become a larger card component that contains more information, preserving the grid's organizing logic while filling the available space purposefully. The underlying principle — consistent sizing, clear iconography, a dominant green accent on the most important action — remains, but the grid density is adjusted to match the actual content depth.
Related design styles
Paytm Indian FintechTrust at street scale. Saturated blue, Hind numerals, and QR grids make payme…
Adobe Creative CloudUnified, not uniform. Red anchor, white space, and saturated app tiles organi…
Astro Islands Architecture 2022Warm cosmic devtools. Deep violet, magenta glow, Inter clarity, and island ge…
Brave Browser Lion OrangePrivacy gets loud. Lion-orange counters and shield geometry cut through warm…
Bun JS Runtime Pink 2023Dev speed gets bakery-bright. Hot pink grounds white slabs, mono bars, and wa…
Databricks LakehouseWarm enterprise confidence. Flame red-orange gradients meet DM Sans and clean…