Went with an editorial direction for this one — DM Serif Display mixed with Epilogue, warm cream palette with chartreuse accents. Bento grid cards with hover interactions and a custom cursor.
What would you change?
Been building a set of HTML and CSS templates
lately, each one with a completely different
aesthetic direction.
This one is for creative professionals —
photographers, illustrators, designers — who want
something elegant rather than techy.
Design decisions I made:
- Cormorant Garamond serif for headings — refined
and distinctive without being overdone
- Warm cream and charcoal palette — completely
different from the typical dark tech template
- Split hero layout with image placeholder and
live stats row
- Work grid with subtle scale hover effect
- Services list with animated arrow on hover
- Testimonials section inverted to dark background
for contrast
- Full contact section with social links
Everything is pure HTML and CSS. No frameworks,
no JavaScript libraries, no dependencies.
Opens straight in a browser.
About 700 lines of clean CSS using custom
properties so the entire color theme changes
in a few seconds.
Happy to answer questions about any of the
CSS decisions or share specific code snippets.
Wanted to share a landing page template I built
recently. The challenge I set myself was making
something that looks genuinely designed rather
than generated — no frameworks, no JavaScript
libraries, just HTML and CSS.
Main things I focused on:
- Strong typographic hierarchy using Playfair Display
- CSS Grid for the editorial column layout
- CSS custom properties for easy theme customization
- A scrolling ticker built with pure CSS animation
- Mobile responsive without any media query hacks
The whole thing is about 600 lines of clean CSS.
No dependencies. Opens straight in a browser.
Happy to answer any questions about the approach
or share specific code snippets if useful.
