Templates

Templates are complete page layouts assembled from Blocks. A Block is a named, reusable page section — styled exclusively with Farn semantic tokens and built from Farn components. Copy a block's HTML and CSS into your project, swap the content, and rename the classes to fit your codebase.

How it works

Three levels, each building on the last:

• Template — a named, complete page layout assembled from blocks (e.g. Landing Page).
• Block — a named page section combining layout HTML with Farn tokens and components. Styled only with semantic tokens — no hardcoded values.
• Component — Farn's shipped atoms: .btn, .card, .badge, and the rest. Used inside blocks.

Block CSS classes (.hero, .features, etc.) are copy-paste starters — rename them to fit your project. They are not part of Farn's stable component API.

Available templates