The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
Project title: CodeLex — A Design ↔ Code Explorer Short description (the tagline field): See the code behind the design. Built for designers who want to understand what they're shipping. Full description: CodeLex is an AI-powered design-to-code explorer built entirely in Omma by Spline.
It bridges the gap between designers and developers by making CSS and JavaScript readable, interactive, and explorable — one term at a time.
EXAMPLES TAB Four curated pillars, each showing a live rendered component alongside its fully annotated code: · Design Tokens — CSS custom properties made visible · Button — hover, active, and click interactions · Layout — CSS Grid with a live wireframe · Animation — @keyframes with an editable duration.
SANDBOX TAB Paste any CSS or HTML and hit Run →. CodeLex annotates your code live, renders a preview, and makes every term clickable for instant explanations.
LEXICON Click any term in the code panel to get an AI-generated definition written for designers: what it is, how it maps to Figma, and examples. Hit "Read more →" for full documentation with a Figma analogy, common mistakes, and an MDN link.
LIVE SYNC Edit any value in the code panel and watch the design update instantly — no reload, no button press.
TECHNICAL · 3 AI agents (Annotation, Lexicon, Docs) via Anthropic API · Cloudflare Workers proxy to handle browser CORS
· Built 100% in Omma — no external frameworks With some help, monitoring and consulting by IZ//PZ Studio.
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Related posts
Excited to officially submit my entry for the Cantina Challenge — a psychological horror short titled Mira.
The spark for this project came from a simple, unsettling image that stuck in my head: what if the emotional weight you carry literally detached from you and stayed in the room? I wanted to translate that internal feeling of isolation into a visual reality without relying on heavy dialogue or classic horror tropes.
Project Title: Mira
Core Thesis: "Not looking back doesn't mean you're not still carrying it."
The Concept: Mira is a short psychological thriller pilot that explores the heavy, invisible weight of unresolved emotional trauma. Rather than relying on standard horror tropes, cheap dialogue, or jump-scares, the story relies entirely on grounded visual storytelling, non-verbal shadow choreography, and high-tension environmental audio.
The Protagonist: Mira
Trapped in a cycle of isolation and avoidance, attempting to project a calm exterior while her internal state deteriorates.
Key Visual Mechanics: A dynamic phone typing interaction where text messages act as a gateway to her internal state, leading up to a chilling moment where her shadow literally detaches from her body — anchored to the living room while she moves forward.
The Climax: A quiet, suffocating sequence where the ambient space collapses into total darkness, leaving her face-to-face with what she's been running from.
Why I Created This: I've always believed that every person carries immense quiet value, but when unaddressed trauma isolates us, we lose sight of our own worth. I wanted to build a character study that honors that internal struggle visually.
This is a blend of: Psychological Thriller + Surreal Character Study + Minimalist Environmental Horror.
Narrative engine: Emotional Isolation --> Unspoken Tension --> Visual Distortion --> Psychological Climax
Where I would take the series next:
Episode 1 is The Room. The engine is one locked apartment, one locked Mira, 10 visual metaphors for grief.
Episode 2 - the shadow that stayed behind now moves when she doesn't.
Creator Studio Feedback:
What worked well - precise low-key lighting, atmospheric sound design, micro-expressions.
Challenge — temporal asset consistency for the brown sofa, and precisely preserving her exact silhouette (hair, shoulder line) through the shadow's turn across frames.
Suggestion — location colour lock + shadow-direction/shape control for finer silhouette fidelity.
Confirmation: Created end-to-end in Cantina. Original work, one submission.
spooky! nice job
Built a new Webflow site for Tangível, a UX studio in Portugal.
20+ years, 60+ specialists, 380+ projects. Research, design systems, accessibility, product strategy. Finance, energy, telco, government.
The site had to hold all of that without feeling like a brochure. I developed it in Webflow so they can keep publishing cases and services themselves.
Live: tangivel.com
nice work..
For Sienna Rhodes, I designed the homepage around one idea: the portfolio should come first.
Photography clients usually want to know one thing before they read about your process, your packages, or even who you are: Do I connect with your work?
So instead of opening with a traditional introduction, the homepage leads directly into the portfolio and lets the imagery make the first impression. The supporting copy and details come later, once the work has already created that initial connection.
I’m curious where other designers and photographers land on this. Do you prefer a portfolio-first homepage, or do you think the photographer’s story should come first?
Portfolio first, every time for photography. Nobody hires off a process paragraph, they hire because one image stopped them scrolling. The story matters, but it lands harder after the work has already made the case. That start here slider does the pitch by itself.