Design

Netresearch Branding

Netresearch-Brand-Guidelines: Farben, Typografie, Komponenten.

Letztes Release v2.7.0

Installation

Nimm den Weg, der zu deinem Projekt passt — alle führen zum selben Skill.

  1. Claude Code über diesen Marketplace
    /plugin install netresearch-branding@netresearch-claude-code-marketplace
  2. npx beliebige Agent-Skills-CLI
    npx skills add https://github.com/netresearch/netresearch-branding-skill --skill netresearch-branding

    Universelle Agent-Skills-CLI von skills.sh — funktioniert in Claude Code, Cursor, GitHub Copilot, Codex, Gemini CLI und 30+ weiteren Agents.

  3. composer require PHP-Projekt, als Paket
    composer require netresearch/netresearch-branding-skill

    Setzt netresearch/composer-agent-skill-plugin voraus — bindet Agent Skills als Composer-Dependencies in PHP-Projekte ein, erkennt Skills automatisch, generiert AGENTS.md.

  4. composer skills:add PHP-Projekt, direkte Quelle
    composer skills:add github:netresearch/netresearch-branding-skill

    Kommt aus netresearch/composer-agent-skill-plugin — pinnt Skill-Repos direkt ohne Packagist-Veröffentlichung, persistiert in composer.skills.lock.

Wofür du den Skill einsetzt

  • SKILL.md - Complete brand implementation guide covering:
  • Brand identity and core values
  • Color system with accessibility compliance
  • Typography standards (Raleway, Open Sans, Calibri)
  • Logo usage guidelines and restrictions
  • Web design principles and best practices
  • Component styles and patterns
  • Social media specifications
  • Image guidelines
  • Accessibility requirements (WCAG AA)
  • Implementation checklists
  • colors.md - Detailed color palette with:
  • Technical specifications (Hex, RGB, CMYK, Pantone, NCS)
  • Usage guidelines and approved combinations
  • WCAG AA contrast ratios
  • CSS custom properties
  • Accessibility compliance details
  • typography.md - Complete typography system with:
  • Font specifications and licensing
  • Web font loading strategies
  • Typography scale and hierarchy
  • Responsive typography patterns
  • Line height and spacing guidelines
  • Performance optimization
  • web-design.md - Web implementation patterns:
  • Responsive grid system
  • Component library (buttons, cards, forms, navigation)
  • Layout patterns
  • Animations and transitions
  • Accessibility considerations
  • landing-page.html - Complete landing page template
  • styles.css - Production-ready brand CSS with all components
  • components.html - Interactive component showcase

Was der Skill im Projekt erwartet

Tags

  • design
  • meta