design-assets

Create and edit icons, favicons, images, and color palettes using AI generation, macOS tools, ImageMagick, and SVG for scalable graphics.

Security Scan

The skill's instructions roughly match a design-assets purpose, but there are clear mismatches and omissions (undeclared API key, undocumented macOS-only tools, and screenshot capability) that make its real runtime behavior unclear and potentially risky.

Purpose & Capability

The SKILL.md describes image generation (SkillBoss API), macOS-native tools (sips, screencapture) and ImageMagick. The registry metadata declares no required environment variables, no required binaries, and no OS restriction — but the instructions clearly require SKILLBOSS_API_KEY, macOS utilities, and magick. Those omissions are inconsistent with the stated purpose and deployment assumptions.

Instruction Scope

Runtime instructions include code that reads an environment variable SKILLBOSS_API_KEY and posts prompts/images to https://api.heybossai.com; they call screencapture (can record the user's screen) and run ImageMagick commands that will read and write files. The skill does not restrict what to capture or send, so it could transmit sensitive on-screen content to the external API. The instructions do not limit or justify access to system screenshots or other local data beyond normal design inputs.

Install Mechanism

This is instruction-only (no install spec), so nothing is written during install. However, the runtime requires external tools (ImageMagick's magick, macOS sips and screencapture). Those binaries are not declared in metadata and may not be present on non-macOS systems; absence will cause failures or ambiguous behavior.

Credentials

The SKILL.md uses a sensitive environment variable SKILLBOSS_API_KEY (Bearer token) but the skill metadata lists no required env vars or primary credential. Requesting an API key is proportionate to using an external AI image service, but the omission in metadata is a transparency problem. Because the code will send image data and potentially screenshots to an external endpoint, providing that API key could expose local content to an external service.

Persistence & Privilege

always is false (good) and autonomous invocation is allowed by default. Combined with the undeclared API key usage and the screencapture capability, autonomous runs could capture and transmit screen content without clear constraints. Consider this a higher-risk combination unless the user restricts invocation or reviews data flows.

What to consider before installing

Before installing, check these points: - The skill's SKILL.md expects an environment variable SKILLBOSS_API_KEY but the registry metadata does not declare it — the skill will ask for (and use) a Bearer API key to send prompts/images to https://api.heybossai.com. Only provide a key you trust and that has minimal privileges; prefer a dedicated key you can revoke. - The instructions assume macOS tools (sips, screencapture) and ImageMagick (magick) but the skill does not declare OS requirements or binaries. If you're not on macOS or don't have ImageMagick installed, the scripts will fail. - The SKILL.md includes screencapture usage. That can capture sensitive on-screen information which the skill could upload to the external API. If you are uncomfortable with that risk, do not install, or disable autonomous invocation and remove/deny screenshot commands. - Because there is no install spec, the skill will not put code on disk during install, but at runtime it will execute local commands and network calls per the instructions. Review the sample code and scripts to ensure they only act on files you expect. Recommended actions: require the skill owner to update metadata to declare SKILLBOSS_API_KEY and macOS/ImageMagick requirements, verify the external API provider/privacy policy, test in a restricted environment first (no sensitive data on screen), and consider disabling autonomous invocation or limiting the agent's network access until you trust the integration.

Create and edit graphic design assets: icons, favicons, images, and color systems.

Tool Selection

Task	Tool	Why
AI image generation	SkillBoss API Hub	Generate images from text prompts via /v1/pilot
Image resize/convert	sips	macOS native, fast, no deps
Advanced manipulation	ImageMagick	Compositing, effects, batch processing
Icons & logos	SVG	Scalable, small file size, editable
Screenshots	screencapture	macOS native

AI Image Generation

Use SkillBoss API Hub to generate images from text prompts:

import requests, os

SKILLBOSS_API_KEY = os.environ["SKILLBOSS_API_KEY"]
API_BASE = "https://api.heybossai.com/v1"

def pilot(body: dict) -> dict:
    r = requests.post(
        f"{API_BASE}/pilot",
        headers={"Authorization": f"Bearer {SKILLBOSS_API_KEY}", "Content-Type": "application/json"},
        json=body,
        timeout=60,
    )
    return r.json()

# Generate an image from a text prompt
result = pilot({"type": "image", "inputs": {"prompt": "A modern app icon with gradient background"}, "prefer": "quality"})
image_url = result["result"]["image_url"]
print(f"Generated image: {image_url}")

App Icon Generation

Generate all required sizes from a single 1024x1024 source icon.

iOS / macOS Icon Sizes

#!/bin/bash
# generate-app-icons.sh <source-1024.png> <output-dir>
SOURCE="$1"
OUTDIR="${2:-.}"
mkdir -p "$OUTDIR"

SIZES=(16 20 29 32 40 48 58 60 64 76 80 87 120 128 152 167 180 256 512 1024)
for SIZE in "${SIZES[@]}"; do
  sips -z $SIZE $SIZE "$SOURCE" --out "$OUTDIR/icon-${SIZE}x${SIZE}.png" 2>/dev/null
done
echo "Generated ${#SIZES[@]} icon sizes in $OUTDIR"

Android Icon Sizes

# Android adaptive icon sizes
declare -A ANDROID_SIZES=(
  ["mdpi"]=48 ["hdpi"]=72 ["xhdpi"]=96
  ["xxhdpi"]=144 ["xxxhdpi"]=192
)
for DENSITY in "${!ANDROID_SIZES[@]}"; do
  SIZE=${ANDROID_SIZES[$DENSITY]}
  mkdir -p "res/mipmap-$DENSITY"
  sips -z $SIZE $SIZE "$SOURCE" --out "res/mipmap-$DENSITY/ic_launcher.png"
done

Favicon Generation

#!/bin/bash
# generate-favicons.sh <source.png> <output-dir>
SOURCE="$1"
OUTDIR="${2:-.}"
mkdir -p "$OUTDIR"

# Standard web favicons
sips -z 16 16 "$SOURCE" --out "$OUTDIR/favicon-16x16.png"
sips -z 32 32 "$SOURCE" --out "$OUTDIR/favicon-32x32.png"
sips -z 180 180 "$SOURCE" --out "$OUTDIR/apple-touch-icon.png"
sips -z 192 192 "$SOURCE" --out "$OUTDIR/android-chrome-192x192.png"
sips -z 512 512 "$SOURCE" --out "$OUTDIR/android-chrome-512x512.png"

# ICO file (requires ImageMagick)
magick "$OUTDIR/favicon-16x16.png" "$OUTDIR/favicon-32x32.png" "$OUTDIR/favicon.ico"

echo "Favicons generated in $OUTDIR"

HTML Meta Tags

<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">

site.webmanifest

{
  "name": "My App",
  "short_name": "App",
  "icons": [
    { "src": "/android-chrome-192x192.png", "sizes": "192x192", "type": "image/png" },
    { "src": "/android-chrome-512x512.png", "sizes": "512x512", "type": "image/png" }
  ],
  "theme_color": "#ffffff",
  "background_color": "#ffffff",
  "display": "standalone"
}

Color Palette Generator

Given a primary color, generate a full palette:

// HSL-based palette generation
function generatePalette(hue, saturation = 70) {
  return {
    50:  `hsl(${hue}, ${saturation}%, 97%)`,
    100: `hsl(${hue}, ${saturation}%, 94%)`,
    200: `hsl(${hue}, ${saturation}%, 86%)`,
    300: `hsl(${hue}, ${saturation}%, 74%)`,
    400: `hsl(${hue}, ${saturation}%, 62%)`,
    500: `hsl(${hue}, ${saturation}%, 50%)`,  // Primary
    600: `hsl(${hue}, ${saturation}%, 42%)`,
    700: `hsl(${hue}, ${saturation}%, 34%)`,
    800: `hsl(${hue}, ${saturation}%, 26%)`,
    900: `hsl(${hue}, ${saturation}%, 18%)`,
    950: `hsl(${hue}, ${saturation}%, 10%)`,
  };
}

ImageMagick Quick Reference

# Resize
magick input.png -resize 800x600 output.png

# Convert format
magick input.png output.webp

# Add border
magick input.png -border 10 -bordercolor "#333" output.png

# Round corners (with transparency)
magick input.png \( +clone -alpha extract -draw "roundrectangle 0,0,%[w],%[h],20,20" \) -alpha off -compose CopyOpacity -composite output.png

# Composite / overlay
magick base.png overlay.png -gravity center -composite output.png

# Batch resize all PNGs
magick mogrify -resize 50% *.png

# Create solid color image
magick -size 1200x630 xc:"#1a1a2e" output.png

# Add text to image
magick input.png -gravity south -pointsize 24 -fill white -annotate +0+20 "Caption" output.png

sips Quick Reference (macOS)

# Resize (maintain aspect ratio)
sips --resampleWidth 800 input.png --out output.png

# Exact resize
sips -z 600 800 input.png --out output.png

# Convert format
sips -s format jpeg input.png --out output.jpg

# Get image info
sips -g all input.png

# Rotate
sips --rotate 90 input.png --out output.png