Brand guidelines

Glitchpad

Start here

Brand essentials

Name and relationship

Approved name: Glitchpad

Relationship: A ShruggieTech project

Visual signatures

Mark: The rectangular paper and G share one protected construction inside a permanent square. On dark surfaces the square is sulfur with a charcoal page; on light surfaces the square is charcoal with a sulfur page. The slate fold stays consistent across both contexts.

Color: Near-black surfaces keep controls visually secondary to file content. Pure sulfur provides identity, focus, and selection; cool slate supplies the fold and subdued states. Muddy and darkened yellows are prohibited.

Type: Display Space Grotesk; body Geist; mono Geist Mono. See colors and type details.

Where each asset belongs

Use the delivered logo and mark files for their declared surfaces and sizes. The asset catalog lists each verified variant and download. The color and type sections give exact values.

The reduced mark takes over at and below 32 px.

Usage limits

Keep the delivered artwork geometry unchanged.

  • Do not detach the G from the paper into a separate glyph.
  • Always keep the rectangular paper-and-G construction inside its permanent square enclosure.
  • Use the approved contextual inversion: sulfur square on dark surfaces and charcoal square with sulfur paper on light surfaces.
  • Never use muddy or darkened yellow variants in the Glitchpad identity.
  • Do not add fragments, scan lines, glow, bevel, texture, or motion effects.
  • Do not alter the 720 by 900 paper, 70-unit G channel, 70-unit inset, or safe square composition.
Implementation authority

Exact kit facts

This brand starts with shared ShruggieTech interface rules while keeping its own approved identity. The current hosted documentation facts (JSON) declare schema version 1 and documentation contract version 1.2.0. In a downloaded kit, enforcement/documentation-facts.json governs those pinned bytes.

Interface overrides

No brand-specific interface overrides are declared. Use the delivered binding and its default rules.

Versions

canon version
2.0.0
interface canon version
1.0.1
component recipe version
1.1.0
web react adapter version
1.1.0
egui adapter version
1.0.2
wordpress adapter version
1.0.0
compiler version
3.0.1
brand version
1.2.1

Implementation files

  • interface canon: enforcement/interface-canon.json
  • component recipes: enforcement/component-recipes.json
  • web adapter: web/adapter.json
  • web support matrix: web/support-matrix.json
  • egui adapter: native/egui/adapter.json
  • egui support matrix: native/egui/support-matrix.json
  • wordpress adapter: wordpress/adapter.json
  • wordpress support matrix: wordpress/support-matrix.json
  • wordpress theme zip: wordpress/glitchpad-stbb-theme.zip

The registry catalog lists installable theme and component resources; select a resource for the consuming host rather than treating the catalog as an installed component.

Color

Formal identity colors and interface cues

Identity accent hue 96.2 in OKLCH. Palette selection is independent of ownership and sibling hues.

Formal identity colors

These approved source values belong to marks and brand applications. A color used in artwork is not automatically a warning or action cue.

ColorHEXSourceUse
Glitchpad yellow#FFD900brand.accent.brightPrimary frame and identity applications
Mark accent#667788brand.logo.role_colors.color.accentApproved internal mark accent

Approved combinations

ApplicationFormal colorsArtworkUse
Glitchpad markprimary, mark-accentlogo.fullSulfur frame with the approved internal accent

