skills.rest
narduk-enterprises
narduk-enterprisesOFFICIAL
Explore all skills by this author →
WebsiteGitHub

logo-generator

Guide website logo placement, linking, alt text, and responsive behavior.

Updated Aug 27, 2026
Search Tags:#branding#web-design#header#brand-guidelines#logo#visual-identity#alt-text
One-click install
npx skills add https://github.com/narduk-enterprises/myboat --skill logo-generator-narduk-enterprises
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: logo-generator
Source: https://github.com/narduk-enterprises/myboat/tree/main/.github/skills/logo-generator
Command: npx skills add https://github.com/narduk-enterprises/myboat --skill logo-generator-narduk-enterprises

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Guides decision-making for where and how a website logo appears to maximize brand recall, ensure intuitive home navigation, and sustain accessible branding.

Core Features & Use Cases

  • Placement guidance: recommends top-left header placement for recognition and leverages left-to-right reading flow.
  • Implementation notes: wrap logo in a link to the homepage, prefer SVG for scalability, and provide clear space and accessible alt text.
  • Accessibility & branding consistency: emphasizes descriptive alt text, contrast checks, and variant handling for light/dark backgrounds.
  • Use Case: Example: update header logo to align with evolving brand guidelines while preserving accessibility and navigation expectations.

Quick Start

Place the logo in the top-left header, ensure it links to the homepage, use an SVG with descriptive alt text, and maintain brand clear space across breakpoints.

Frequently Asked Questions about logo-generator

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

FAQPage Schema
Where should I place my logo on a website for the best brand recognition?▼

Top-left header placement is recommended for logo positioning to maximize brand recall and leverage the natural left-to-right reading flow of website visitors.

How do I implement a responsive website logo that meets accessibility standards?▼

To implement an accessible website logo, wrap it in a homepage link, use an SVG format for scalability, define clear space across breakpoints, and provide descriptive alt text for screen readers.

What is the best way to handle logo variants for light and dark website backgrounds?▼

Brand-variant handling ensures your logo adapts to light and dark backgrounds by defining implementation requirements for contrast checks and switching logo variants to sustain accessible branding.

Do I need to use SVG format for my website header logo?▼

SVG usage is recommended for website header logos to ensure scalability across different screen sizes and responsive breakpoints without losing visual quality.

How do I update website header branding to align with new brand guidelines?▼

Updating website header branding involves applying new brand guidelines to logo placement, ensuring the logo links to the homepage, and maintaining clear space and accessible alt text across navigation and product pages.

Related Skills

Explore More Design & Creative Skills→
OpenLaborOpenLabor
4

Brand Guidelines

Enforce color, typography, logo usage, and voice guidelines across brand assets.

Official
Intermediate
coastdigitalgroupcoastdigitalgroup
2

site-navigation-system

Design accessible website navigation systems with ARIA and keyboard support.

Official
Advanced
modu-aimodu-ai
4

moai-domain-brand-design

Extract brand design tokens from visual-identity.md and enforce WCAG 2.1 AA accessibility.

Official
Advanced
OPS-PIversOPS-PIvers

ops-brand-guidelines

Apply official brand colors, typography, and logo placement to presentations and documents.

Community
Basic