ABOUT PIXELCRAB

Beyond generated code.
Into real applications.

PixelCrab (also known as PixelCrabs, at pixelcrabs.com) is a local-first visual AI IDE and full-stack app development tool built on OpenCode. It connects AI coding, live preview, visual editing and app publishing.

For designers, developers and anyone with an idea, across Web/H5, Flutter, uni-app and mini app projects.

Try the full desktop app today. Our Web-focused open-source edition is in preparation; Flutter support will follow. Cloud services and dedicated mini app tools are part of the full product. Follow on GitHub →

Why we are building PixelCrab

PixelCrab started with a simple observation: AI is getting good at writing code, but many people still don't know what to do with that code next.

How do you run it? Which part of the page needs work? How do you preview a change and share the result? These are the steps that turn an idea into a usable application.

PixelCrab connects those steps. Describe a goal, generate code, run it, point out what needs changing, and keep developing until you can build and publish. What matters is a result you can see, use and continue improving.

Select what you want to change. Tell AI how you want it to feel.

Local first: keep your project code

Project source stays in your own working directory. Use Git, GitHub or your company's Git service. Open an existing project and let AI work with its actual code.

Local projects, previews and your own models do not require a PixelCrab account. An account is used for PixelCrab models, cloud publishing, Spaces and other platform services.

Local storage does not make every AI request offline. When you use a cloud model, the task's prompts, code, images and other required context are sent to your selected service. Teams can configure internal or local models to meet their data requirements.

AI web development, with real projects

Create a personal site, company homepage, booking flow, form, dashboard or Web app. Start with 'build a coffee shop website', or open an existing project to refine its pages, components, APIs and business logic.

Work with HTML, CSS, JavaScript, TypeScript, React, Vue, Angular, Next.js, Nuxt, Vite, Tailwind CSS, Node.js and Express. AI follows the project's stack; running it depends on its scripts, dependencies and available preview tools.

Simple HTML can be previewed directly. Framework projects prepare dependencies as needed. Preview is a starting point: real applications still need validation of interactions, data, permissions and error handling.

Flutter, uni-app and multiple platforms

App development involves more than generating screens. PixelCrab can help edit Flutter and uni-app pages, components, APIs and business logic, with supported development previews to inspect the result.

Flutter Web and uni-app H5 let you see and refine an interface early. Android, iOS and desktop builds still require their SDKs, build tools and signing setup. A Web preview cannot replace testing on the target device.

Our aim is to prepare tools when a project needs them, instead of asking everyone to install every platform's environment up front.

Mini apps and platform toolchains

WeChat, Alipay and Douyin each have different runtimes and delivery requirements. The full PixelCrab desktop app connects development, builds, previews and uploads through platform tools. Available actions depend on the installed version and environment checks.

Refine pages in an available H5 development preview, then validate with official tools and real devices. App IDs, developer accounts and permissions are platform-specific. Uploading a development version is separate from review and public release.

Baidu, DingTalk, Kuaishou, QQ and other lightweight app platforms are potential directions for independent tools and adapters. This does not mean every platform already has a complete publishing flow.

Visual AI coding starts with the interface

Instead of describing 'the third card in the second row' and guessing its component, start from the running interface. Use element selection, area selection, screenshots and natural language to express a change.

Select several cards and ask AI to unify their spacing and headings. AI uses the visual context and project source, then you check the result in preview. Selection support varies by rendering framework; screenshots and area selection provide another way to share visual context.

This AI Design & Dev workflow connects AI coding, vibe coding and visual development. The interface helps you express intent; real source code remains the foundation.

Bring design methods into a task with Skills

Designs, screenshots, prototypes and existing pages can guide Design to Code work. Skills can bring design systems, component libraries, brand rules, UI copy, accessibility checks and coding conventions into the task.

Skills give an AI agent specialized knowledge and working methods. PixelCrab supports local Skills and public Skill downloads. After installation, follow the restart prompt and invoke the actual /skill-name command.

A Skill does not guarantee visual fidelity or code quality. It gives the task clearer methods and constraints; the result still needs checking in the real project.

BYOK: your models, your choice

PixelCrab is not tied to one AI vendor. Use Pixel models or configure your own API key, service URL, enterprise model or compatible endpoint through OpenCode providers.

The ecosystem includes OpenAI, Anthropic Claude, Google Gemini, Qwen, DeepSeek, Kimi, GLM, MiniMax and Doubao. Integration depends on provider support, service APIs and account permissions. OpenAI and Codex capabilities also depend on the available authorization and interface.

Ollama, LM Studio and internal model gateways can be configured through supported interfaces. A local model's suitability for coding agents depends on its context window, tool calling and other capabilities.

Integration does not mean PixelCrab supplies these models for free, or that every subscription works with every API. Choose a service based on quality, speed, cost and data requirements.

Built on OpenCode, focused on the last mile

We don't want to reinvent the agent engine. OpenCode advances the agent's capabilities; PixelCrab focuses on preview, visual editing, platform integration and getting an application into people's hands.

PixelCrab uses open-source OpenCode for sessions, models, tool calls and code changes. Preview, visual evidence, environment preparation and delivery are connected through Tools and Adapters.

Tools, Adapters and Extensions give new preview tools, platform CLIs, design resources and services their own scope. This system is evolving; not every extension supports one-click installation or live updates yet.

Publish an app, or remix a starting point

The full desktop app can publish supported Web projects to PixelCrab after you sign in. Before publishing, check what will become public and whether the content and resources can be shared.

Where an author permits remixing, explore the app and download its public source copy, then let AI run and adapt it. Public app downloads do not require a Pixel account; generating and editing code still requires an available model.

Starting from a working app is often easier than an empty project. We want to help people move from 'AI wrote some code' to 'I made something people can open and use'.

Resources and model usage for teams

PixelCrab accounts and Spaces organize platform resources, permissions and model services. Models billed through the platform can show credits, usage and bills by Space. Your own APIs and enterprise models are billed by their respective providers.

Teams can combine local projects, internal models and their own development tools. Broader auditing, resource governance and extension management depend on deployment and available capabilities; local first is not a claim that every enterprise requirement is already met.

For people who want to make things

Designers can start with a visual reference. Product teams can turn requirements into interactive apps. Developers can use AI and previews in real projects. Beginners can start with a remix and gradually understand how it works.

Whether it is a personal homepage, booking tool, dashboard, mobile app or mini app, we want to shorten the distance between an idea and something usable.

Describe it. Let AI build. Point out what needs changing. Then put your application in people's hands.