From punkt-designsystem
Using Punkt CSS (@oslokommune/punkt-css) in projects. Covers setup, layout, typography, colors, grid, spacing, and utility classes for building websites and applications with the Oslo kommune design system. Use when building pages or layouts with Punkt CSS classes.
How this skill is triggered — by the user, by Claude, or both
Slash command
/punkt-designsystem:punkt-cssThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Skill for using Punkt CSS (`@oslokommune/punkt-css`) in projects. Covers setup, layout, typography, colors, grid, spacing, and utility classes for building websites and applications with the Oslo kommune design system.
Skill for using Punkt CSS (@oslokommune/punkt-css) in projects. Covers setup, layout, typography, colors, grid, spacing, and utility classes for building websites and applications with the Oslo kommune design system.
Key principle: Focus on CSS classes and CSS custom properties. SCSS mixins and variables are noted where relevant but require the SCSS embedding method.
npx claudepluginhub oslokommune/claude-marketplace --plugin punkt-designsystemProvides Tailwind CSS 3.x utility classes reference for spacing, colors, typography, flexbox, grid, responsive designs, state variants, dark mode, and tailwind.config.js configuration.
References Tailwind CSS utility classes for layout, spacing, typography, colors, backgrounds, borders, shadows, effects, and responsive design. Aids utility-first CSS composition.
Provides CSS architecture expertise on BEM, CSS Modules, Tailwind, CSS-in-JS (styled-components, Emotion), design tokens, responsive Grid/Flexbox layouts, container queries. Use for methodology selection, setup, modern CSS, and performance diagnosis.