Live preview
Krea homepage: a warm paper page carrying the serif headline We build AI systems that survive contact with production, beside a single continuous teal line looping into a knot
07 / ASTRO THEME

Krea

For a studio that ships, not pitches.

  • AI studio
  • Consultancy
  • Editorial

The seventh Quaeris Design release, and by some distance the lightest. A studio site carrying a capabilities page, a rate card with one fixed number and a journal — eighteen routes and a scroll-driven hero with no library behind it, with the whole demo live and open to inspection.

MEASURED FROM THE DEMO
3.4 KB
JavaScript
18
Indexable routes
0
Blocking stylesheets
207 KB
Fonts on first load
3
Font families
Astro 7.3
Built with

Every figure came from astro-design-krea.pages.dev. Open it and check.

One published website. VAT included; the studio licence covers client work. 14 days to withdraw, until the first download.

THE BRIEF

What it is for, and who it suits.

A typographic direction on warm paper, for practices that sell judgement. Fraunces at display size over a single continuous teal line that loops across the header — and the illustration’s own background is exactly the page ground, so the drawing melts into the paper rather than sitting on it. One twelve-column grid runs the whole site, but no two sections claim the same span: dropping every band into the same block is what makes a page read as one shape repeated.

  • Applied AI and engineering studios
  • Technical consultancies selling judgement rather than a catalogue
  • Small practices whose deliverable is a system
  • Anyone who would rather show a method than a gallery
THE PAGE SET

Routes you get, and where they come from.

Every route below is generated at build and served as a static file.

Pages

Written once, edited in place.
  • Home
  • Capabilities
  • Pricing
  • About
  • Contact
  • Legal notice

Collections

One Markdown file becomes a route, an index entry and a listing.
  • Article × 3
  • Author × 2
  • Category × 4

System

Generated, never hand-maintained.
  • 404
  • sitemap.xml
  • robots.txt
DESIGN NOTES

The decisions behind the look.

01

The artwork sits in the paper, not on it.

Every illustration is exported on exactly the page ground, so a drawing has no edge and needs no card around it. It is the cheapest way to make artwork look native to a page — and the thing that quietly stops working the day someone changes the background token without re-exporting.

02

The hero parallax has no library behind it.

Four ridge layers drift at different rates through the first viewport of scroll, driven by a CSS scroll timeline rather than by an animation library and a scroll listener. It is gated behind a support query, because without a scroll timeline the same declaration would pin every layer at its end position instead of leaving it still. The whole home page costs 3.4 KB of JavaScript.

03

No italic on the marketing pages, on purpose.

The Fraunces italic is a second variable file of 146 KB — on its own larger than the HTML — and one italic glyph anywhere in the first render pulls all of it. Three places used to: a marquee, a footer ampersand, a pull quote. Separating them by colour and by axis instead took the home page from 354 KB of fonts to 207, and the largest paint from 3.7s to 2.9s. The italic is still there for body copy, where it is worth the fetch.

04

Two teals, two jobs.

The bright teal measures 3.0:1 on paper, so it carries decoration and display type and is never allowed under 24px; a darker one at 5.3:1 carries links and running text. Splitting the accent in two is what lets the palette stay this warm and still pass a contrast check at body size.

PALETTE
  • Paper #f9efe0 Page ground, and the artwork’s own
  • Ink #0c2340 Text and dark bands
  • Teal #1f9ba1 Decoration and display, never under 24px
  • Teal ink #146e70 Links and running text
  • Coral #ee7f63 The error signal, and nothing else
TYPEFACES
Display
Fraunces Variable, optical size 24 to 144
Body
Inter Weight 300, 400 and 500
Utility
JetBrains Mono Uppercase micro-labels
WHAT SHIPS WITH IT

Know what you’re getting.

A good-looking screenshot is the beginning. The details help you choose.

01 / THE PAGES

A view of the whole site.

Every release lists its page set, from the homepage to the article, author and category templates your project actually needs.

Page list with each release
02 / THE EXPERIENCE

Every screen matters.

Desktop and mobile layouts, navigation, focus states and interactions, checked at the widths people actually use rather than the one the screenshot was taken at.

How customisation works ↗
03 / THE HANDOVER

The details, before you buy.

Source files, installation requirements, licence and support terms are published on the theme page so you can decide before you spend anything.

Exact package with each release
PRICING

A clear price. A clear package.

Pick the design that fits your project. One licence covers one published website; building for clients is the studio licence.

INDIVIDUAL THEMES ON SALE

Find your fit.

€59 a theme

One licence, one published website. Work you deliver to clients is the studio licence: €399 for the whole collection, and a year of everything released after it.

A theme licence
One published project
Client work
Studio licence
Updates & support
Stated per theme
THIS THEME

Everything above, in one download.

Krea, as the complete Astro source. Change anything, deploy it anywhere static, and keep it.

One published website. VAT included; the studio licence covers client work. 14 days to withdraw, until the first download.

ELSEWHERE IN THE COLLECTION

Three more directions.