Icon Library

Browse and download Alterspective brand icons. All icons follow the outlined style per brand guidelines (ICON-001) and are available in SVG format.

Usage Guidelines

Do

  • Use outlined icons only (brand requirement)
  • Maintain consistent sizing within contexts
  • Use brand colors: Marine, Green, Navy
  • Ensure adequate spacing around icons

Don't

  • Never use filled icon styles
  • Don't stretch or distort icons
  • Avoid using icons without proper contrast
  • Don't add effects (shadows, glows)
Type to filter
7 icons | Showing all
Build icon

Build

actions
DL
buildconstructcreate

Use for building, constructing, or creating something new. Ideal for development actions, project creation, or assembly tasks.

Deploy icon

Deploy

actions
DL
deploylaunchrelease

Use for deployment, launching, or releasing products and features. Suitable for CI/CD workflows and production releases.

Design icon

Design

actions
DL
designcreateart

Use for design-related actions, creative processes, or visual work. Ideal for UI/UX design, prototyping, and creative tools.

Discover icon

Discover

actions
DL
discoverexploresearch

Use for discovery, exploration, or research activities. Suitable for search features, analytics, and investigative workflows.

Lightbulb icon

Lightbulb

concepts
DL
ideainsightinnovation

Use for ideas, insights, tips, or innovative concepts. Ideal for highlighting suggestions, AI-generated insights, or creative solutions.

Sustain icon

Sustain

concepts
DL
sustainmaintainsupport

Use for sustainability, maintenance, or continuous improvement. Suitable for lifecycle management and long-term support indicators.

Validate icon

Validate

actions
DL
validateverifycheck

Use for validation, verification, or confirmation actions. Ideal for quality assurance, test results, and approval workflows.

Implementation

HTML

<img src="/icons/Alterspective Icon FA (build).svg"
     alt="Build icon"
     width="24"
     height="24" />

CSS Background

.icon-build {
  width: 24px;
  height: 24px;
  background-image: url('/icons/Alterspective Icon FA (build).svg');
  background-size: contain;
  background-repeat: no-repeat;
}

React / Next.js

import Image from 'next/image';

<Image
  src="/icons/Alterspective Icon FA (build).svg"
  alt="Build icon"
  width={24}
  height={24}
/>

AI / MCP Integration

Icons can be searched programmatically via the MCP server:

MCP Tool: search_icons

// Example: Find icons for "deploy" functionality
const result = await mcp.callTool('search_icons', {
  query: 'deploy',
  category: 'actions',
  limit: 5
});

// Returns:
// {
//   icons: [{ id: 'icon-deploy', name: 'Deploy', ... }],
//   total: 1
// }
Style
Theme