cascading style sheets

Current code editors suffer from limited rendering capabilities: they rely on monolithic fonts and static syntax highlighting, lacking semantic-aware, fine-grained text decoration. To address this, we propose *Code Stylesheets*—the first adaptation of the CSS paradigm to programming languages—enabling semantic-driven code rendering grounded in abstract syntax trees (ASTs), type information, and runtime values. Our system supports declarative style rules defined over algebraic data types, yielding syntax-structure-sensitive and context-adaptive dynamic code visualization. We implement a prototype for a Haskell subset, integrating AST traversal, semantic style matching, and type-directed decoration synthesis. Evaluation demonstrates effectiveness across diverse code presentation scenarios and programming pedagogy visualizations, significantly improving code readability and semantic communication efficiency.

This work addresses the automatic text box placement problem in incomplete layouts for advertising and web design, aiming to jointly optimize visual appeal and information delivery efficiency. We propose and systematically evaluate four approaches: a standard Transformer, a lightweight vision-language model (Phi-3.5-vision), a large multimodal model (Gemini), and an extended Transformer supporting multi-image input. Experiments on the Crello dataset demonstrate that the task-specific Transformer achieves the best overall performance—particularly excelling in modeling complex visual appearances—and significantly outperforms vision-language model baselines. Our findings highlight the critical role of explicit appearance modeling in layout generation. This study establishes a new, interpretable, and highly adaptable paradigm for automated typographic layout design. Furthermore, it identifies key limitations of current methods in scenarios involving small-scale text and high-density layouts.

This study addresses the challenge of diagnosing responsive layout failures (RLFs), which often stem from specific CSS properties behaving inconsistently across screen sizes and are difficult to pinpoint using existing techniques. To tackle this, the authors propose LocaliCSS, an automated approach that integrates heuristic rules, spatial relationship analysis of DOM elements, and a CSS property prioritization model trained on data from Quora and Stack Overflow. LocaliCSS enables precise identification of the critical CSS properties responsible for RLFs without requiring global stylesheet modifications. Experimental results demonstrate significant improvements in localization accuracy, with Top-1 to Top-7 accuracy rising from 45.2% to 92.86%, a mean reciprocal rank (MRR) of 76%, and a precision@3 (P@3) of 77.13%. Notably, its Top-7 predictions align with manual diagnoses by frontend engineers at a rate of 90.48%.

To address common issues in manual design-to-code translation—including element omission, geometric distortion, and incorrect ordering—this paper proposes DCGen, the first framework enabling end-to-end translation of webpage screenshots into executable UI code. Methodologically, DCGen employs a segment-aware multimodal large language model (MLLM), integrating image tiling with vision-unit-level localization to decompose the task and generate modular code fragments, which are then semantically reassembled into complete, functional UIs. Additionally, it introduces a dual-dimensional similarity evaluation mechanism assessing both visual and code-level fidelity. Evaluated on a real-world website dataset, DCGen achieves a 15% improvement in visual similarity and an 8% gain in code similarity over prior methods. Human evaluation confirms significantly enhanced developer productivity and superior UI fidelity.

To address two key challenges in automated HTML generation from UI design mockups—(1) difficulty in modeling hierarchical HTML structure and (2) weak cross-modal alignment between visual and textual representations—this paper proposes a structure-aware attention mechanism and a cross-modal contrastive fine-tuning strategy. Within a large language model (LLM) framework, our approach jointly optimizes syntactic correctness, visual fidelity, and semantic consistency for the first time. Specifically, it integrates tree-structured HTML encoding with image–text contrastive learning and introduces a new benchmark, WebSight-Test. Experimental results demonstrate significant improvements: +9.00 percentage points in HTML matching rate, +0.0982 in CW-SSIM, +32.99 in CLIP similarity, and +27.12 percentage points in LLEM score on both WebSight-Test and Design2Code—outperforming state-of-the-art methods by a substantial margin.

This work addresses the labor-intensive nature of presentation tasks—such as formatting and layout—in dashboard authoring, which currently lack support for partial reuse. Through a systematic user study, we characterize the needs and challenges associated with cross-source reuse of visual presentation elements. Building on these insights, we propose a novel paradigm that enables partial reuse of styles and layouts from multiple existing dashboards. We design and implement ReDash, a prototype system embodying this approach, and demonstrate through proof-of-concept experiments that our mechanism effectively overcomes key barriers in common reuse scenarios. The results show a significant improvement in authoring efficiency, confirming the feasibility and practical potential of partial reuse in real-world dashboard creation.

This work addresses the creative stagnation often induced by existing generative design tools that directly output complete images. To overcome this limitation, the authors propose a multi-stage, compositional AI-assisted design approach that emulates professional designers’ workflows: it first structurally interprets ambiguous design requests, then generates candidate elements—such as objects, backgrounds, typography, layout, and composition—separately, and finally enables interactive recombination. This method formalizes real-world design processes into a computable system for the first time, decoupling requirement interpretation, element generation, and composition to substantially enhance prompt diversity and alignment with user intent. User studies demonstrate that the system outperforms baseline approaches in both requirement comprehension accuracy and designer-rated quality, revealing a productive trade-off between structured workflow, creative clarity, and efficiency despite slightly longer generation times.

This work addresses the challenges of achieving visual diversity and high-quality outputs in design processes, which traditionally rely heavily on manual effort and struggle to scale or personalize effectively. To overcome these limitations, the authors propose a design generation approach based on a decoder-only language model (CPT) coupled with a novel Creative Markup Language (CML). CML provides a structured representation of design semantics and styling, enabling the model to learn layout, color, and typography attributes from professional templates. Notably, this is the first method to leverage language models for generating fully editable design variants—rather than pixel-level outputs—and introduces context-aware mechanisms for color and font prediction. Experimental results demonstrate that the generated designs adhere to established design principles while remaining directly editable in mainstream design tools, thereby offering a scalable, semantically consistent, and style-controllable solution for automated design generation.

Existing design generation methods typically assume input elements are stylistically consistent, struggling to handle heterogeneous components sourced from diverse origins with visual incoherence. To address this limitation, this work proposes GIST—a training-free, identity-preserving image synthesizer that harmonizes heterogeneous elements between layout prediction and typography generation, significantly enhancing overall visual coherence. GIST introduces, for the first time, identity-preserving stylized synthesis into the component-to-design generation pipeline, enabling seamless integration into existing design systems. Evaluations using multimodal large language models (LLaVA-OV and GPT-4V) demonstrate that GIST substantially outperforms naive collage baselines within the LaDeCo and Design-o-meter frameworks, achieving marked improvements in both aesthetic quality and visual consistency.

This study addresses the limitation of existing responsive line chart simplification methods, which typically employ a uniform algorithm and overlook varying user needs for preserving critical features—such as peaks and trends—across different datasets. Through a within-subjects experiment (N=30) evaluating three conditions (fixed algorithm, multi-algorithm selection, and multi-algorithm with manual point picking) across nine datasets, the research investigates how users select simplification strategies based on data characteristics rather than device type, and examines the impact of interaction complexity on engagement. Findings reveal that users adapt their strategies across datasets, yet increased flexibility does not universally enhance engagement. The results argue that responsive charting tools should balance flexibility and usability by integrating algorithmic diversity, progressive disclosure, and strong default settings.