NUSX dev hub

Shared atom showcase — all src/primitives renderers, including text, CTA, media, logo, stat, label, and dev badge states

Reusable data-driven Table (Figma 6720:11354) — dark header, accent column, muted cells, footnotes; light-gray / light / dark themes (placeholder data)

Preclusions table (Figma 6720:11438) — universal Table with 3 columns (3rd muted), 2-column intro, no accent column; light / light-gray / dark themes (placeholder data)

Real Figma global navigation — dark top bar, dropdown chevrons, search, MyCorner grid CTA, secondary strip

NOC Application hero (Figma 6720-13052) — top half-page image, tag-L / heading+lead / CTA-R band

Dark two-tone eligibility lists (Figma 6720-13112) — "for you" ticks / "not for you" crosses

Tabbed numbered spec table (Figma 6720-13170) — dashed rows, location pills, footnote legend

Numbered steps with index-driven wireframe illustrations + note card (Figma 6720-13369)

Heading + CTA left, numbered "Step 0N" cards right (Figma 6720-13504)

9 layout variants: text-only, split-right, full-bleed, photo-top, photo-above-text, stacked, photo-left-sidebar

Real (non-wireframe) detail hero — theme × layout × image-count matrix (issue #2)

Full-bleed hero with overlaid title + dual CTAs — image, video or a dot scene background; diagonal + staircase layouts (issue #7, Figma 10887:58572)

Full-bleed image hero with centered tag/title/subtitle, no CTAs, per-word emphasis — Figma 4067:192 (issue #7)

Startups full-viewport hero (Figma 6720:10460) — bottom-left muted/solid title + intro, optional outline CTA right, optional gradient; Summer variant (Figma 6720:19176) adds accent tag + radial-masked media + stats row

GRIP full-viewport hero (Figma 6720:19526) — ellipse-masked art on black, three-line acrostic title (first letter of every word solid, tails at 50%), centred intro + white CTA

Start-Up Stories hero (Figma 6720:16059) — flush-left eyebrow, Title XL indented to col-4, muted blurb, light-gray + grain

Home hero scene (Figma 8531:27803) — sticky dot-morph canvas + word-pair headline + intro/CTAs + optional A5X event banner scrolling over it

Home mission — dimmed-lead statement + IndexedRows, section glow

Home “Three Ones” — three sticky-stacked outcome cards with watermark figures

Home strategic tracks — copy beside a dot-model panel that morphs per track

Home “Find your path” — three-audience accordion with links and photo trios

Featured Stories carousel (Figma 6720:16067) — dark PhotoParagraphs slider: photo + meta + headline + Read full story CTA + prev/next

Filtered startup-stories grid (Figma 6720:16087) — StoryCard grid + Sector/Stage/Region/Programme dropdowns + search + sort + load more

Full page composition — hero + featured carousel + filtered stories grid stacked in Figma order (6720:15982)

Harness for lessons_eyebrow + lessons_heading_muted — type values into the form to see what an editor will get once the CPT deploys, including whether the dimmed phrase actually matched

Third-party iframe on the page container — the BLOCK71 Luma calendar, with and without a section header (#497)

The four NOC marks named per row, beside the automatic wireframe cycle every other featured list keeps

Content Hub page stack — hero, startup story cards, BLOCK71 cards, video cards, press release rows, Sparks, and subscribe banner

Light editorial hero — tag rail + title + subtitle + dotted divider + 3-up key numbers; optional yellow splash (issue #3)

Numbers band under a hero — tag rail + title + subtitle + dashed divider + N-up stats; modern sibling of KeyNumbersHero (Summer Programme)

Editorial text blocks — Split (NoTitle/Title, 4 themes) + Wide (BigParagraph, 2 themes), accent-highlight phrases (issue #6)

Single-card carousel with infinite wrap — portrait + quote + author + prev/next controls; 3 themes (issue #16)

Data & info module — editable tag/title + up to 10 text or select rows, light/dark themes (issue #17)

Impact section (tag + headline + 3 stats + CTA) + compact accent stripe (1–5 stats) — 4 themes each (issues #4 + #5)

Typed BLOCK71 landing/detail hero contract rendered through a TODO placeholder until final Figma UI.

Real Figma Gallery 2 / Dark — editorial image collage with optional side content and scroll fade-in reveals

Flat photo marquee — bottom-aligned strip drifts slowly; drag / swipe / horizontal wheel (smooothy) (Figma Gallery 3 / Dark)

Pinned 3D scroll-driven photo strip — cards pivot around their own axis (GSAP + Lenis + CSS3D) (issue #26)

Scroll-pinned programme stack — one card expands at a time (photo + meta + LEARN MORE), others collapse to faded slivers; GSAP + Lenis (issue #25)

4 variants: bare 3-up, with-intro 3-up, 5-up dark, 4-up bare

Two-column image + content (A5X-style)

Asymmetric 1+2 and symmetric 3-up variants

Structured two-column feature list — auto-numbered rows, dotted dividers, 3 themes (issue #35)

Standalone numbered rows — theme + layout + per-row font-size props; the reusable core of Features

3-col simple and 2-col rich variants

Real Figma cards_audience — 3-up filled NoteCards with decorative graphics and light/dark themes

Real Figma FAQ — numbered Q&A rows with click-to-expand, single-open, 3 themes (issue #28)

Real Figma Contact CTA — dark band, halftone-sphere illustration, accent CTA (issue #27)

Contact CTA right column — dot-playground arches on the TSL dot renderer (Figma 9292:20262)

Contact CTA right column — dot cube with a shadowing dot sphere on the TSL dot renderer (Matteron 166:2366)

Contact CTA right column — dot sphere in a tilted dot ring on the TSL dot renderer (Matteron 166:2417)

Contact CTA right column — nested dot rings spiralling into a glowing core on the TSL dot renderer (Matteron 166:2422)

Contact CTA right column — one dot cylinder cut in two across a gap on the TSL dot renderer (Matteron 166:2633)

Contact CTA right column — two dot cubes, one edge-on and one seen from above, bobbing on the TSL dot renderer (Matteron 166:2499); overlay page /dev/scene-cta-cubes

Contact CTA right column — three coaxial dot cylinders sliding out of each other on the TSL dot renderer (Matteron 166:2518)

Contact CTA right column — a dot tube, a dot cube and a dot sphere drifting in one frame on the TSL dot renderer (Matteron 166:2594)

Recording view — the dot planet alone, full viewport and centred, no chrome or cursor

Recording view — the Self Assembly field with the cubes centred, no chrome or cursor; Space flies them corner ↔ centre

Centred signup with email form

Real Figma footer — Dark, tagline + accent CTA, 2×2 [BRACKETED] link grid, NUSX wordmark + socials/contact strip (issue #29)

Real Figma Step Cards — 3-up location-detail benefits cards with dark, gray, and light-gray themes

Real Figma locations grid — 16-card image grid, separate LocationGridCard/LocationFeaturedCard components, and dropdown filter header (issue #41)

Real Figma "Locations list / Light" (6720:11512) — inline locations list reusing LocationGrid data/filters, with hover-revealed tags + photo (generic imageReveal module)

Real Figma "Paragraphs / Dark" (6720-20119) — accent eyebrow + wide 28px two-tone lead (bold run solid, rest muted) + wide image below; dark default

Canonical photo + paragraphs module — single partner-university variant plus stacked light-gray TODO workflow variant

Real Figma ImageBreak — full-bleed media with optional video and 1–3 white captions

Chronological year+event list — NOC history

State-driven application block — open / closed / pre-cycle

Decorative brand moment — Whallycorn

Community/mentor signup form with role dropdown

SVG world map with 16 hover pins — display-only

Compact filter row — Format / Intake / Region / Audience dropdowns

Sub-page preview panel — heading + 3-up tiles + full-page link (tti-overview)

Funding programme 2×2 card grid with Strategic Track pills (tti-overview)

4-up TTO directory by Strategic Track + MVP Studio callout (tti-overview)

3×2 numbered anchor-link question cards (tti-research)

Legacy ad-hoc disclosure table; curriculum faculty notes use CurriculumChecklist

Two-col topic list + swappable content panel — inline JS swap (tti-research)

MTA + NDA side-by-side agreement cards with metadata rows (tti-research)

Filterable tech listing — search + track tabs + 2×2 opportunity cards (tti-for-industry)

Track-filtered vertical case study cards — photo + structured fields (tti-for-industry)

4-question chip-select eligibility screener with inline result panel (tti-programmes)

3-up research project proof cards — programme tag + year + faculty (tti-programmes)

Long-form prose — prose, faculty, callout, cross-link variants (noc-curriculum)

Real Figma curriculum structure — SpecTable durations + authored part graphics + roadmap file

Structured HTML table — data, comparison, schedule, key-value variants

Clickable location rows + JS side-drawer (noc-curriculum block 08)

4-up date-chip grid with programme label (noc-application)

Legacy pass/fail list; curriculum faculty notes use CurriculumChecklist

Real Figma Documents / Light gray section — grid-aligned card list for location detail

Legacy upload checklist; curriculum faculty notes use CurriculumChecklist

Real Figma Curriculum faculty-notes checklist — light-gray labeled groups

Horizontal step-by-step application timeline (noc-application)

Policy/legal prose list (noc-application)

Programme-selection CTA band — generic + location variants (noc-application, location-detail)

Paper Location CTA — map-backed application CTA for NOC location detail pages

Light awards hero — full-bleed image + eyebrow-L + Title XL + intro on the right (Figma 6720:11652)

Awards list — CSS sticky-stacking award cards, pinned audience badge (Figma 6720:11664)

Per-category award cards — 2-col detail + amount badge + tags + how-to-apply (noc-awards)

Dark schedule rows with cursor-follow hover-reveal photos (Figma 6720:12229, noc-n-house)

3×2 physical-space photo-card grid (noc-n-house)

Real reusable People-section profile card — 380×640 card with portrait, meta, quote, and tags (issue #32)

Real People / Alumni grid wrapper — row 3/4-up and responsive load-more directory variants (issue #34)

Real Figma Logos / Light Gray — staggered display-only logo boxes using reusable LogoBox primitive

Dual-column role spec — Responsibilities L / Terms of engagement R (noc-n-house-mentor)

MVP Studio "Recent work" (Figma 6720:19832) — accent tag + two-tone Title-M, 2-up photo project cards with an underlined link

Side-drawer content for block_location_list — NOT a public route, dev review only