> ## Documentation Index
> Fetch the complete documentation index at: https://docs.skybridge.tech/llms.txt
> Use this file to discover all available pages before exploring further.

# All Apps

> Example apps built with Skybridge

Explore real-world examples built with Skybridge. Each app demonstrates different features and integrations. Click an app to see a full-page walkthrough.

## Examples

Open-source apps with source code available on GitHub.

<CardGroup cols={2}>
  <Card title="Generative UI" img="https://mintcdn.com/skybridge-alpic/grUqUzADywb2nWSK/images/showcase-generative-ui.png?fit=max&auto=format&n=grUqUzADywb2nWSK&q=85&s=c9a520d2a2a68a6d0e054a841e72db96" href="/showcase/generative-ui" width="798" height="470" data-path="images/showcase-generative-ui.png">
    LLM-generated dynamic UIs with json-render and 36 pre-built shadcn/ui components. The AI composes the interface, the view renders it.

    <a href="https://generative-ui.skybridge.tech/try" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="play" /> Try Demo</a>

    <br />

    <a href="https://github.com/alpic-ai/skybridge/tree/main/examples/generative-ui" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="github" iconType="brands" /> View code on GitHub</a>
  </Card>

  <Card title="Capitals Explorer" img="https://mintcdn.com/skybridge-alpic/e7Fj8WpwcOpDyXhx/images/showcase-capitals.png?fit=max&auto=format&n=e7Fj8WpwcOpDyXhx&q=85&s=a6514457098909a22d36c275fda8372c" href="/showcase/capitals" width="1274" height="778" data-path="images/showcase-capitals.png">
    Interactive world map with geolocation, country information from Wikipedia, and dynamic capital exploration.

    <a href="https://capitals.skybridge.tech/try" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="play" /> Try Demo</a>

    <br />

    <a href="https://github.com/alpic-ai/skybridge/tree/main/examples/capitals" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="github" iconType="brands" /> View code on GitHub</a>
  </Card>

  <Card title="Flight Booking" img="https://mintcdn.com/skybridge-alpic/W8UCi-DdcxLpKGkg/images/showcase-flight-booking.png?fit=max&auto=format&n=W8UCi-DdcxLpKGkg&q=85&s=a93c58890be619631800ac29216210bb" href="/showcase/flight-booking" width="804" height="287" data-path="images/showcase-flight-booking.png">
    Flight search carousel with route details, pricing comparison, and external booking via Skybridge docs.

    <a href="https://flight-booking.skybridge.tech/try" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="play" /> Try Demo</a>

    <br />

    <a href="https://github.com/alpic-ai/skybridge/tree/main/examples/flight-booking" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="github" iconType="brands" /> View code on GitHub</a>
  </Card>

  <Card title="Ecommerce Carousel" img="https://mintcdn.com/skybridge-alpic/e7Fj8WpwcOpDyXhx/images/showcase-ecommerce.png?fit=max&auto=format&n=e7Fj8WpwcOpDyXhx&q=85&s=fd2a570272772f7b3b64a96fad61ad6c" href="/showcase/ecommerce-carousel" width="1296" height="806" data-path="images/showcase-ecommerce.png">
    Product carousel with persistent cart, localization support, theme switching, and modal dialogs.

    <a href="https://ecommerce.skybridge.tech/try" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="play" /> Try Demo</a>

    <br />

    <a href="https://github.com/alpic-ai/skybridge/tree/main/examples/ecom-carousel" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="github" iconType="brands" /> View code on GitHub</a>
  </Card>

  <Card title="Everything" img="https://mintcdn.com/skybridge-alpic/e7Fj8WpwcOpDyXhx/images/showcase-example.png?fit=max&auto=format&n=e7Fj8WpwcOpDyXhx&q=85&s=2f5181c640ed70bee25dcc26f67a8086" href="/showcase/everything" width="1284" height="454" data-path="images/showcase-example.png">
    Comprehensive playground showcasing all Skybridge hooks and features. The ultimate reference implementation.

    <a href="https://everything.skybridge.tech/try" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="play" /> Try Demo</a>

    <br />

    <a href="https://github.com/alpic-ai/skybridge/tree/main/examples/everything" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="github" iconType="brands" /> View code on GitHub</a>
  </Card>

  <Card title="Investigation Game" img="https://mintcdn.com/skybridge-alpic/6Xm70x5zUUcgDPQc/images/showcase-investigation-game.png?fit=max&auto=format&n=6Xm70x5zUUcgDPQc&q=85&s=8cedce77f74d78ee393f82fe46cae268" href="/showcase/investigation-game" width="748" height="352" data-path="images/showcase-investigation-game.png">
    Interactive murder mystery game with multi-screen gameplay, fullscreen display mode, and dynamic story progression.

    <a href="https://investigation-game.skybridge.tech/try" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="play" /> Try Demo</a>

    <br />

    <a href="https://github.com/alpic-ai/skybridge/tree/main/examples/investigation-game" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="github" iconType="brands" /> View code on GitHub</a>
  </Card>

  <Card title="Productivity" img="https://mintcdn.com/skybridge-alpic/XI38pgajnb4znwkn/images/showcase-productivity.png?fit=max&auto=format&n=XI38pgajnb4znwkn&q=85&s=f3bb8429e1f2c66c499e3363d07f3167" href="/showcase/productivity" width="951" height="436" data-path="images/showcase-productivity.png">
    Data visualization dashboard demonstrating Skybridge capabilities for MCP Apps

    <a href="https://productivity.skybridge.tech/try" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="play" /> Try Demo</a>

    <br />

    <a href="https://github.com/alpic-ai/skybridge/tree/main/examples/productivity" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="github" iconType="brands" /> View code on GitHub</a>
  </Card>

  <Card title="Time's Up" img="https://mintcdn.com/skybridge-alpic/KzgU5sPyntYoNSBm/images/showcase-times-up.png?fit=max&auto=format&n=KzgU5sPyntYoNSBm&q=85&s=53c4a3569d343b5f5ac49e3c96ac1f8d" href="/showcase/times-up" width="675" height="298" data-path="images/showcase-times-up.png">
    Word-guessing party game where the user sees a secret word and gives hints to the AI, which tries to guess it.

    <a href="https://times-up.skybridge.tech/try" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="play" /> Try Demo</a>

    <br />

    <a href="https://github.com/alpic-ai/skybridge/tree/main/examples/times-up" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="github" iconType="brands" /> View code on GitHub</a>
  </Card>

  <Card title="Magic 8-Ball" img="https://mintcdn.com/skybridge-alpic/qsKsAKKpselsIl6n/images/showcase-magic-8-ball.png?fit=max&auto=format&n=qsKsAKKpselsIl6n&q=85&s=febb2ca63e8331fa332ee56d145cd9f4" href="/showcase/magic-8-ball" width="680" height="283" data-path="images/showcase-magic-8-ball.png">
    Classic fortune-telling toy — ask a yes-or-no question, shake the ball, and get a mystical answer. The default Skybridge starter app.

    <a href="https://magic-8-ball.skybridge.tech/try" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="play" /> Try Demo</a>

    <br />

    <a href="https://github.com/alpic-ai/apps-sdk-template" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="github" iconType="brands" /> View code on GitHub</a>
  </Card>

  <Card title="Auth — Clerk" img="https://mintcdn.com/skybridge-alpic/XNQz7AgxaNm79Pip/images/showcase-clerk.png?fit=max&auto=format&n=XNQz7AgxaNm79Pip&q=85&s=409ce4156cffd96e505fc354307772ff" href="/showcase/auth-clerk" width="910" height="512" data-path="images/showcase-clerk.png">
    Full OAuth authentication with Clerk and personalized coffee shop search.

    <a href="https://github.com/alpic-ai/skybridge/tree/main/examples/auth-clerk" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="github" iconType="brands" /> View code on GitHub</a>
  </Card>

  <Card title="Auth — WorkOS AuthKit" img="https://mintcdn.com/skybridge-alpic/XNQz7AgxaNm79Pip/images/showcase-workos.png?fit=max&auto=format&n=XNQz7AgxaNm79Pip&q=85&s=bbe1fe9ffdbc1a0ce8f73c900f6127ea" href="/showcase/auth-workos" width="1174" height="599" data-path="images/showcase-workos.png">
    Full OAuth authentication with WorkOS AuthKit and personalized coffee shop search.

    <a href="https://github.com/alpic-ai/skybridge/tree/main/examples/auth-workos" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="github" iconType="brands" /> View code on GitHub</a>
  </Card>

  <Card title="Auth — Stytch" img="https://mintcdn.com/skybridge-alpic/T6dbc9v1TOdB1AeY/images/showcase-stytch.png?fit=max&auto=format&n=T6dbc9v1TOdB1AeY&q=85&s=1feb0f2f291b881a8072be7a9b04bc63" href="/showcase/auth-stytch" width="600" height="400" data-path="images/showcase-stytch.png">
    Full OAuth authentication with Stytch and personalized coffee shop search.

    <a href="https://github.com/alpic-ai/skybridge/tree/main/examples/auth-stytch" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="github" iconType="brands" /> View code on GitHub</a>
  </Card>

  <Card title="Auth — Auth0" img="https://mintcdn.com/skybridge-alpic/ggyuxzNIT3RRx91h/images/showcase-auth0.png?fit=max&auto=format&n=ggyuxzNIT3RRx91h&q=85&s=683cf835ee055a4a1f6cb5686af9bb66" href="/showcase/auth-auth0" width="1920" height="1080" data-path="images/showcase-auth0.png">
    Full OAuth authentication with Auth0 and personalized coffee shop search.

    <a href="https://github.com/alpic-ai/skybridge/tree/main/examples/auth-auth0" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="github" iconType="brands" /> View code on GitHub</a>
  </Card>
