awesome-repositories.com
博客
MCP
awesome-repositories.com

通过 AI 驱动的搜索,发现最优秀的开源仓库。

探索精选搜索开源替代品自托管软件博客网站地图
项目关于排名机制媒体报道MCP 服务器
法律隐私政策服务条款
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
·
onlook-dev avatar

onlook-dev/onlook

0
View on GitHub↗
onlook.com
↗

Onlook

Onlook is an integrated development environment designed for building user interfaces through a combination of visual manipulation and direct code synchronization. It provides a unified workspace where developers can modify application components, layouts, and styles within a graphical interface, with all changes automatically reflected in the underlying source code. By maintaining a live, bidirectional link between the rendered interface and the codebase, the platform ensures that visual edits are accurately translated into production-ready syntax.

The platform distinguishes itself through its ability to map visual elements directly to their corresponding source components, allowing for precise control over project structures. It incorporates an AI-powered assistant that interprets natural language prompts to generate and refine interface code, alongside tools for importing external design assets to maintain visual fidelity. To ensure code quality, the system performs automated formatting and static analysis, updating the abstract syntax tree to keep the codebase consistent with the visual state.

Beyond its core editing capabilities, the environment includes comprehensive project management utilities such as file navigation, live previews, and version control integration. It supports flexible deployment strategies, including containerized and cloud-native configurations, to accommodate various team and infrastructure requirements.

Features

  • Integrated Development Environments - Combines file navigation, automated testing, code quality enforcement, and version control submission into a single unified platform.
  • Visual Development Environments - Allows developers to manipulate application components and styles while automatically synchronizing those changes back into the underlying source code.
  • Visual Component Builders - Provides a library of pre-built components for rapid interface construction via a visual canvas.
  • Visual Interface Builders - Builds user interfaces by manipulating visual elements directly while automatically generating and syncing the underlying source code.

AI 搜索

探索更多 awesome 仓库

用简单的语言描述您的需求 —— AI 将根据相关性为您从数千个精选开源项目中进行排序。

