VETREATMENT
The design for the VETREATMENT Pet Clinic website uses a calming blue background to convey trust and professionalism, complemented by green accents that symbolize health and compassion—especially in the call-to-action buttons and headline highlights. Clean, modern sans-serif fonts were chosen for readability and a professional look across devices. The layout is user-friendly, with a clear navigation bar, prominent booking buttons, and a warm image of a person holding a dog to create an emotional connection. The inclusion of mobile mockups reinforces the responsive design, ensuring accessibility and ease of use for all visitors.
Tools used
From brief
Topics
Share
Reviews
4 reviews
Hey John, nice work on the VETREATMENT project!
I noticed a couple of things that could polish the design even more though. The main headline's line height looks a bit too generous which might actually hurt readability, and that subtitle is running pretty long. Ideally you want to stick around 50-75 characters per line with 66 being the sweet spot for easy reading.
Also, if "VETREATMENT" in the header isn't clickable, I'd probably avoid using the primary color there since users might expect it to be a link.
Overall solid foundation, just those few tweaks could really tighten up the user experience!
Looking at this hero design on figma with an updated version, you've built a solid foundation. The emotional connection with that vet-and-dog image works really well for this audience.
Here's my main advice: pick one primary color and stick with it. You chose blue because it conveys trust and calm, which is perfect for anxious pet owners bringing their animals to a clinic. That's smart color psychology.
But your call-to-action buttons are creating confusion. That green CTA button at the bottom isn't getting the attention it deserves, the contrast isn't strong enough and it's fighting with your blue primary color for dominance.
Try this: make your primary CTA button white with blue text, or go full blue background with white text. Either way, you'll get better contrast and clearer hierarchy. If that green isn't reading well, consider bumping up the font weight to medium or semi-bold to help it stand out.
I understand you're trying to connect the green to your logo, but right now it's diluting your color strategy. Use blue as your primary color throughout, then save green purely for accents, maybe small highlights or secondary elements that will appear later on the screen.
The blue foundation you chose is working. Don't overcomplicate it with too many competing colors. Clean up that color hierarchy and your CTAs will perform much better.
Great job John, your design feels warm and trustworthy — just tighten the color hierarchy on your CTAs for clarity, and you’ll have an even stronger landing page!
I was about to ask why you would put the hero images (mobile) inside the hero images (desktop), causing an infinite loop 😅 Then I opened the Figma file and thought “oh, got it” it was just an example. Still, it did confuse me for a second. I think it would be better to show it separately. It’s fine for a thumbnail, tho.
I agree with everything you said, except for the CTA text (green on white). I think it could be a bit darker to help with legibility and I get the sense this is only halfway done? showing just the above-the-fold section.
Looking forward to the update!
You might also like

Heuristic Evaluation of Revolut Mobile App

Sojo NFT Marketplace

From Idea to Full-Stack Web App

Docto

Hulu Through My Eyes - A Cinematic UI Exploration (unofficial)
