Native X
Social app · built by the Vibecode team
Native X answers "what would X feel like if Apple designed it?" as a real SwiftUI app. The Home feed has a large title, a sliding Following / For You switch and floating Liquid Glass search and compose buttons. Tap a post and it pushes in like Messages; tap a face and the profile opens as a full-bleed photo poster that fades into a colour picked from the photo: maroon for Franco, green for Marta, purple for your own Memoji. Long-press any post for Messages-style tapbacks, and Search, a New Post sheet with the keyboard up, and an Activity feed round it out.
- iPhone · Swift
- Built in 2 prompts
- Free to remix

Remix copies the working app into your account for free, exactly as we built it. It runs in Vibecode's cloud iOS simulator, in your browser.
The prompt that builds it
We built Native X in 2 prompts. Here they are folded into one, so a single paste into a new app builds the finished version.
Prompt · 2,114 words
Download/reference the app shown in this post and clone it exactly, including the iPhone visual design, layout, interactions, animations, typography, spacing, and all visible states. Make it functional and runnable in the simulator. Match the reference as closely as possible and include any interaction shown in the source. Reference: https://x.com/ty_kra_lab/status/2114286571968971257. The brief below transcribes the whole 47-second video; treat it as the source of truth.
Build a native SwiftUI iOS app named Native X using Opus 5.5. It is "What would X feel like if Apple designed it?": a social feed app that looks and moves exactly like Apple's own native apps (Messages, Music, Contacts): white backgrounds, SF Pro, large titles, floating Liquid Glass controls, full-bleed contact-poster profiles. Do NOT put a fake handset frame inside the actual app; the simulator provides that. Use realistic deterministic fixture data so every screen is rich and usable without permissions or backend.
Observed video sequence (0-47s): 0-4.4 Home (Following tab) at rest. 4.4 tap Franco's post -> Post detail pushes in from the right (standard iOS push, ~0.4 s). 8.3 tap Franco's avatar -> Franco's profile pushes in (full-bleed photo, maroon page). 11.9 back chevron -> Post. 13.3 back -> Home. 15.6 tap Marta's avatar in the Home feed -> Marta's profile pushes in (green page). 20.0 tap her post card -> Marta's Post detail. 23.4 back -> Marta's profile. 24.3 back -> Home. 25.7 tap "For You" -> the segmented thumb slides and the For You feed shows. 28.4 tap the bottom Search bar -> Search screen (quick 0.2 s crossfade, not a push). 31.3 tap the X -> Home. 32.9 tap the compose button -> New Post sheet slides up (iOS sheet, Home shrinks behind on black). 35.1 X -> sheet slides down. 36.7 tap the bell -> Activity pushes in. 39.2 back. 40.5 tap my Memoji avatar (top right) -> my profile (Chiara Valli, purple) pushes in. 43.2 back -> Home. 45.1 tap "Following" -> Following feed again.
Visual details (all screens): white #FFFFFF background, black text, secondary text #8E8E93, hairline dividers #E5E5EA inset to the text column. Status bar dark on white screens, light on profiles. Floating controls are iOS 26 Liquid Glass: use .glassEffect() / glass button styles if the SDK has them, otherwise .ultraThinMaterial circles and capsules with a 0.5 pt white stroke and a soft shadow. Every image has 16 pt continuous corners. Avatars are circles. Reaction icons: a filled red heart (#FF2D55) or an orange outlined smiley (#FF9500), then the count; comments use an outlined speech bubble + count, both in #8E8E93 text.
1. Home. Top right: a 44 pt glass circle with a bell, then my 44 pt Memoji avatar. Large title "Home" (34 pt bold) on the left below them. Under it a full-width segmented capsule (track #EFEFF0, 36 pt tall): "Following" | "For You", the selected one a white capsule thumb with a soft shadow that slides between them with a spring (matchedGeometryEffect). Feed rows: 40 pt avatar; "Name" semibold 16 + " @handle" grey + time right-aligned grey; body 17 pt; image full text-column width; reactions row; divider. Following feed, in order:
- Franco Bassi @francos_garden 12m: "Picked 30 pounds of apples this morning. Apple cake for the whole building on Sunday: stop by and grab a slice." Photo: a ripe red-gold apple on a branch among leaves (4:3). Heart 121, comments 4.
- Marta Ferri @martaferri 38m: "Finished the plates for the succulents book. This one is my favorite." Image: a bright abstract botanical illustration on white (pink, yellow, cobalt, green, red marks, cactus and coral shapes), square. Heart 76, comments 2.
- Davide Russo @davide.russo 1h: "The 90 bus at 8:10 AM is Milan's newest concert venue." Smiley 47, comments 3.
For You feed, in order:
- Kemi Adeyemi @kemiadeyemi 5h: "6:40 this morning, above Varigotti. Worth the alarm." Photo: sunrise over a rocky Ligurian cove with turquoise water. Heart 1,280, comments 31.
- Davide Russo @davide.russo 3h: "The fog on the A4 this morning was so thick I followed a truck all the way to Brescia. I was going to Bergamo." Smiley 2,024, comments 52.
- Nadia Bello @nadiabello 4h: "The lemon tart I've made for ten years, now with an olive oil crust. Lighter, and it doesn't crumble when you slice it." Photo: a lemon tart on a plate. Heart 860, comments 44.
Bottom, floating over the feed with a white fade behind: a glass capsule "Search" (magnifier left, mic right) filling the width, and a 52 pt glass circle with square.and.pencil on the right.
Taps: a post's body or image -> its Post detail; an avatar or name -> that person's profile; bell -> Activity; my avatar -> my profile; Search capsule -> Search; compose -> New Post.
2. Post detail (pushed). Top bar: a 44 pt glass circle with chevron.left; centered "Post" semibold 17; right a glass capsule holding square.and.arrow.up and ellipsis. Author row: 52 pt avatar, "Franco Bassi" semibold 18 over "@francos_garden" grey; right a grey capsule "✓ Following" (checkmark + text, semibold). Body 19 pt ("Picked 30 pounds of apples this morning." fits on one line). Image full width. "Today at 9:29 AM" grey 15. Divider. Red heart + "**121** Reactions · **6** Reposts" (numbers bold black, words grey). Divider. Replies (40 pt avatar, name semibold + @handle grey + time right): Marta Ferri @martaferri 9m "Saving two slices. I'll bring the coffee." heart 12, bubble; Davide Russo @davide.russo 8m "Franco, adopt me." smiley 31, bubble; Nadia Bello @nadiabello 5m "If there's any left on Monday I'm taking the crust." heart 5, bubble. Bottom floating: a 48 pt glass circle "+" and a glass capsule "Reply to Franco". Marta's Post: same layout, her illustration, "Today at 9:03 AM", "76 Reactions · 2 Reposts", no replies, "Reply to Marta". Tapping the author avatar/name opens the profile.
Long-press a post (feed or detail): a Messages-style tapback capsule (❤️ 👍 👎 😂 ‼️ ❓) pops above it with a spring; picking one sets that reaction, bumps the count and closes.
3. Profile (pushed), the contact-poster look and the hero of the app. A full-bleed portrait photo fills the top ~55% of the screen, under the status bar and nav, and fades at its bottom into the solid page colour, which fills the rest. Nav over the photo: a 44 pt circle of dark see-through glass (the material with a black 25% tint inside it, a 1 pt white stroke) with a pure white chevron.left; right a capsule of the same dark glass with share and ellipsis in pure white, so the glyphs stay clear on every photo. Centered over the fade: name 32 pt bold white, "@handle" white 75%, then two translucent white capsules (white 22% fill): "✓ Following" and a filled speech bubble + "Message". Bio centered white 17 pt, then "**37** Following · **860** Followers" white (numbers bold). Then the person's posts as rounded 24 pt cards in a lighter tint of the page colour, white text, same row layout as the feed with the image inside. Tapping a card opens that Post.
- Franco Bassi @francos_garden: photo of a smiling man in his 60s with grey cornrow braids and a grey beard, in a garden, warm light. Page #5F2F2F, cards #914845. Bio "Retired. I have a garden in Baggio and too many apples." 37 Following · 860 Followers. Card: the apple post.
- Marta Ferri @martaferri: photo of a smiling East Asian woman about 30, long dark hair, bright green knit sweater, indoors. Page #219423, cards #05BC0C. Bio "Illustrator. I draw plants, houses and the people who live in them. Milan, Isola." 311 Following · 2,418 Followers. Card: her illustration post.
- My profile, Chiara Valli @chiaravalli: an Apple Memoji (3D cartoon: very short close-cropped dark hair with the ears showing, a small silver nose ring, a big toothy grin, a charcoal turtleneck) on a gradient from lavender #8F7DCD at the top to #45239B; cards #6635D6. Buttons "✏ Edit Profile" (pencil) and "Share" (square.and.arrow.up) instead of Following/Message. Bio "Milan. Markets, bikes and chestnuts." 214 Following · 380 Followers. Cards: 2h "Chestnut picking at Parco del Ticino on Saturday. Who's in?" heart 24, comments 6; Yesterday "The 90 bus at 8:10 AM is Milan's newest concert venue." smiley 47, comments 3; Yesterday "The barista asked if I wanted my coffee 'Milanese style'. I still don't know what I agreed to." smiley 88, comments 9.
Other people (Davide, Nadia, Kemi) get the same profile with their own photo and a colour picked from it.
4. Search (crossfade, no push). Large title "Search". "People to Follow" bold 22 + chevron.right. A horizontal scroll of tall portrait cards (about 118x165 pt, 20 pt corners) with the name below and an outlined capsule "Follow" in indigo #5856D6 (tapping it fills it: "Following"): Amara (woman with a silver afro, pink tee), Kemi (young man with orange bead twists, orange tee, rocky cliff behind), Paolo (smiling man, dark sweater, painter's easel behind), Sara (fourth card, half visible at the edge). "Trending in Italy" bold 22, then rows (category grey 14, title semibold 18, count grey 15, dividers): Transport / Rail Strike / 12,400 posts; Weather / Fog on the A4 / 3,210 posts; Soccer / Milan Derby / 48,700 posts; Food / Olive Harvest / 1,980 posts; Art / Hokusai at Palazzo Reale / 6,050 posts. Bottom floating: a 48 pt glass circle with an xmark (returns Home with the same crossfade) and a glass capsule "People, Posts, Topics" with magnifier and mic.
5. New Post (sheet, .presentationDetents([.large]), grabber visible). Top: a glass circle with xmark (dismiss), centered "New Post" semibold, right a 44 pt indigo #645FD9 circle with a white arrow.up. Then my Memoji avatar (40 pt) and the text field, focused with the keyboard up and prefilled: "Morning walk before work. Fall is here". Below it, indented to the text, a photo attachment (trees in front of a long curved glass building under a pale sky, 3:2, 16 pt corners) with a small glass xmark circle at its top right. A keyboard accessory bar in a glass capsule: photo, camera, location (paperplane-like arrow) icons on the left, "👥 Everyone ⌄" (person.2.fill + chevron.down) on the right. Send closes the sheet and inserts the post at the top of Following.
6. Activity (pushed). Glass back circle, large title "Activity". "Today" bold 22. Rows: 44 pt avatar (two overlapping avatars for groups) with an 18 pt badge at the bottom right (heart on red, bubble on indigo, person on indigo, repost arrows on indigo, @ on indigo, smiley on orange); text 16 pt with bold names; grey preview line (one line, truncated); time right grey.
- "**Marta Ferri** and 23 others reacted" 12m, "Chestnut picking at Parco del Ticino on Saturday. Who's in?" (heart badge)
- "**Sara Conti** replied" 1h, "I'm in! I'll bring baskets and a thermos." (bubble)
- "**Paolo Greco** and **Luca Sato**" 3h, "Started following you" (person)
"Yesterday": "**Davide Russo** reposted" 9:40 PM, "The 90 bus at 8:10 AM is Milan's newest concert venue." (repost); "**Nadia Bello** mentioned you" 6:05 PM, "Ask @chiaravalli where to buy the best chestnuts in Milan" (@); "**Kemi Adeyemi** laughed" 9:12 AM, "The barista asked if I wanted my coffee 'Milanese style'..." (smiley).
Navigation: one NavigationStack with the system bar hidden and these custom glass bars, but keep the native interactive swipe-back working on every pushed screen. Pushes and pops are the standard iOS slide. Use native spring animations and gestures, not static screenshots. Feeds scroll; all state (reactions, follows, new posts) lives in memory.
Images: generate every photo with the project's proxied OPENAI_API_KEY at https://api.openai.com/v1/images/generations using model gpt-image-1.5 (not gpt-image-1, which the proxy rejects): photo-real portraits in natural light for Franco, Marta, Davide (man in his 30s, dark hair and beard), Nadia (woman with curly black hair), Kemi, Amara, Paolo, Sara Conti, Paolo Greco and Luca Sato (small avatars are fine), the Chiara Memoji (3D Apple Memoji style, head and shoulders, very short close-cropped dark hair, small silver nose ring, big toothy grin, charcoal turtleneck, plain lavender or transparent background; use it for her Home avatar, New Post avatar, profile hero and post cards), the apple, the illustration, the Varigotti cove, the lemon tart and the trees + glass building. Portraits for profiles are tall (1024x1536) so the poster crop works; store them in the asset catalog.
Build it in small source files (models + fixtures, then Home, Post, Profile, Search, New Post, Activity), and keep SwiftUI types simple and split complex view bodies. Build fully, run compile/build validation, resolve all errors, and launch in the web simulator. Prioritize fidelity to the reference and functional main interaction flow. Deliver complete implementation rather than a plan.More templates
All templates- View template

Hinge Clone
iOSHinge with its real look: like one prompt, add a comment, Send like, and the next profile slides in.
- View template

X Chat Grok Bot
iOSX's Grok Bot upsell sheet: nine blob characters pile up, pop apart and float around in zero gravity.
- View template

Tinder Clone
iOSTinder with its real look: drag a card to LIKE, Super Like or Rewind, and It's a Match! bursts into hearts.
- View template

Snapchat Clone
iOSSnapchat with no camera: Lenses track a real selfie video, the Dog's tongue drops, and a streak hits 248🔥.
