Image-Text-to-Text
Transformers
Safetensors
qwen3_5
agent
code
frontend
web-development
reinforcement-learning
conversational
Instructions to use Roy-DOU/WebCoder-27B with libraries, inference providers, notebooks, and local apps. Follow these links to get started.
- Libraries
- Transformers
How to use Roy-DOU/WebCoder-27B with Transformers:
# Use a pipeline as a high-level helper from transformers import pipeline pipe = pipeline("image-text-to-text", model="Roy-DOU/WebCoder-27B") messages = [ { "role": "user", "content": [ {"type": "image", "url": "https://huggingface.co/datasets/huggingface/documentation-images/resolve/main/p-blog/candy.JPG"}, {"type": "text", "text": "What animal is on the candy?"} ] }, ] pipe(text=messages)# pip install -U transformers accelerate # Load model directly from transformers import AutoProcessor, AutoModelForMultimodalLM processor = AutoProcessor.from_pretrained("Roy-DOU/WebCoder-27B") model = AutoModelForMultimodalLM.from_pretrained("Roy-DOU/WebCoder-27B", device_map="auto") messages = [ { "role": "user", "content": [ {"type": "image", "url": "https://huggingface.co/datasets/huggingface/documentation-images/resolve/main/p-blog/candy.JPG"}, {"type": "text", "text": "What animal is on the candy?"} ] }, ] inputs = processor.apply_chat_template( messages, add_generation_prompt=True, tokenize=True, return_dict=True, return_tensors="pt", ).to(model.device) outputs = model.generate(**inputs, max_new_tokens=256) print(processor.decode(outputs[0][inputs["input_ids"].shape[-1]:])) - Notebooks
- Google Colab
- Kaggle
- Local Apps Settings
- vLLM
How to use Roy-DOU/WebCoder-27B with vLLM:
Install from pip and serve model
# Install vLLM from pip: pip install vllm # Start the vLLM server: vllm serve "Roy-DOU/WebCoder-27B" # Call the server using curl (OpenAI-compatible API): curl -X POST "http://localhost:8000/v1/chat/completions" \ -H "Content-Type: application/json" \ --data '{ "model": "Roy-DOU/WebCoder-27B", "messages": [ { "role": "user", "content": [ { "type": "text", "text": "Describe this image in one sentence." }, { "type": "image_url", "image_url": { "url": "https://cdn.britannica.com/61/93061-050-99147DCE/Statue-of-Liberty-Island-New-York-Bay.jpg" } } ] } ] }'Use Docker
docker model run hf.co/Roy-DOU/WebCoder-27B
- SGLang
How to use Roy-DOU/WebCoder-27B with SGLang:
Install from pip and serve model
# Install SGLang from pip: pip install sglang # Start the SGLang server: python3 -m sglang.launch_server \ --model-path "Roy-DOU/WebCoder-27B" \ --host 0.0.0.0 \ --port 30000 # Call the server using curl (OpenAI-compatible API): curl -X POST "http://localhost:30000/v1/chat/completions" \ -H "Content-Type: application/json" \ --data '{ "model": "Roy-DOU/WebCoder-27B", "messages": [ { "role": "user", "content": [ { "type": "text", "text": "Describe this image in one sentence." }, { "type": "image_url", "image_url": { "url": "https://cdn.britannica.com/61/93061-050-99147DCE/Statue-of-Liberty-Island-New-York-Bay.jpg" } } ] } ] }'Use Docker images
docker run --gpus all \ --shm-size 32g \ -p 30000:30000 \ -v ~/.cache/huggingface:/root/.cache/huggingface \ --env "HF_TOKEN=<secret>" \ --ipc=host \ lmsysorg/sglang:latest \ python3 -m sglang.launch_server \ --model-path "Roy-DOU/WebCoder-27B" \ --host 0.0.0.0 \ --port 30000 # Call the server using curl (OpenAI-compatible API): curl -X POST "http://localhost:30000/v1/chat/completions" \ -H "Content-Type: application/json" \ --data '{ "model": "Roy-DOU/WebCoder-27B", "messages": [ { "role": "user", "content": [ { "type": "text", "text": "Describe this image in one sentence." }, { "type": "image_url", "image_url": { "url": "https://cdn.britannica.com/61/93061-050-99147DCE/Statue-of-Liberty-Island-New-York-Bay.jpg" } } ] } ] }' - Docker Model Runner
How to use Roy-DOU/WebCoder-27B with Docker Model Runner:
docker model run hf.co/Roy-DOU/WebCoder-27B
Add the WebCoder-27B model card
Browse files
README.md
ADDED
|
@@ -0,0 +1,94 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
---
|
| 2 |
+
license: apache-2.0
|
| 3 |
+
library_name: transformers
|
| 4 |
+
pipeline_tag: image-text-to-text
|
| 5 |
+
base_model: Qwen/Qwen3.8-27B
|
| 6 |
+
base_model_relation: finetune
|
| 7 |
+
datasets:
|
| 8 |
+
- Roy-DOU/Webdev-Bench
|
| 9 |
+
tags:
|
| 10 |
+
- agent
|
| 11 |
+
- code
|
| 12 |
+
- frontend
|
| 13 |
+
- web-development
|
| 14 |
+
- reinforcement-learning
|
| 15 |
+
---
|
| 16 |
+
|
| 17 |
+
# WebCoder-27B
|
| 18 |
+
|
| 19 |
+
[Project page](https://douzj-llm.github.io/WebCoder/) ·
|
| 20 |
+
[Code](https://github.com/douzj-llm/WebCoder) ·
|
| 21 |
+
[Webdev-Bench](https://huggingface.co/datasets/Roy-DOU/Webdev-Bench) ·
|
| 22 |
+
[Paper](https://arxiv.org/abs/2610.23104)
|
| 23 |
+
|
| 24 |
+
WebCoder-27B is a general frontend development agent, trained from
|
| 25 |
+
[Qwen3.8-27B](https://huggingface.co/Qwen/Qwen3.8-27B) with artifact-grounded agentic
|
| 26 |
+
reinforcement learning. It is the model released with the paper
|
| 27 |
+
|
| 28 |
+
**WebCoder: Scaling General Frontend Development with Artifact-Grounded Agentic
|
| 29 |
+
Reinforcement Learning**
|
| 30 |
+
Zijun Dou\*, Zhen Yang\*, Xijun Liu, Dongzhuoran Zhou, Aohan Zeng, Jie Tang
|
| 31 |
+
*\*Core contributors.*
|
| 32 |
+
|
| 33 |
+
## Overview
|
| 34 |
+
|
| 35 |
+
Real-world frontend development requires an agent to compose reproduction, generation,
|
| 36 |
+
modification and repair over an evolving application state. WebCoder assesses all of these
|
| 37 |
+
activities through their effects on a shared executable artifact and on its satisfaction of
|
| 38 |
+
the task requirements.
|
| 39 |
+
|
| 40 |
+
- **Webdev-World** — an executable environment that integrates code editing, application
|
| 41 |
+
execution, browser inspection and on-demand skills, preserving project state across
|
| 42 |
+
interactions.
|
| 43 |
+
- **Artifact-grounded reward and credit assignment** — an independent verifier evaluates the
|
| 44 |
+
final application against the task requirements to give a terminal reward; changes in
|
| 45 |
+
intermediate artifact progress redistribute the resulting rollout advantage across
|
| 46 |
+
development segments.
|
| 47 |
+
- **Long-horizon training** — context compaction and message-tree sample construction support
|
| 48 |
+
training on trajectories beyond a single context window, without repeated loss computation
|
| 49 |
+
on shared generated history.
|
| 50 |
+
|
| 51 |
+
## Results
|
| 52 |
+
|
| 53 |
+
| Model | Vision2Web Avg | Webdev-Bench RS | Webdev-Bench Avg | Webdev-Bench DSR |
|
| 54 |
+
|---|---:|---:|---:|---:|
|
| 55 |
+
| Claude-Opus-4.8 | 62.5 | 65.1 | 73.7 | 100.0% |
|
| 56 |
+
| GPT-5.4 | 57.9 | 59.6 | 70.8 | 100.0% |
|
| 57 |
+
| Qwen3.8-27B (base) | 41.1 | 64.8 | 72.8 | 95.0% |
|
| 58 |
+
| **WebCoder-27B** | **62.4** | **72.8** | **79.8** | **100.0%** |
|
| 59 |
+
|
| 60 |
+
RS is requirement satisfaction and DSR the delivery success rate. The full table, with every
|
| 61 |
+
baseline and every sub-metric, is in the paper and on the
|
| 62 |
+
[project page](https://douzj-llm.github.io/WebCoder/#results).
|
| 63 |
+
|
| 64 |
+
## Usage
|
| 65 |
+
|
| 66 |
+
WebCoder-27B keeps the architecture (`Qwen3_5ForConditionalGeneration`), tokenizer, chat
|
| 67 |
+
template and processor configuration of its base model, so it is served the same way as
|
| 68 |
+
Qwen3.8-27B — for example with vLLM or SGLang. See the
|
| 69 |
+
[Qwen3.8-27B model card](https://huggingface.co/Qwen/Qwen3.8-27B) for serving commands and
|
| 70 |
+
API examples.
|
| 71 |
+
|
| 72 |
+
```bash
|
| 73 |
+
vllm serve Roy-DOU/WebCoder-27B --tensor-parallel-size 4
|
| 74 |
+
```
|
| 75 |
+
|
| 76 |
+
`generation_config.json` sets `temperature=1.0`, `top_p=0.95`, `top_k=20`.
|
| 77 |
+
|
| 78 |
+
The model was trained as an agent: it acts through tools in a development environment over
|
| 79 |
+
many turns, and is at its best in that setting rather than in single-turn chat.
|
| 80 |
+
|
| 81 |
+
## License
|
| 82 |
+
|
| 83 |
+
Released under the Apache License 2.0, the license of the base model. See `LICENSE`.
|
| 84 |
+
|
| 85 |
+
## Citation
|
| 86 |
+
|
| 87 |
+
```bibtex
|
| 88 |
+
@article{dou2026webcoder,
|
| 89 |
+
title = {WebCoder: Scaling General Frontend Development with Artifact-Grounded Agentic Reinforcement Learning},
|
| 90 |
+
author = {Dou, Zijun and Yang, Zhen and Liu, Xijun and Zhou, Dongzhuoran and Zeng, Aohan and Tang, Jie},
|
| 91 |
+
journal = {arXiv preprint arXiv:2610.23104},
|
| 92 |
+
year = {2026}
|
| 93 |
+
}
|
| 94 |
+
```
|