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
šš°š² ššæš²š®šŗ š-šš¼šŗšŗš²šæš°š² šš²šæš¼ š¦š²š°šš¶š¼š» - Dynamic & Interactive UI
šÆ Central Axis & Overflow Effect: The hero pistachio cone sits strictly in the center to establish a strong vertical axis. Overlapping the bold background typography adds 3D depth and brings the product to life.
ā Concentric / Radial Navigation: The subtle orbital ring guides the user's eye in a loop around the cone, using floating benefit badges ("100% plant-based", "Zero sugar", "Dairy-free") to highlight core product attributes.
āļø Structured Chaos & White Space: Asymmetrically arranged buttons, tags, and cards create dynamic visual energy, perfectly balanced by generous light-grey background spacing.
šØ Interactive Flavor Filtering: The top-left flavor selector dynamically adapts the page's color scheme, visual assets, and content based on the selected flavor (active: Pistachio).
š± Bento Grid Layout: Rounded bottom modules ("People's Choice 2026" and "New flavor") structure secondary information cleanly without cluttering the main screen.
š¤ Typography & Palette: High-contrast pairing of an ultra-wide display font with refined details, complemented by pistachio green accents, a deep olive CTA button, and neutral background tones.
Which specific aspect of design interests you the most ā the Figma layout development, the UI/UX solutions, or the branding concept?
Superb
Thanks a lot!šø
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
Built the site for Linea ā a boutique rail brand where the whole UI is made of the same rule as the print system.
Every route card's red line isn't decoration, it's that route's actual elevation profile. Fare tiers aren't styled, they're the same data at different density.
The logo's sparkle mark even resolves from the exact same contour-drawing logic, live on the page.
One idea, all the way down ā Here
Two moods for one tutoring websiteš¤© Which would you click?
These were two early website concepts we put together for TutorIQ before choosing the main design.
Tell us in the comments what caught your eye:
š§© 1 ā Light and playful
āļø 2 ā Softer and calmer
Mini case study with the final website design is coming here very soon!
11 voted
55%
9 voted
45%
20 votes
Closed
I'm going with Light and playful š§©
Marigold was a one-day concept for a design challenge. I set the direction in real photography before generating anything.
That order matters more than people think. If you generate first, you're negotiating with whatever the model offers. If you shoot or choose real references first, you've set a standard the rest of the work has to meet.
The tool didn't set the taste. It matched a bar that already existed.
Great work!, love the colors