</CardGroup>

## 3rd Party Apps

Apps built by customers and the community using Skybridge.

<CardGroup cols={2}>
  <Card title="Awaze — Cottage Search" img="https://mintcdn.com/skybridge-alpic/W8UCi-DdcxLpKGkg/images/showcase-awaze.png?fit=max&auto=format&n=W8UCi-DdcxLpKGkg&q=85&s=ffb4678c207dc70649887f46a3553fbd" href="/showcase/awaze" width="1394" height="1176" data-path="images/showcase-awaze.png">
    Holiday cottage search and booking experience — browse properties, filter by location, and explore availability.

    <a href="https://mcp.cottages.com/try" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="play" /> Try Demo</a>
  </Card>

  <Card title="Evaneos — Travel Destinations" img="https://mintcdn.com/skybridge-alpic/T68QsJ5nHclJp4TK/images/showcase-evaneos.png?fit=max&auto=format&n=T68QsJ5nHclJp4TK&q=85&s=c26b07ad0993f0c9f27377539a9ee0e4" href="/showcase/evaneos" width="807" height="672" data-path="images/showcase-evaneos.png">
    Personalized destination discovery with tailored itinerary ideas, travel period guidance, and sustainable alternatives curated by Evaneos experts.

    <a href="https://chatgpt.com/apps/evaneos/asdk_app_69612510d5288191b6a4174252337e93" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="robot" /> Try on ChatGPT</a>
  </Card>

  <Card title="Lumo — Interactive AI Tutor" img="https://mintcdn.com/skybridge-alpic/W8UCi-DdcxLpKGkg/images/showcase-lumo.png?fit=max&auto=format&n=W8UCi-DdcxLpKGkg&q=85&s=a0b45ff5d7ec79b1ad27f97fd81d427c" href="/showcase/lumo" width="1600" height="970" data-path="images/showcase-lumo.png">
    Adaptive educational tutor with Mermaid.js diagrams, mind maps, quizzes, and fill-in-the-blank exercises. Built at the Claude Code London Hack Night.

    <a href="https://lumo-mcp-app-39519fdd.alpic.live/try" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="play" /> Try Demo</a>

    <br />

    <a href="https://github.com/connorads/lumo-mcp-app" target="_blank" onClick={(e) => e.stopPropagation()}><Icon icon="github" iconType="brands" /> View code on GitHub</a>
  </Card>
</CardGroup>
