🧩 Introducing AINativeKit-UI - Instantly turn MCP JSON results into polished ChatGPT App UIs

Hi everyone! :waving_hand:

I’ve been working with the new ChatGPT Apps SDK and found that turning MCP JSON results into usable UI takes a lot of time.
So I built AINativeKit-UI, an open-source React kit that renders ChatGPT App UIs instantly.

This helps us/developers focus on logic, not layout, build ChatGPT app UIs in minutes instead of hours.


:sparkles: Key Features

  • :high_voltage: Instant JSON → UI mapping
  • :mobile_phone: Mobile-friendly layouts: auto-adapt to ChatGPT’s mobile app
  • :artist_palette: Figma-aligned design system for consistent visuals
  • :puzzle_piece: Pre-built Cards, Lists, Maps, Carousels
  • :hook: ChatGPT App SDK hooks: useWidgetState, useMaxHeight, etc.
  • :brain: TypeScript + Storybook + Open Source (MIT)

:circus_tent: Live Storybook: ainativekit.com
:puzzle_piece: GitHub Repo: GitHub - AINativeKit/chatgpt-apps-sdk-ui: React UI library for ChatGPT Apps SDK - Production-ready components, hooks, and design system


:framed_picture: GIF

Here are a few examples of AINativeKit-UI components including customisable Card variants, image Album and fullscreen viewer, Carousel supporting any content and card variants, List view, compact and fullscreen Map

ainativekit-ui-demo

:speech_balloon: Looking for Feedback

  • What kinds of components or patterns would you like next?
  • How could it integrate better with your ChatGPT App workflow?

:light_bulb: If you’re building with the ChatGPT Apps SDK, I’d love to hear your feedback or see how you use it!

Thanks for checking it out, happy to answer questions or collaborate on expanding the UI kit :purple_heart:

This topic was automatically closed after 24 hours. New replies are no longer allowed.