AI React Preview

交互式编程教学平台

💻

开始编程之旅

用自然语言描述你想创建的 React 组件，或上传截图让 AI 帮你还原界面

App.js编辑代码即可实时预览

import React from 'react';

export default function App() {
  return (
    <div style={{
      minHeight: '100vh',
      display: 'flex',
      flexDirection: 'column',
      alignItems: 'center',
      justifyContent: 'center',
      background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',
      color: 'white',
      fontFamily: 'system-ui, sans-serif',
    }}>
      <h1 style={{ fontSize: '2.5rem', marginBottom: '1rem' }}>
        AI React Preview
      </h1>
      <p style={{ fontSize: '1.2rem', opacity: 0.9 }}>
        在左侧输入你的需求，AI 将为你生成 React 代码
      </p>
    </div>
  );
}