Correct: use Glitchpad yellow (#FFD900) in its approved identity application; pair the Warning cue (#FF5300) with warning text and icon. Misuse: a lone identity swatch as the only warning signal.

Interface cues on dark surfaces

Use words, icons, outlines, or state attributes with color. A shared HEX value does not merge identity and interface roles.

CueHEXMeaningMeasured pairingNon-color cue
Action#C24000Primary interactive action#C24000 with #FFFFFF text (5.21:1); 3.75:1 against #0B0C0DA descriptive button or link label
Warning#FF5300Attention or recoverable risk#FF5300 with #000000 text (6.49:1); 6.05:1 against #0B0C0DWarning text and icon
Error#E9505FFailure or destructive action#E9505F with #000000 text (5.78:1); 5.39:1 against #0B0C0DError text and icon
Success#FFD900Completed operation#FFD900 with #000000 text (15.18:1); 14.15:1 against #0B0C0DSuccess text and icon
Information#667788Neutral information or help#667788 with #FFFFFF text (4.61:1); 4.25:1 against #0B0C0DInformation label and icon
Focus#FFD900Keyboard focus ring#FFD900 with #000000 text (15.18:1); 14.15:1 against #0B0C0DVisible outline and keyboard focus order
Selection#FFD900Selected control or item#FFD900 with #000000 text (15.18:1); 14.15:1 against #0B0C0DSelected label or checked state
Disabled#667788Unavailable control#667788 with #FFFFFF text (4.61:1); 4.25:1 against #0B0C0DDisabled attribute and text

Interface cues on light surfaces

Use words, icons, outlines, or state attributes with color. A shared HEX value does not merge identity and interface roles.

CueHEXMeaningMeasured pairingNon-color cue
Action#C24000Primary interactive action#C24000 with #FFFFFF text (5.21:1); 4.90:1 against #F8F8F6A descriptive button or link label
Warning#C24000Attention or recoverable risk#C24000 with #FFFFFF text (5.21:1); 4.90:1 against #F8F8F6Warning text and icon
Error#C0293AFailure or destructive action#C0293A with #FFFFFF text (5.80:1); 5.46:1 against #F8F8F6Error text and icon
Success#0B0C0DCompleted operation#0B0C0D with #FFFFFF text (19.58:1); 18.41:1 against #F8F8F6Success text and icon
Information#0B0C0DNeutral information or help#0B0C0D with #FFFFFF text (19.58:1); 18.41:1 against #F8F8F6Information label and icon
Focus#0B0C0DKeyboard focus ring#0B0C0D with #FFFFFF text (19.58:1); 18.41:1 against #F8F8F6Visible outline and keyboard focus order
Selection#0B0C0DSelected control or item#0B0C0D with #FFFFFF text (19.58:1); 18.41:1 against #F8F8F6Selected label or checked state
Disabled#667788Unavailable control#667788 with #FFFFFF text (4.61:1); 4.33:1 against #F8F8F6Disabled attribute and text

HEX uses uppercase pairs; sRGB uses integer 0-255 channels; HSL uses degrees and percentages rounded to one decimal; OKLCH uses four decimals for lightness and chroma plus one for hue; CIELAB uses D50 with lightness as a percentage and two decimals per channel.

Dark palette

background

Color values
#0B0C0D
rgb(11 12 13)
hsl(210.0 8.3% 4.7%)
oklch(0.1536 0.0027 248.0)
lab(3.27% -0.18 -0.54) (D50)

CMYK: output profile required

foreground, card-foreground, popover-foreground, secondary-foreground, accent-foreground, sidebar-foreground, sidebar-accent-foreground, brand-cta-foreground, brand-cta-outline-foreground

Color values
#FFFFFF
rgb(255 255 255)
hsl(0.0 0.0% 100.0%)
oklch(1.0000 0.0000 0.0)
lab(100.00% 0.00 0.00) (D50)

CMYK: output profile required

card

Color values
#121416
rgb(18 20 22)
hsl(210.0 10.0% 7.8%)
oklch(0.1899 0.0051 248.1)
lab(6.18% -0.50 -1.59) (D50)

CMYK: output profile required

popover, sidebar

Color values
#090A0B
rgb(9 10 11)
hsl(210.0 10.0% 3.9%)
oklch(0.1440 0.0028 247.1)
lab(2.70% -0.17 -0.49) (D50)

CMYK: output profile required

primary, ring, sidebar-primary, sidebar-ring

Color values
#FFD900
rgb(255 217 0)
hsl(51.1 100.0% 50.0%)
oklch(0.8907 0.1833 96.2)
lab(87.96% 1.95 86.88) (D50)

CMYK: output profile required

primary-foreground, sidebar-primary-foreground

Color values
#000000
rgb(0 0 0)
hsl(0.0 0.0% 0.0%)
oklch(0.0000 0.0000 0.0)
lab(0.00% 0.00 0.00) (D50)

CMYK: output profile required

secondary, muted

Color values
#151719
rgb(21 23 25)
hsl(210.0 8.7% 9.0%)
oklch(0.2033 0.0051 248.1)
lab(7.59% -0.56 -1.76) (D50)

CMYK: output profile required

muted-foreground

Color values
#9A9A9A
rgb(154 154 154)
hsl(0.0 0.0% 60.4%)
oklch(0.6862 0.0000 0.0)
lab(63.60% 0.00 0.00) (D50)

CMYK: output profile required

accent, sidebar-accent

Color values
#181A1D
rgb(24 26 29)
hsl(216.0 9.4% 10.4%)
oklch(0.2169 0.0066 258.4)
lab(9.14% -0.37 -2.44) (D50)

CMYK: output profile required

destructive

Color values
#E9505F
rgb(233 80 95)
hsl(354.1 77.7% 61.4%)
oklch(0.6437 0.1882 18.6)
lab(56.66% 60.52 26.02) (D50)

CMYK: output profile required

border, input, sidebar-border

Color values
#262626
rgb(38 38 38)
hsl(0.0 0.0% 14.9%)
oklch(0.2686 0.0000 0.0)
lab(15.16% -0.00 0.00) (D50)

CMYK: output profile required

chart-1

Color values
#9D8500
rgb(157 133 0)
hsl(50.8 100.0% 30.8%)
oklch(0.6203 0.1277 96.3)
lab(56.40% 1.27 60.50) (D50)

CMYK: output profile required

chart-2

Color values
#D55C1A
rgb(213 92 26)
hsl(21.2 78.2% 46.9%)
oklch(0.6193 0.1686 44.1)
lab(54.59% 46.45 57.72) (D50)

CMYK: output profile required

chart-3

Color values
#1DA046
rgb(29 160 70)
hsl(138.8 69.3% 37.1%)
oklch(0.6192 0.1683 148.2)
lab(57.89% -49.88 36.28) (D50)

CMYK: output profile required

chart-4

Color values
#CE5390
rgb(206 83 144)
hsl(330.2 55.7% 56.7%)
oklch(0.6195 0.1679 352.3)
lab(53.63% 53.94 -7.93) (D50)

CMYK: output profile required

chart-5

Color values
#00999F
rgb(0 153 159)
hsl(182.3 100.0% 31.2%)
oklch(0.6206 0.1055 199.7)
lab(57.01% -33.10 -13.37) (D50)

CMYK: output profile required

brand-accent-deep

Color values
#667788
rgb(102 119 136)
hsl(210.0 14.3% 46.7%)
oklch(0.5615 0.0333 248.4)
lab(49.10% -3.45 -11.54) (D50)

CMYK: output profile required

brand-emphasis

Color values
#FF5300
rgb(255 83 0)
hsl(19.5 100.0% 50.0%)
oklch(0.6738 0.2190 38.3)
lab(60.29% 64.46 71.50) (D50)

CMYK: output profile required

brand-cta

Color values
#C24000
rgb(194 64 0)
hsl(19.8 100.0% 38.0%)
oklch(0.5519 0.1759 39.3)
lab(46.55% 51.32 58.37) (D50)

CMYK: output profile required

Light palette

background

Color values
#F8F8F6
rgb(248 248 246)
hsl(60.0 12.5% 96.9%)
oklch(0.9786 0.0026 106.4)
lab(97.54% -0.26 0.96) (D50)

CMYK: output profile required

foreground, card-foreground, popover-foreground, secondary-foreground, accent-foreground, sidebar-foreground, sidebar-accent-foreground

Color values
#0A0A0A
rgb(10 10 10)
hsl(0.0 0.0% 3.9%)
oklch(0.1448 0.0000 0.0)
lab(2.74% 0.00 0.00) (D50)

CMYK: output profile required

card, popover, primary-foreground, sidebar, sidebar-primary-foreground, brand-cta-foreground

Color values
#FFFFFF
rgb(255 255 255)
hsl(0.0 0.0% 100.0%)
oklch(1.0000 0.0000 0.0)
lab(100.00% 0.00 0.00) (D50)

CMYK: output profile required

primary, ring, sidebar-primary, sidebar-ring

Color values
#0B0C0D
rgb(11 12 13)
hsl(210.0 8.3% 4.7%)
oklch(0.1536 0.0027 248.0)
lab(3.27% -0.18 -0.54) (D50)

CMYK: output profile required

secondary, muted, accent, sidebar-accent

Color values
#F0EFED
rgb(240 239 237)
hsl(40.0 9.1% 93.5%)
oklch(0.9523 0.0029 84.6)
lab(94.48% 0.08 1.09) (D50)

CMYK: output profile required

muted-foreground

Color values
#6B6B6B
rgb(107 107 107)
hsl(0.0 0.0% 42.0%)
oklch(0.5278 0.0000 0.0)
lab(45.22% 0.00 0.00) (D50)

CMYK: output profile required

destructive

Color values
#C0293A
rgb(192 41 58)
hsl(353.2 64.8% 45.7%)
oklch(0.5308 0.1857 20.9)
lab(43.62% 59.48 30.04) (D50)

CMYK: output profile required

border, input, sidebar-border

Color values
#888887
rgb(136 136 135)
hsl(60.0 0.4% 53.1%)
oklch(0.6264 0.0015 106.4)
lab(56.68% -0.15 0.54) (D50)

CMYK: output profile required

chart-1

Color values
#393B3C
rgb(57 59 60)
hsl(200.0 2.6% 22.9%)
oklch(0.3508 0.0032 228.9)
lab(24.70% -0.71 -0.93) (D50)

CMYK: output profile required

chart-2

Color values
#393B3B
rgb(57 59 59)
hsl(180.0 1.7% 22.7%)
oklch(0.3504 0.0027 197.0)
lab(24.67% -0.88 -0.31) (D50)

CMYK: output profile required

chart-3

Color values
#3B3A3C
rgb(59 58 60)
hsl(270.0 1.7% 23.1%)
oklch(0.3502 0.0037 308.3)
lab(24.58% 0.79 -1.08) (D50)

CMYK: output profile required

chart-4

Color values
#3A3B3A
rgb(58 59 58)
hsl(120.0 0.9% 22.9%)
oklch(0.3510 0.0022 145.5)
lab(24.74% -0.61 0.46) (D50)

CMYK: output profile required

chart-5

Color values
#3C3A3B
rgb(60 58 59)
hsl(330.0 1.7% 23.1%)
oklch(0.3508 0.0032 345.4)
lab(24.65% 1.06 -0.30) (D50)

CMYK: output profile required

brand-accent-deep

Color values
#667788
rgb(102 119 136)
hsl(210.0 14.3% 46.7%)
oklch(0.5615 0.0333 248.4)
lab(49.10% -3.45 -11.54) (D50)

CMYK: output profile required

brand-emphasis, brand-cta, brand-cta-outline-foreground

Color values
#C24000
rgb(194 64 0)
hsl(19.8 100.0% 38.0%)
oklch(0.5519 0.1759 39.3)
lab(46.55% 51.32 58.37) (D50)

CMYK: output profile required

Light surfaces

The bright accent #FFD900 measures 1.3:1 on the light reading surface and is never text there. The light block substitutes #0B0C0D at 18.41:1. The legal foreground on an accent fill is #000000 at 15.18:1.

Theme reference

Dark and light examples

Chart colors serve data visualization. Each is derived from the accent and measured against its surface. Use labels or shapes so chart meaning does not depend on hue alone.

Dark

Heading and controls

Body text on the generated dark surface.

Light

Heading and controls

Body text on the generated light surface.

Type and components

Space Grotesk, Geist, Geist Mono

Display
Heading

Body in Geist at 400. Approved weights are display 500, 700, body 400, 500, and mono 400. Undeclared weights are prohibited.

0O 1lI 8B 5S 2Z
Components
ok warn fail
tokenvalue
radius6 / 8 / 12 / 16
spacing4 8 12 16 24 32 48 64
focus2px ring, 2px offset
Delivery

Complete asset catalog

A brand mark is the symbol alone; a logo lockup combines approved elements. Wide and stacked layouts are separate designs. Full and reduced identify source detail. Full color or monochrome identifies ink treatment. A clear background is transparent; for light or dark names the intended viewing surface. Social share images are separate opaque compositions. Preferred descriptive filenames and existing paths contain the same approved artwork. Full asset glossary.

Canvas 1000 × 1000 units, clear space 50 units (5.6 percent of artwork width). Below 32 px the reduced master takes over.

Fixed lockup proportions

lockupmark heightgapalignment
horizontal160 units34 unitsoptical center
stacked1.80C0.45Ccentered on wordmark ink width

The delivered square keeps 50 units of external clear space on every side. The protected inner page retains its 70-unit G channel; that internal measurement is not the external clear-space requirement. Never resize the mark and wordmark independently.

Compatibility aliases are listed with their canonical delivery group; byte-identical aliases do not create duplicate previews.

Integration instructions

Read the instructions for each platform before installing its assets.

Stacked logo lockup, full color, for dark backgrounds

Dark surfaceGlitchpad Stacked logo lockup, full color, for dark backgrounds preview

Use the declared lockup form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Stacked logo lockup, full color, for light backgrounds

Light surfaceGlitchpad Stacked logo lockup, full color, for light backgrounds preview

Use the declared lockup form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Stacked logo lockup, monochrome white ink, for dark backgrounds

Light surfaceGlitchpad Stacked logo lockup, monochrome white ink, for dark backgrounds preview

Use the declared lockup form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Stacked logo lockup, monochrome black ink, for light backgrounds

Light surfaceGlitchpad Stacked logo lockup, monochrome black ink, for light backgrounds preview

Use the declared lockup form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Wide logo lockup, full color, for dark backgrounds

Dark surfaceGlitchpad Wide logo lockup, full color, for dark backgrounds preview

Use the declared lockup form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Wide logo lockup, full color, for light backgrounds

Light surfaceGlitchpad Wide logo lockup, full color, for light backgrounds preview

Use the declared lockup form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Wide logo lockup, monochrome white ink, for dark backgrounds

Light surfaceGlitchpad Wide logo lockup, monochrome white ink, for dark backgrounds preview

Use the declared lockup form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Wide logo lockup, monochrome black ink, for light backgrounds

Light surfaceGlitchpad Wide logo lockup, monochrome black ink, for light backgrounds preview

Use the declared lockup form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Full brand mark, full color, for dark backgrounds

Light surfaceGlitchpad Full brand mark, full color, for dark backgrounds preview

Use the declared mark form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Reduced brand mark, full color, for dark backgrounds

Light surfaceGlitchpad Reduced brand mark, full color, for dark backgrounds preview

Use the declared mark form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Full brand mark, full color, for light backgrounds

Light surfaceGlitchpad Full brand mark, full color, for light backgrounds preview

Use the declared mark form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Reduced brand mark, full color, for light backgrounds

Light surfaceGlitchpad Reduced brand mark, full color, for light backgrounds preview

Use the declared mark form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Full brand mark, monochrome white ink, for dark backgrounds

Light surfaceGlitchpad Full brand mark, monochrome white ink, for dark backgrounds preview

Use the declared mark form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Reduced brand mark, monochrome white ink, for dark backgrounds

Light surfaceGlitchpad Reduced brand mark, monochrome white ink, for dark backgrounds preview

Use the declared mark form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Full brand mark, monochrome black ink, for light backgrounds

Light surfaceGlitchpad Full brand mark, monochrome black ink, for light backgrounds preview

Use the declared mark form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Reduced brand mark, monochrome black ink, for light backgrounds

Light surfaceGlitchpad Reduced brand mark, monochrome black ink, for light backgrounds preview

Use the declared mark form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Wordmark, full color, for dark backgrounds

Dark surfaceGlitchpad Wordmark, full color, for dark backgrounds preview

Use the declared wordmark form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Wordmark, full color, for light backgrounds

Light surfaceGlitchpad Wordmark, full color, for light backgrounds preview

Use the declared wordmark form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Wordmark, monochrome white ink, for dark backgrounds

Dark surfaceGlitchpad Wordmark, monochrome white ink, for dark backgrounds preview

Use the declared wordmark form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Wordmark, monochrome black ink, for light backgrounds

Light surfaceGlitchpad Wordmark, monochrome black ink, for light backgrounds preview

Use the declared wordmark form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

Windows target size, for dark backgrounds

Light surfaceGlitchpad Windows target size, for dark backgrounds preview

Use the declared target-size form on compatible backgrounds. Smallest delivered raster: 36 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

Windows target size, for dark backgrounds

Light surfaceGlitchpad Windows target size, for dark backgrounds preview

Use the declared target-size form on compatible backgrounds. Smallest delivered raster: 16 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

Windows target size, for light backgrounds

Light surfaceGlitchpad Windows target size, for light backgrounds preview

Use the declared target-size form on compatible backgrounds. Smallest delivered raster: 36 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

Windows target size, for light backgrounds

Light surfaceGlitchpad Windows target size, for light backgrounds preview

Use the declared target-size form on compatible backgrounds. Smallest delivered raster: 16 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

Android adaptive foreground

Light surfaceGlitchpad Android adaptive foreground preview

Use the declared adaptive-foreground form on compatible backgrounds. Smallest delivered raster: 432 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

Android adaptive monochrome

Dark surfaceGlitchpad Android adaptive monochrome preview

Use the declared adaptive-monochrome form on compatible backgrounds. Smallest delivered raster: 432 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

Android adaptive background

Dark surface
XML metadata (no image preview)

Use the declared adaptive-background form on compatible backgrounds. Use the declared container or vector at its listed destination. Preserve declared plate and transparency behavior.

Android adaptive declaration

Dark surface
XML metadata (no image preview)

Use the declared adaptive-declaration form on compatible backgrounds. Use the declared container or vector at its listed destination. Preserve declared plate and transparency behavior.

  • ic_launcher.xmlExisting path · container or metadata · XML · Android res/mipmap-anydpi-v26

Android color resource

Dark surface
XML metadata (no image preview)

Use the declared color-resource form on compatible backgrounds. Use the declared container or vector at its listed destination. Preserve declared plate and transparency behavior.

Android platform manifest

Dark surface
JSON metadata (no image preview)

Use the declared platform-manifest form on compatible backgrounds. Use the declared container or vector at its listed destination. Preserve declared plate and transparency behavior.

  • manifest.jsonExisting path · container or metadata · JSON · See suite README

iOS asset catalog

Dark surface
JSON metadata (no image preview)

Use the declared asset-catalog form on compatible backgrounds. Use the declared container or vector at its listed destination. Preserve declared plate and transparency behavior.

  • Contents.jsonExisting path · container or metadata · JSON · Xcode AppIcon.appiconset

iOS platform manifest

Dark surface
JSON metadata (no image preview)

Use the declared platform-manifest form on compatible backgrounds. Use the declared container or vector at its listed destination. Preserve declared plate and transparency behavior.

  • manifest.jsonExisting path · container or metadata · JSON · See suite README

macOS asset catalog

Dark surface
JSON metadata (no image preview)

Use the declared asset-catalog form on compatible backgrounds. Use the declared container or vector at its listed destination. Preserve declared plate and transparency behavior.

  • Contents.jsonExisting path · container or metadata · JSON · Xcode AppIcon.appiconset

macOS platform manifest

Dark surface
JSON metadata (no image preview)

Use the declared platform-manifest form on compatible backgrounds. Use the declared container or vector at its listed destination. Preserve declared plate and transparency behavior.

  • manifest.jsonExisting path · container or metadata · JSON · See suite README

Web icon index

Dark surface
JSON metadata (no image preview)

Use the declared icon-index form on compatible backgrounds. Use the declared container or vector at its listed destination. Preserve declared plate and transparency behavior.

Web platform manifest

Dark surface
JSON metadata (no image preview)

Use the declared platform-manifest form on compatible backgrounds. Use the declared container or vector at its listed destination. Preserve declared plate and transparency behavior.

  • manifest.jsonExisting path · container or metadata · JSON · See suite README

Web web manifest

Dark surface
JSON metadata (no image preview)

Use the declared web-manifest form on compatible backgrounds. Use the declared container or vector at its listed destination. Preserve declared plate and transparency behavior.

  • site.webmanifestExisting alias · container or metadata · JSON · Compatibility alias for icons/web/site.webmanifest
  • site.webmanifestExisting path · container or metadata · JSON · Web root

Windows manifest fragment

Dark surface
XML metadata (no image preview)

Use the declared manifest-fragment form on compatible backgrounds. Use the declared container or vector at its listed destination. Preserve declared plate and transparency behavior.

Windows platform manifest

Dark surface
JSON metadata (no image preview)

Use the declared platform-manifest form on compatible backgrounds. Use the declared container or vector at its listed destination. Preserve declared plate and transparency behavior.

  • manifest.jsonExisting path · container or metadata · JSON · See suite README

iOS app icon, opaque background, for dark backgrounds

Light surfaceGlitchpad iOS app icon, opaque background, for dark backgrounds preview

Use the declared app-icon form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

iOS app icon, opaque background, for light backgrounds

Dark surfaceGlitchpad iOS app icon, opaque background, for light backgrounds preview

Use the declared app-icon form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

Android legacy launcher, opaque background

Light surfaceGlitchpad Android legacy launcher, opaque background preview

Use the declared legacy-launcher form on compatible backgrounds. Smallest delivered raster: 48 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

  • ic_launcher.pngExisting path · 72 × 72 · PNG · Android res/mipmap-hdpi
  • ic_launcher.pngExisting path · 48 × 48 · PNG · Android res/mipmap-mdpi
  • ic_launcher.pngExisting path · 96 × 96 · PNG · Android res/mipmap-xhdpi
  • ic_launcher.pngExisting path · 144 × 144 · PNG · Android res/mipmap-xxhdpi
  • ic_launcher.pngExisting path · 192 × 192 · PNG · Android res/mipmap-xxxhdpi

Android play store, opaque background

Light surfaceGlitchpad Android play store, opaque background preview

Use the declared play-store form on compatible backgrounds. Smallest delivered raster: 512 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

iOS app icon, opaque background

Light surfaceGlitchpad iOS app icon, opaque background preview

Use the declared app-icon form on compatible backgrounds. Smallest delivered raster: 1024 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

  • AppIcon-1024.pngExisting path · 1024 × 1024 · PNG · Xcode AppIcon.appiconset

macOS app icon, opaque background

Light surfaceGlitchpad macOS app icon, opaque background preview

Use the declared asset-catalog-icon form on compatible backgrounds. Smallest delivered raster: 16 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

Web favicon ico, opaque background

Dark surface
Icon container (no image preview)

Use the declared favicon-ico form on compatible backgrounds. Use the declared container or vector at its listed destination. Preserve declared plate and transparency behavior.

  • favicon.icoExisting alias · embedded: 16 × 16, 24 × 24, 32 × 32, 48 × 48, 64 × 64, 128 × 128, 256 × 256 · ICO · Compatibility alias for icons/web/favicon.ico
  • favicon.icoExisting path · embedded: 16 × 16, 24 × 24, 32 × 32, 48 × 48, 64 × 64, 128 × 128, 256 × 256 · ICO · Web root

Web maskable, opaque background

Light surfaceGlitchpad Web maskable, opaque background preview

Use the declared maskable form on compatible backgrounds. Smallest delivered raster: 192 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

Web icon, full detail, opaque background

Light surfaceGlitchpad Web icon, full detail, opaque background preview

Use the declared favicon form on compatible backgrounds. Smallest delivered raster: 48 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

Web icon, reduced detail, opaque background

Light surfaceGlitchpad Web icon, reduced detail, opaque background preview

Use the declared favicon form on compatible backgrounds. Smallest delivered raster: 16 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

  • favicon-16x16.pngExisting alias · 16 × 16 · PNG · Compatibility alias for icons/web/favicon-16x16.png
  • favicon-24x24.pngExisting alias · 24 × 24 · PNG · Compatibility alias for icons/web/favicon-24x24.png
  • favicon-32x32.pngExisting alias · 32 × 32 · PNG · Compatibility alias for icons/web/favicon-32x32.png
  • favicon.svgExisting alias · 512 × 512 · SVG · Compatibility alias for icons/web/favicon.svg
  • favicon-16x16.pngExisting path · 16 × 16 · PNG · Web root
  • favicon-24x24.pngExisting path · 24 × 24 · PNG · Web root
  • favicon-32x32.pngExisting path · 32 × 32 · PNG · Web root
  • favicon.svgExisting path · 512 × 512 · SVG · Web root or document icon link

Windows classic ico, opaque background

Dark surface
Icon container (no image preview)

Use the declared classic-ico form on compatible backgrounds. Use the declared container or vector at its listed destination. Preserve declared plate and transparency behavior.

  • app.icoExisting path · embedded: 16 × 16, 24 × 24, 32 × 32, 48 × 48, 64 × 64, 128 × 128, 256 × 256 · ICO · Win32 application

Windows msix scale, opaque background

Light surfaceGlitchpad Windows msix scale, opaque background preview

Use the declared msix-scale form on compatible backgrounds. Smallest delivered raster: 44 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

Windows store logo, opaque background

Light surfaceGlitchpad Windows store logo, opaque background preview

Use the declared store-logo form on compatible backgrounds. Smallest delivered raster: 50 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

Windows target size, opaque background

Light surfaceGlitchpad Windows target size, opaque background preview

Use the declared target-size form on compatible backgrounds. Smallest delivered raster: 36 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

Windows target size, opaque background

Light surfaceGlitchpad Windows target size, opaque background preview

Use the declared target-size form on compatible backgrounds. Smallest delivered raster: 16 px. Do not synthesize missing sizes. Preserve declared plate and transparency behavior.

Social share image, full color, dark background

Dark surfaceGlitchpad Social share image, full color, dark background preview

Use the declared social-image form on compatible backgrounds. Smallest delivered raster: 1280 px. Do not synthesize missing sizes. Follow the clear-space and reduction threshold above.

A ShruggieTech project