company-logos

Renders brand logos as Iconify Simple Icons at 64x64 instead of text wordmarks.

5.7k|685|Updated Feb 3, 2026
One-click install
npx skills add https://github.com/MengTo/Skills --skill company-logos
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: company-logos
Source: https://github.com/MengTo/Skills/tree/main/agent-skills/web-design/company-logos
Command: npx skills add https://github.com/MengTo/Skills --skill company-logos

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Landing pages and product interfaces often need recognizable brand marks for logo rows, integration grids, and customer proof sections, but sourcing consistent logo assets is tedious and error-prone. This Skill standardizes brand logo rendering using Iconify Simple Icons so designs avoid plain-text company names and mismatched logo styles.

Core Features & Use Cases

  • Iconify Simple Icons as default source: Renders each brand logo in a 64x64 visual box with the inner SVG scaled to the composition density.
  • Consistent visual treatment: Keeps logos monochrome by default, aligns them to a shared baseline or center grid, and adds accessible labels when logos are interactive.
  • Style guardrails: Prevents mixing filled, outline, emoji, bitmap, and wordmark styles in one row, and blocks hotlinking random logo assets from search results.
  • Use Case: When building a landing page with a customer proof section, use this Skill to render logos like NASA, SpaceX, Uber, Visa, and Sony as uniform monochrome icons instead of typed company names.

Quick Start

Use the company-logos skill to build a responsive HTML landing page with a logo row of well-known brands rendered as Iconify Simple Icons at 64x64.

Frequently Asked Questions about company-logos

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

FAQPage Schema
How do I add company logos to a landing page without custom SVG files?

Use Iconify Simple Icons as the logo source and render each brand mark inside a 64x64 visual box, scaling the inner SVG to match the composition density. This avoids embedding custom SVG files or typing company names as plain text.

What icon library should I use for brand logos in HTML?

Iconify Simple Icons is the recommended source for brand logos because it provides a large, consistent set of recognizable marks. Load the iconify-icon web component and reference logos by name, such as simple-icons:nasa or simple-icons:spacex.

Should brand logos be monochrome or full color in a logo row?

Keep logos monochrome by default so the row feels cohesive and restrained. Use brand color only when the surrounding design needs recognition more than visual restraint, and never mix filled, outline, emoji, bitmap, and wordmark styles in one row.

How do I align multiple brand logos in a grid or row?

Align all logos to a shared baseline or center grid so rows feel intentional. Render each logo in the same 64x64 box and scale the inner SVG consistently so differing logo shapes still appear balanced.

When is it acceptable to use text instead of a logo icon?

Use typed company names only when no icon exists for that brand in the icon set. Do not substitute text logos as a stylistic choice, and do not hotlink random logo images found through search results.