Templates · Content

Blog

A calm, reading-first blog — mono eyebrow, editorial typography, and inline callouts.

Preview

Every element on the page is a Nova primitive. Adjust tokens in src/styles.css.

Essay · 6 min

Designing Nova's material system

How layered shadows and mask-composited highlights make interfaces feel physical.

designmotion

Essay · 6 min

Motion as UX

Spring physics beat curves. Here's why we shipped snap, soft, and glide.

designmotion

Install

Pull the template with the Nova CLI.

tsx

npx @novix-ui/cli template add blog

Source

tsx

// src/routes/blog.$slug.tsx
export function Post() {
  const { post } = Route.useLoaderData();
  return (
    <article className="prose mx-auto max-w-2xl py-12">
      <p className="eyebrow">{post.category} · {post.readingTime}</p>
      <h1>{post.title}</h1>
      {post.body}
    </article>
  );
}

What's included

Post indexPost detailReading timeCalloutsRSS feed