Does this skill work for any website project?

No, this skill is specifically tuned for the bimverdi.no design system and WordPress theme architecture, ensuring code matches their unique brand identity.

What is the 'Variant B' design philosophy mentioned?

It is a design standard that uses whitespace and 1px hairline dividers to create structure, rather than using the cards and heavy shadows common in generic AI-generated layouts.

Is the generated code compatible with Advanced Custom Fields (ACF)?

Yes, the skill is designed to work within a WordPress/PHP context and utilizes ACF fields for dynamic data rendering.

How does this skill handle localization?

It avoids generic English placeholder text, instead providing real Norwegian content to better reflect the final user experience of the bimverdi.no platform.

BIM Verdi UI Design System

Name: BIM Verdi UI Design System
Author: aharstad91

byaharstad91

0•

デザインツール

Generates high-fidelity WordPress frontend components and pages following the specific BIM Verdi enterprise-calm design system.

This skill provides Claude with the specialized knowledge required to build, maintain, and extend the bimverdi.no frontend. It enforces strict adherence to the BIM Verdi design language—prioritizing whitespace and hairline dividers over generic box-shadow layouts—while ensuring all generated code integrates seamlessly with WordPress, PHP, and Advanced Custom Fields (ACF). It is specifically engineered to prevent common AI design patterns, ensuring a professional, Norwegian-localized user experience that maintains brand consistency across templates, forms, and interactive elements.

主な機能

01Implements 'Variant B' design philosophy focusing on whitespace and hairline dividers over boxes.

02Includes a comprehensive library of Lucide icon implementations and standardized CSS classes.

03Generates WordPress-compatible PHP templates and ACF-integrated components.

04Provides localized Norwegian content placeholders instead of generic AI-generated text.

050 GitHub stars

06Enforces enterprise-calm aesthetics using the specific BIM Verdi color palette and typography.

ユースケース

01Creating accessible, 960px-width form layouts with sticky action bars and proper validation states.

02Developing interactive dashboard elements that follow strict hover and focus state interaction rules.

03Building new archive and single-page templates for the BIM Verdi WordPress theme.

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add aharstad91/bimverdi-v2 bimverdi-design

For use in Claude.ai and ChatGPT

Download Skill