reopt designreopt design
DocsExploreToolsPricingBuilder
Login
Explore/
opt-ui165opt-charts33opt-datagrid6opt-editor5opt-calendar4opt-filemanager4opt-chat6opt-shell14brandapp-ui8Examples12Builder Blocks
reopt designreopt design

A design system for the AI era

  • Docs
  • Pricing
  • Releases
  • GitHub
  • Terms of Service
  • Privacy Policy

reopt Inc.Business registration no. 217-88-02453contact@reopt.ai

© 2026 reopt Inc. All rights reserved.

Explore/brandapp-ui/Reopt AI Image Studio
AI Imagebrandapp-ui example

Reopt AI Image Studio

Text-to-image studio combining brandapp-sdk image generation with opt-ui primitives.

aiimagegenerationbrandapp-sdk
opt surface add reopt-ai-image-studio
ReoptAiImageStudio
1024px

Image Studio

brandapp-sdk × opt-ui

비율
사용 크레딧
120
남은 크레딧
4,880
서울 한강 야경, 네온 감성 포스터

최근 생성

Server route (required)

Surface는 fetch(apiEndpoint)로 아래 라우트를 호출합니다.sdk.ai.generateImage는 Vercel Blob URL과 크레딧 사용량을 반환합니다.

// app/api/brandapp-image/route.ts
import { createReoptSDK } from "@reopt-ai/brandapp-sdk";

const sdk = createReoptSDK({
  clientId: process.env.BRANDAPP_CLIENT_ID!,
  clientSecret: process.env.BRANDAPP_CLIENT_SECRET!,
  brandappId: process.env.BRANDAPP_ID!,
});

export async function POST(req: Request) {
  const body = await req.json();
  const result = await sdk.ai.generateImage(body);
  return Response.json(result);
}
이 데모는 네트워크 요청 없는 seeded SVG placeholder를 사용합니다. 실제 Surface는generateImage 응답의 Vercel Blob URL을 그대로 렌더합니다.

Related Examples

brandapp-ui

BrandApp Control Center

brandapp-ui - Control

Examples
createReoptEavClientcreateReoptTermsClient
brandapp-ui

Reopt AI Chat

brandapp-ui - AI Chat

Examples
ReoptAiChat
brandapp-ui

Reopt Record Table

brandapp-ui - Data Table

Examples
ReoptRecordTable
PreviousReopt AI ChatNextReopt Record Table