Start searching with AI
26,030 星标·2,014 分支·TypeScript·Apache-2.0·15 次浏览
  • AI UI Generators - Uses natural language prompts to generate, modify, and refine interface components within a live development environment.
  • Visual-to-Code Sync Engines - Automatically updates source files when visual modifications occur to ensure codebase consistency.
  • Visual Synchronization Engines - Maintains a live link between the rendered interface and source files by mapping visual elements to code locations.
  • AI Coding Assistants - Interprets natural language prompts to create, modify, and refine user interface components within a live development workspace.
  • Codebase Synchronizers - Translates visual interface changes back into source code by mapping elements to their original locations.
  • Component Design Mappers - Links visual interface elements to source components to allow direct manipulation of properties and styles.
  • Visual Layout Editors - Allows direct manipulation of document structures and layout within a browser interface.
  • AI Coding Assistants - Visual vibecoding editor for React apps.
  • Design-to-Code Tools - Imports external design assets and maps visual specifications directly into functional, production-ready code structures.
  • Design-to-Code Workflows - Bridges the gap between design mockups and production code by importing assets and maintaining visual fidelity.
  • Visual Styling Utilities - Enables adjusting component appearance by applying utility classes through a visual editor.
  • Code Formatters - Applies predefined style rules to source files to ensure consistent syntax and project standards.
  • Project Export Environments - Provides a live environment for viewing project states and exporting designs as clean code.
  • Abstract Syntax Tree Tools - Provides programmatic source code modification by manipulating the underlying syntax tree structure.
  • Component Library Managers - Assembles and customizes pre-built interface components to construct complex layouts.
  • Design Import Tools - Supports importing design components from external software to ensure visual fidelity with original mockups.
  • Star 历史

    onlook-dev/onlook 的 Star 历史图表onlook-dev/onlook 的 Star 历史图表

    Onlook 的开源替代方案

    相似的开源项目,按与 Onlook 的功能重合度排序。
    • pythagora-io/gpt-pilotPythagora-io 的头像

      Pythagora-io/gpt-pilot

      33,743在 GitHub 上查看↗

      GPT-Pilot is an autonomous development tool designed to build, debug, and manage entire software projects. It functions as an AI-powered coding assistant that translates high-level natural language requirements into structured file architectures and functional source code. By acting as an autonomous software engineer, the system automates the software development lifecycle, from initial boilerplate creation to the implementation of complex logic. The project distinguishes itself through a recursive task decomposition process that breaks complex requirements into manageable steps, which are th

      Pythonaicodegencoding-assistant
      在 GitHub 上查看↗33,743
    • aider-ai/aiderAider-AI 的头像

      Aider-AI/aider

      46,305在 GitHub 上查看↗

      Aider is a command-line interface tool that enables large language models to directly edit, refactor, and manage source code within a local repository. It functions as an AI-powered coding assistant that integrates into the developer workflow, allowing users to apply code changes through natural language prompts while maintaining repository context and version control. The tool distinguishes itself through a specialized diff-based patching engine that parses model-generated search-and-replace blocks to modify specific file segments without rewriting entire files. It features a provider-agnost

      Pythonanthropicchatgptclaude-3
      在 GitHub 上查看↗46,305
    • concrete-utopia/utopiaconcrete-utopia 的头像

      concrete-utopia/utopia

      3,783在 GitHub 上查看↗

      Utopia is a development platform for building React components through a visual interface that synchronizes changes directly with underlying source code. It functions as an AST-based code editor and a visual component editor, using abstract syntax tree manipulation to update files while preserving the original formatting and structure. The project features an in-browser module bundler that compiles and executes JavaScript modules directly within the browser to provide immediate feedback without server-side build steps. It also includes a pull request preview tool for inspecting and validating

      TypeScriptfuturenowutopia
      在 GitHub 上查看↗3,783
    • creativetimofficial/david-aicreativetimofficial 的头像

      creativetimofficial/david-ai

      6,078在 GitHub 上查看↗

      David AI is a UI development toolkit that combines AI-powered page generation with a library of pre-built, copy-paste-ready components built on Tailwind CSS. At its core, it offers an AI builder that can generate complete landing pages and dashboards from natural language prompts, outputting clean, responsive Tailwind CSS code. The project provides a comprehensive collection of UI components—including buttons, forms, navigation elements, and data displays—that can be assembled into full page sections like hero blocks, pricing tables, and dashboards. The toolkit distinguishes itself through a

      HTMLaiai-frameworkangular-landing-page
      在 GitHub 上查看↗6,078
    查看 Onlook 的所有 30 个替代方案→

    常见问题解答

    onlook-dev/onlook 是做什么的?

    Onlook is an integrated development environment designed for building user interfaces through a combination of visual manipulation and direct code synchronization. It provides a unified workspace where developers can modify application components, layouts, and styles within a graphical interface, with all changes automatically reflected in the underlying source code. By maintaining a live, bidirectional link between the rendered interface and the codebase, the platform…

    onlook-dev/onlook 的主要功能有哪些?

    onlook-dev/onlook 的主要功能包括:Integrated Development Environments, Visual Development Environments, Visual Component Builders, Visual Interface Builders, AI UI Generators, Visual-to-Code Sync Engines, Visual Synchronization Engines, AI Coding Assistants。

    onlook-dev/onlook 有哪些开源替代品?

    onlook-dev/onlook 的开源替代品包括: pythagora-io/gpt-pilot — GPT-Pilot is an autonomous development tool designed to build, debug, and manage entire software projects. It… aider-ai/aider — Aider is a command-line interface tool that enables large language models to directly edit, refactor, and manage… creativetimofficial/david-ai — David AI is a UI development toolkit that combines AI-powered page generation with a library of pre-built,… concrete-utopia/utopia — Utopia is a development platform for building React components through a visual interface that synchronizes changes… grab/cursor-talk-to-figma-mcp — This is a Figma MCP server that exposes document manipulation capabilities to AI assistants through the Model Context… alibaba-fusion/next — This project is an enterprise design system and web interface framework that provides a React component library for…