Dataset Card for DesignBench

Dataset Description

• Homepage: https://webpai.github.io/DesignBench/
• Repository: https://github.com/creative-graphic-design/huggingface-datasets/tree/main/datasets/DesignBench
• Hugging Face Dataset: https://huggingface.co/datasets/creative-graphic-design/DesignBench
• Paper (arXiv): https://arxiv.org/abs/2506.06251

Dataset Summary

DesignBench is a multi-framework, multi-task benchmark for evaluating MLLM-based front-end engineering. The paper targets limitations of prior UI code generation benchmarks by covering React, Vue, Angular, and vanilla HTML/CSS, and by evaluating generation, edit, and repair workflows. The full benchmark contains 900 webpage samples spanning multiple topics, edit types, and issue categories.

Supported Tasks and Leaderboards

The dataset supports front-end code generation, design editing, and repair evaluation from visual and textual design inputs. No public leaderboard is bundled with this Hugging Face packaging.

Languages

Prompts, code, and metadata are primarily English (en).

Dataset Structure

Data Fields

Generation configs contain screenshot, html, and json. Edit and repair configs contain source/target screenshots and structured JSON metadata for the requested operation.

Data Splits

All configs expose a single test split.

Dataset Creation

The benchmark was released to evaluate front-end code generation and design transformation systems across different frameworks and task types.

Considerations for Using the Data

DesignBench is an evaluation benchmark and should not be treated as a complete proxy for production front-end quality, accessibility, or maintainability.

Additional Information

Licensing Information

The dataset license is listed as unknown in the local loader metadata.

Citation Information

@misc{xiao2025designbench,
  title={DesignBench: A Comprehensive Benchmark for MLLM-based Front-end Code Generation},
  author={Jingyu Xiao and Ming Wang and Man Ho Lam and Yuxuan Wan and Junliang Liu and Yintong Huo and Michael R. Lyu},
  year={2025},
  eprint={2506.06251},
  archivePrefix={arXiv},
  primaryClass={cs.SE},
  url={https://arxiv.org/abs/2506.06251}
}