Inspired by @simonwillison.net's pelican-bicycle repo, here are some CSS sunsets by gpt-4o, claude-3-5-sonnet and gemini-2.0-flash-exp. Sonnet and Gemini animate the birds and clouds. Prompt: Generate pure HTML/CSS art of an extremely detailed, beautiful sunset. No talk or code fences. Code only.
Inspired by Simon’s pelican-bicycle
repo, I played around a bit with using LLMs to generate visuals with SVGs, Three.js and pure CSS.
I posted about some of the results here.
I used the code below to generate the HTML/CSS for the images:
import llmimport timefrom pathlib import Path
MODELS = [ "gpt-4o", "claude-3-5-sonnet-latest", "gemini-2.0-flash-exp",]
SUBJECT = "an extremely detailed, beautiful sunset"
PROMPT = f"Generate pure HTML/CSS art of {SUBJECT}. No talk or code fences. Code only."
now = str(int(time.time()))out_dir = Path("out") / nowout_dir.mkdir(parents=True, exist_ok=True)prompt_file = out_dir / "prompt.txt"prompt_file.write_text(PROMPT)
for m in MODELS: model = llm.get_model(m) response = model.prompt(PROMPT) out_file = out_dir / f"{m}.html" out_file.write_text(response.text())