DKube-web-stylist-v1-1.5B

A LoRA adapter on Qwen/Qwen2.5-Coder-1.5B-Instruct that restyles one section of an ordinary website (a nav bar, hero, features, pricing, testimonials, call to action, form or footer) into one of 12 curated looks. It keeps every word and every link, and writes Tailwind classes whose colours and fonts come from the chosen look's tokens (presets/<name>.json in this repo).

It is a restyler, not a designer: it lays out your content the way one of its 12 looks would. It does not invent new layouts or blend looks inside one section.

Prototype — review before you publish anything. On held-out sections it keeps the content intact 96% of the time, but it can drop a short stand-alone line or add a label that was not in the input (see Known failures below). Check every section it returns against the original before it goes live.

Training

• Data: 18,534 train / 1,031 validation / 1,025 test pairs, split by source page so no page appears in both training and test. Rows longer than 1,664 tokens were left out, not truncated.
• Method: QLoRA (4-bit NF4 base) with LoRA r=32 / α=64, dropout 0.05, on all attention and MLP projections. Learning rate 0.0001, cosine schedule with 5% warm-up, effective batch 16 (1 × 16 accumulation), gradient checkpointing, seed 42, on an NVIDIA GB10 (DGX Spark), peak memory 8.2 GB.
• Early stopping: 1 epoch planned (1,159 steps); stopped at step 450, after two validation checks improved by less than 0.001. The best checkpoint was kept (validation loss 0.00287).
• How the pairs were made: each input is a website section written the way real sites are, in one of four styles (Bootstrap 3, Bootstrap 5, plain semantic HTML, or inline-styled "div soup"). Its content is extracted and rendered through the chosen look's hand-written template to make the target. A pair was kept only if the target is valid HTML, keeps every word and link of the input, and uses only the look's token colours.

Source	License	Use
HuggingFaceM4/WebSight v0.2 (synthetic Tailwind pages)	CC BY 4.0	sections as inputs; their text and links as content
Generated sections (nav, hero, features, pricing, testimonials, CTA, form, footer)	written for this model	inputs and content, covering what WebSight lacks
The 12 look templates and tokens	written for this model	targets; original style studies with no third-party markup, text, logos or images

Evaluation

Run on 2026-09-29 on a fixed 50-row sample of the locked test set (sections never seen in training), with the same prompt for both models:

• All four checks ↑: the answer is valid HTML, keeps every word and every link of the input, and uses only the look's token colours.
• Restyled ↑: the answer uses the look's token classes (at least three), rather than echoing the input.
• Nothing added ↑: no text appears that is in neither the input nor the look's own template.
• Layout overlap ↑: class overlap (Jaccard) with the look's reference rendering of the same content.

model	all four checks ↑	restyled ↑	nothing added ↑	layout overlap ↑
Qwen2.5-Coder-1.5B-Instruct (no adapter)	0.24	0.00	0.00	0.002
DKube-web-stylist-v1-1.5B (this model)	0.96	1.00	0.92	0.95

On two real pages it never saw, restyled section by section with a one-line brief choosing the look: a Bootstrap 5 restaurant page passed every check on 7 of 8 sections, and a Bulma veterinary-clinic page (a CSS framework absent from training) on 7 of 8. This is small evidence: a 50-row sample and two sites.

Known failures

Read from this model's own answers on the test sample and the two real pages:

• A short line standing apart from the section's main structure gets dropped: the restaurant hero's small intro line ("Wood-fired since 2011"), and the vet clinic footer's brand name and address line (the link columns and copyright were kept).
• It sometimes adds words (8% of test sections): mostly a look's own decorative labels, such as "Menu +" on a nav, an arrow after a heading, or margin notes in the drafting look; once, a pair of feature headings run together into one line.
• One section at a time, up to about 1,600 tokens including the answer. It has not seen whole pages or longer sections.
• Worked well: Bootstrap 5 card grids, pricing plans with feature lists, "Name, Role" testimonials split into two lines, forms with labels, footers with titled link columns, and markup in a framework it never saw (Bulma).

Usage

from peft import PeftModel
from transformers import AutoModelForCausalLM, AutoTokenizer

base = "Qwen/Qwen2.5-Coder-1.5B-Instruct"
tok = AutoTokenizer.from_pretrained(base)
model = AutoModelForCausalLM.from_pretrained(base, torch_dtype="auto")
model = PeftModel.from_pretrained(model, "dkubeio/DKube-web-stylist-v1-1.5B")

section = '<section class="py-5 bg-danger text-white text-center"><h2>Hungry already?</h2><p>Tables go fast on weekends.</p><a class="btn btn-light" href="#book">Book a table</a></section>'
msgs = [
    {"role": "system", "content": "You are a helpful assistant."},
    {"role": "user", "content": "preset: umber\n" + section},
]
ids = tok.apply_chat_template(msgs, add_generation_prompt=True, return_tensors="pt")
print(tok.decode(model.generate(ids, max_new_tokens=2048, do_sample=False)[0][ids.shape[1]:], skip_special_tokens=True))

The prompt is preset: <look> on the first line, then the section's HTML; the system prompt above is the one the model was trained with. Decode greedily. To restyle a whole page, split it into its top-level sections and restyle each.

The output needs its look's tokens to render. The model writes semantic classes such as bg-accent, text-ink and font-display. Each presets/<name>.json holds a look's colours, fonts and radii: load its fonts stylesheet and pass its theme to Tailwind's extend. Every section of a page uses the same token names, so the page stays consistent, and the palette can be changed afterwards by editing the tokens.

To run it in Ollama or llama.cpp, merge the adapter into the base model (merge_and_unload()), save it, and convert it with llama.cpp's convert_hf_to_gguf.py. A Q4_K_M quantisation is about 1 GB.

The 12 looks

look	style
almanac	Annual-report editorial: stark white, black type on a split grid, wide-tracked mono labels
blush	Soft portfolio: blush-and-cream haze, charcoal text, slash-separated labels, one very large headline
cobalt	Institutional tech on bone paper: dotted column rules, cobalt square markers, boxed chip buttons
courtline	Grainy sport-fashion editorial: film-grain grey, thin court lines, huge italic serif headlines
dither	Strict tile grid: hairlines, halftone dot fields, charcoal and mint blocks
drafting	Architect's drafting table: pinstriped cream paper, calm charcoal sans, hand-lettered margin notes
ledger	Finance precision: thin vertical grid lines, square corners, coral accent, numbered rows
nocturne	Night-studio showreel: near-black slate, neon-tube outlines, a red-orange ticker band
poster	Studio poster: warm grey paper, giant wide uppercase headlines, crosshair marks
tannery	Maker's workbench at night: charcoal with topographic contours, heavy condensed chartreuse caps
umber	Private-equity warmth: black with an ochre-to-oxblood glow, a mosaic of hairline tiles
voxel	Protocol-grade dark: pure black, one electric blue, vertical dash bars, a floating capsule nav

License & attribution

• Adapter: Apache-2.0. Use of the base model follows its own license (Qwen/Qwen2.5-Coder-1.5B-Instruct: Apache-2.0).
• Training data: includes material derived from HuggingFaceM4/WebSight, licensed CC BY 4.0; attribution to its authors is given here.