datasets
Training and evaluation data, with the modality, task and licence stated up front. Listed live from the Hugging Face Hub.
frontendfrontend_dpo
DPO JavaScript Dataset
This repository contains a modified and expanded version of a closed-source JavaScript dataset. The dataset has been adapted to fit the DPO (Dynamic Programming Object) format, making it compatible with the LLaMA-Factory project. The dataset includes a variety of JavaScript code snippets with optimizations and best practices, generated using closed-source tools and expanded by me.
License
This dataset is licensed under the Apache 2.0 License.… See the full description on the dataset page: https://huggingface.co/datasets/israellaguan/frontend_dpo.EDUrocks-3.0-frontendfrontend-html-tailwind-js
This dataset is a remastered version of Reubencf/frontend-coding prepared using Adaption's Adaptive Data platform.
frontend_html_tailwind_js
This dataset contains pairs of user prompts and generated frontend code solutions using HTML, Tailwind CSS, and JavaScript. The samples cover a wide range of web development tasks, including landing pages, portfolios, ecommerce sites, and interactive components with smooth scrolling and animations. Each entry demonstrates practical… See the full description on the dataset page: https://huggingface.co/datasets/Reubencf/frontend-html-tailwind-js.frontend-react-dataset
Frontend React Dataset
This dataset contains 1,000 matched examples for training and evaluating
multimodal screenshot-to-code systems.
Dataset structure
The dataset has one train split and exactly three columns:
screenshot: the source webpage screenshot as an embedded PNG image
description: a detailed, section-by-section visual description generated
with Gemini 3.6 Flash
response: React/TSX implementation generated with GPT-5.6 Sol
The response field contains… See the full description on the dataset page: https://huggingface.co/datasets/Reubencf/frontend-react-dataset.FrontendCookbook
Overview
This dataset features a curated collection of questions and answers synthesized to cover key topics in Frontend development. Topics include HTML. CSS, JS, React JS, Next JS in a circullum manner.
Caution
This dataset was generated using Bard, please note that some content may not be entirely precise or reflect expert consensus.
Users are encouraged to verify information independently for scholarly or critical purposes.
frontend-coding
Frontend Coding Dataset
A small, hand-curated dataset of frontend web development prompts paired with
generated HTML / TailwindCSS / JavaScript code, plus optional chain-of-thought
reasoning. Covers landing pages, portfolios, dashboards, ecommerce, SaaS sites,
and iterative edits on existing code.
Fields
Field
Role
Meaning
prompt
model input
User's request / design brief
previous_code
model input
Existing code the user provides for refinement (may be empty)… See the full description on the dataset page: https://huggingface.co/datasets/Reubencf/frontend-coding.frontend-agent-sft
Generic RAG e-commerce tool-use SFT — v1.3.0
Synthetic supervised-fine-tuning data for a retriever-agnostic, tool-calling shopping assistant
(target model: LiquidAI/LFM2.5-230M, 230M). Every grounded answer is written from search-tool results
only (RAG-as-a-tool), and tool/argument names are procedurally randomized per example so the
model learns to read the injected schema rather than memorize a fixed toolset.
How it was generated
Compositional generation:… See the full description on the dataset page: https://huggingface.co/datasets/lazos/frontend-agent-sft.gwen-frontend-dataset
Senior Frontend Dev Frontend Coding Agent Dataset
A 5,000-example ChatML dataset for fine-tuning language models into frontend coding agents.
Dataset Description
Senior Frontend Dev is a frontend coding agent that helps developers plan, code, and debug web applications with expertise in:
⚛️ React (hooks, components, state, context)
▲ Next.js (App Router, SSR/SSG, Server Components)
📘 TypeScript (types, generics, strict config)
🎨 CSS & Tailwind (Grid, Flexbox… See the full description on the dataset page: https://huggingface.co/datasets/itryv/gwen-frontend-dataset.opus-4.6-frontend-development
CoT Code Debugging Dataset
Synthetic code debugging examples with chain-of-thought (CoT) reasoning and solutions, built with a three-stage pipeline: seed problem → evolved problem → detailed solve. Topics emphasize frontend / UI engineering (CSS, React, accessibility, layout, design systems, SSR/hydration, and related product UI issues).
Each line in dataset.jsonl is one JSON object (JSONL format).
Data fields
Field
Description
id
16-character hex id:… See the full description on the dataset page: https://huggingface.co/datasets/glyphsoftware/opus-4.6-frontend-development.gpt-5.4-frontend-development-11062026
GPT-5.4 Frontend Development Dataset (11062026)
This dataset is a synthetic chat-formatted code dataset focused on frontend development tasks in React and TypeScript.
It contains 1032 JSONL records collected on 2026-06-11 and generated with GPT-5.4 from frontend-oriented prompts covering reusable UI, compact feature units, forms, widgets, and related interface implementation tasks.
Overview
Each record contains:
task_id - numeric task identifier
category - task… See the full description on the dataset page: https://huggingface.co/datasets/runanlab/gpt-5.4-frontend-development-11062026.frontend-docsfrontend-react-dataset-no-images
Frontend React Dataset — No Images
Image-free derivative of Reubencf/frontend-react-dataset.
This version preserves all 1,000 examples while completely removing the screenshot column and its embedded image bytes.
Schema
Column
Type
Description
description
string
Description or prompt for the interface
response
string
React/TSX implementation response
from datasets import load_dataset
ds = load_dataset("Reubencf/frontend-react-dataset-no-images")… See the full description on the dataset page: https://huggingface.co/datasets/Reubencf/frontend-react-dataset-no-images.frontend-figma-to-code
CREW: Figma to Code
A benchmark for evaluating AI coding agents on Figma-to-code generation — converting real-world Figma community designs
into production-ready React + Tailwind CSS applications.
Each task gives an agent full access to a Figma file via MCP tools. The agent must extract the design system, generate
components, build successfully, and deploy a live preview. Outputs are evaluated through human preference (ELO) and
automated verifiers.
Benchmark… See the full description on the dataset page: https://huggingface.co/datasets/metaphilabs/frontend-figma-to-code.FrontendCookbook
Overview
This dataset features a curated collection of questions and answers synthesized to cover key topics in Frontend development. Topics include HTML. CSS, JS, React JS, Next JS in a circullum manner.
Caution
This dataset was generated using Bard, please note that some content may not be entirely precise or reflect expert consensus.
Users are encouraged to verify information independently for scholarly or critical purposes.
gpt-5.4-frontend-development-27052026
Site Coding Dataset
Site Coding Dataset is a synthetic chat-formatted dataset for code generation, focused on frontend development, UI implementation, and instruction-following programming tasks.
Site Coding Dataset — синтетический датасет в chat-формате для генерации кода, сфокусированный на frontend-разработке, UI-реализации и instruction-following задачах программирования.
Overview
This dataset contains 834 records in JSONL format.Each record includes:
category — task… See the full description on the dataset page: https://huggingface.co/datasets/runanlab/gpt-5.4-frontend-development-27052026.tts-frontend-datasettts-frontend-datasetSee: https://github.com/Jackiexiao/tts-frontend-dataset
frontend-instruction-tuningreact_frontendfrontend-coding-datasetEDUrocks-3.0-frontend-source-codefrontend-componentsfrontEnd-CodeTypescriptrmi-frontend
React + TypeScript + Vite
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Currently, two official plugins are available:
@vitejs/plugin-react uses Oxc
@vitejs/plugin-react-swc uses SWC
React Compiler
The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see this documentation.
Expanding the ESLint configuration
If you are developing a… See the full description on the dataset page: https://huggingface.co/datasets/rugmunchmedia/rmi-frontend.cinematrix-frontend-snippetsvelost-frontendcreative-frontend-sftfront-end-stack-id-datafront-end
