punkt-css

Apply Punkt CSS typography, spacing, and grid utilities across web projects.

3|Updated Feb 26, 2026

Search Tags:#typography #layout #css #utilities #responsive #grid #punkt

Ready to run

npx skills add https://github.com/oslokommune/punkt-skills --skill punkt-css

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: punkt-css
Source: https://github.com/oslokommune/punkt-skills/tree/main/skills/punkt-css
Command: npx skills add https://github.com/oslokommune/punkt-skills --skill punkt-css

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Punkt CSS provides a unified approach to styling and layout, helping teams apply consistent typography, spacing, and grid rules across web projects.

Core Features & Use Cases

Enforces a consistent design language by applying Punkt CSS typography, spacing, color, and grid utilities.
Enables scalable, responsive layouts via container, grid, and breakpoint utilities, with optional SCSS embedding.
Real-world use: build a responsive article page or dashboard using Punkt CSS classes to control typography, spacing, and grid structure.

Quick Start

Import the Punkt CSS stylesheet in your project and start applying its utility classes for layout and typography.

Frequently Asked Questions about punkt-css

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I standardize typography and spacing across multiple web projects?▼

Use Punkt CSS to standardize typography and spacing by importing its stylesheet and applying utility classes that enforce a consistent design language across projects. This approach controls layout rules without writing extensive custom CSS.

What is the best way to build responsive dashboards using consistent CSS utilities?▼

Build responsive dashboards using Punkt CSS container, grid, and breakpoint utilities. These classes provide scalable layout structures that adapt to different screen sizes while maintaining a unified design language across your dashboard components.

Can I use Punkt CSS with SCSS in my project?▼

Yes, Punkt CSS supports SCSS embedding alongside standard stylesheet imports. You can integrate its utility classes into your SCSS workflow to apply breakpoints and layout rules while maintaining a unified design system across your project.

Does Punkt CSS support grid layouts for marketing sites?▼

Punkt CSS supports grid layouts for marketing sites through its grid utility classes. It enables scalable, responsive page structures by combining container and breakpoint utilities to maintain consistent typography and spacing rules across marketing pages.

How do I apply consistent layout rules and breakpoints without custom CSS?▼

Apply consistent layout rules and breakpoints using Punkt CSS utility classes instead of custom CSS. Import the stylesheet and use its predefined container, grid, and breakpoint utilities to control responsive behavior across your web pages.