xweather-branding

Apply Vaisala Xweather branding with color tokens, typography, and CSS starter.

4|Updated Jan 16, 2019

Search Tags:#typography #branding #css #ui-design #color-tokens #brand-guidelines

Ready to run

npx skills add https://github.com/four43/dotfiles --skill xweather-branding

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: xweather-branding
Source: https://github.com/four43/dotfiles/tree/main/claude/skills/xweather-branding
Command: npx skills add https://github.com/four43/dotfiles --skill xweather-branding

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Consolidates Vaisala Xweather branding guidelines for web UI design, ensuring consistent colors, typography, spacing, and logos across projects.

Core Features & Use Cases

Provides a complete Xweather branding framework for UI development, including color tokens, typography scale, layout rules, logo usage, and a CSS starter.
Includes brand assets and practical guidelines to maintain on-brand visuals for dashboards, marketing sites, and product interfaces.
Use Case: When building a web app, apply the CSS starter and color tokens to achieve an on-brand UI that respects dark/light modes and squared-off design principles.

Quick Start

Apply the CSS starter and color tokens from the Skill to style your UI with Xweather branding.

Frequently Asked Questions about xweather-branding

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

FAQPage Schema

How do I apply Vaisala Xweather branding to my web UI design?▼

To apply Vaisala Xweather branding to your web UI design, use the provided CSS starter and color tokens to style your interfaces. This ensures consistent on-brand visuals across dashboards, marketing sites, and software interfaces.

What branding assets are included for UI development?▼

The branding assets included for UI development consist of color tokens, a typography scale, layout rules, logo usage guidelines, and a CSS starter. These components help maintain on-brand visuals for product interfaces.

Does the Xweather branding CSS support dark and light modes?▼

Yes, the Xweather branding CSS supports both dark and light contexts. It provides color tokens and guidelines designed to achieve consistent on-brand visuals across different lighting contexts.

Can I use these brand guidelines for marketing sites and software dashboards?▼

Yes, you can use these brand guidelines for marketing sites and software dashboards. The framework provides colors, typography, spacing, and logos to ensure consistent on-brand visuals across projects.

Do I need any dependencies to implement the Xweather branding framework?▼

No dependencies are required to implement the Xweather branding framework. You can apply the CSS starter and color tokens directly to your web UI to achieve standards-compliant visuals.

What design principles does the Xweather branding framework follow?▼

The Xweather branding framework follows squared-off design principles. It provides a deterministic, standards-compliant UI framework through its layout rules and color tokens.