A studio's website has about four seconds to establish that the people behind it can be trusted with a brand, and Zinox spends all four on one enormous Anton headline over a full-bleed hero, a wordmark that lifts away as the page arrives, and a black-and-white palette with nothing in it to hide behind. Zinox Studio is a hand-coded HTML template for design studios, branding agencies and digital collectives that want their site to look as considered as the work in it.

Built with clean HTML5, CSS3 and vanilla JavaScript, Zinox ships a complete agency site: seven full case studies, six service pages, a six-article journal, a pricing page with a comparison table, and a home page whose services picker, award carousel and blog carousel all run without a single library. No jQuery, no GSAP, no framework, no build step — every animation is CSS and every duration is one line in a stylesheet you can read.

Whether you run a brand studio, a motion practice, a UI/UX consultancy or a small digital agency, Zinox gives you every page and component needed to show the work, explain the service, name the price and start the conversation.

Designed for Studios With Something to Show

Zinox is organised the way a prospective client actually reads a studio: what have you made, what do you do, what does it cost, who are you. The work page splits seven projects into featured pairs and a three-up row; each case study opens on a full-width banner and closes on an outcome section with its own figures. The services page numbers six disciplines and each one has a page of its own with a feature gallery.

The palette is black, white and four greys, with Anton for display, Inter Tight for reading and Space Grotesk for labels — all three self-hosted as woff2, none of them called from a third-party host. Decoration is drawn rather than photographed: dotted grids that pulse beside the header, small crosses that mark the section edges, a dashed rule that scrolls forever inside the hero's work card.

Key Features

Bold editorial design in black, white and greys
Fully responsive across all devices
Built with HTML5, CSS3 and vanilla JavaScript
No jQuery, no GSAP, no frameworks, no build step required
32 pages including 19 case study, service and article pages
Seven project case studies with their own outcome figures
Six service pages with feature galleries
Six full-length journal articles, each with its own body
Wordmark preloader that hands the hero a twelve-step arrival
Services picker that slides six panels behind six titles
Award carousel with autoplay, arrows, dots and swipe
Blog carousel whose active card grows and captions rise
Testimonial slider driven by an ARIA tab set
Framed-image wipes that settle the photograph behind them
Scroll reveals in four directions plus staggered groups
Pricing rows that hinge open from the top edge as you scroll
Partner marquee crawling seamlessly across the page
Button labels that roll to their duplicate on hover
FAQ accordion built from real disclosure buttons
Custom cursor that tips into the direction of travel
Contact page with a labelled enquiry form and studio addresses
Password-protected, 404, style guide, licence, changelog and instruction pages
Self-hosted web fonts, no third-party requests
Every animation stops under reduced-motion settings

Included Pages

Home
About
Services
Service Detail
Work
Case Study
Journal
Article
Pricing
Contact
Style Guide
Licences
Changelog
Instructions
Password Protected
404 Not Found

Ideal For

Brand and identity design studios
Motion and 3D design practices
UI/UX and digital product consultancies
Marketing and creative agencies
Graphic designers and art directors
Independent designers building a studio site
Small agencies replacing a page builder with real code

Performance and User Experience

Nothing in Zinox waits for a library. The whole site is one 200 KB stylesheet, one 22 KB script and a folder of images, and the script does nothing but add and remove classes — every animation is CSS, so the browser can run it off the main thread. Images ship as AVIF with full responsive sets, fonts are self-hosted woff2 with font-display: swap, and no page makes a single third-party request.

The template degrades honestly. With JavaScript switched off every section still renders at rest rather than at opacity: 0, and with reduced motion requested every reveal, loop and carousel resolves immediately. Each page has one h1, a heading outline with no gaps, header / main / footer landmarks, real buttons for every control, visible focus rings and state reported to assistive technology.

Why Choose Zinox Studio?

Zinox gives a studio the three things its site has to do — make the work look worth commissioning, explain the practice plainly, and open a conversation — in code clean enough to hand to any developer, with no framework to learn, no build to run and nothing to keep up to date.