How it works

Working with Kitty and AI

Kitty combines a website kit with a guided AI context. You describe your goal in plain words; the AI asks follow-up questions, recommends sensible decisions and records what you decided together.

Step by step

From goal to finished page

01

Describe your goal

In plain words: “I need a website for a physiotherapy practice with services, a team section and a way to get in touch.”

02

Kitty clarifies and remembers

The AI asks only the next sensible questions and records answers, open points and decisions in the project memory.

03

Built in the system

The AI uses tokens, templates and building blocks to deliver understandable HTML, CSS and JavaScript files.

How it sounds

Example prompts

Copy-and-paste templates — the more specific, the better the result.

“Create a new page leistungen.html following the Kitty system — a page title, a feature grid with 6 services and a CTA band at the bottom.”

“Change the accent color to a warm orange and make the section spacing a bit more airy — using tokens only.”

“Add a fourth column with opening hours to the footer and switch on the cookie banner, because we’re embedding Google Maps.”

“Build the home page as a boxed layout instead of full-width and add a sticky header.”

Built in

What Kitty reminds you of

Privacy baseline

Fonts stay self-hosted, consent only when needed — with real prior blocking. No silent background loading.

Accessibility

Kitty points out headings, alt text, visible focus, contrast and reduced motion. Deliberate exceptions remain possible.

Consistency

New spacing runs through the token scale, new sections through templates. Nothing is hard-coded.

Questions

Briefly explained

Do I need a server?
No. The pages run locally with a double-click and on any web hosting. Only the PHP contact form needs a server with PHP — without PHP, replace it with a mailto: link.
How do I change color, fonts or spacing?
Through the tokens in styles.css (:root). Just tell Kitty what you want — the change happens in one place, not in every building block.
How do I add a new page?
Take an existing page or a template from templates/ as a starting point, swap the content, link the same styles.css. Header and footer are duplicated per page (pure static, no build).
Does this make the website automatically GDPR-compliant?
The technical building blocks are designed for it (local fonts, prior blocking, a secured form). Getting the content and legal details right — privacy policy, consent categories — remains your responsibility.

Keep exploring

Take a look at the building blocks.

To the Styleguide Documentation