# JoyerosApp brand kit

Your supplied vector artwork is the master. The wordmark is outlined paths, so it needs no installed font. All logo/symbol SVGs are real vectors with no embedded raster images, external resources, or substituted lettering. Gold is exactly #EEAF00, taken from the originals. Black and white are original colors; all other colors and the heritage treatment are extensions created for this pack.

## Start here

- Open index.html for the offline asset gallery, color swatches, individual download links, and PNG sizes.
- Open JoyerosApp-brand-guide.pdf for the visual guide.
- Main full logo: svg/logos/joyeros-horizontal-primary-light.svg.
- Main reverse logo: svg/logos/joyeros-horizontal-primary-dark.svg.
- Main app artwork: svg/app-icons/joyeros-app-square-dark.svg.
- Original supplied files are preserved byte-for-byte in originals/.

## Asset variants

logos/: horizontal, stacked, and wordmark layouts. Each comes in primary-light (gold/black), primary-dark (gold/white), mono-black, mono-white, mono-gold, and heritage (muted #B8860B gold/ink).

symbols/: complete diamond + sparkle mark, diamond-only compact alternative, and isolated sparkle. The diamond-only option is for very small use; the complete mark remains the preferred identity. White assets are transparent and are intended for a dark surface.

app-icons/: light, dark, gold, and cream square backgrounds. These are the unmasked master files for app work. Store/launcher masters contain no baked corner rounding or outer shadow.

avatars/: circular images for profile pictures. previews/: rounded artwork for presentations and visual previews, separate from the store masters.

Transparent PNG exports:
- Horizontal logos: 309, 927, 1854, 3708 px wide.
- Stacked logos: 520, 1040, 2080 px wide.
- Wordmarks: 486, 972, 1944 px wide.
- Symbols: 32, 64, 128, 256, 512, 1024 px square.
- Square app options: 32, 48, 64, 128, 256, 512, 1024 px square, solid backgrounds.
- Avatars: 128, 256, 512, 1024 px square canvases with transparency outside the circle.
- Rounded previews: 256, 512, 1024 px with transparent corners.

## Apps and web

apps/ios/{dark,light,gold}/AppIcon.appiconset: three independent conventional iPhone/iPad catalogs with Contents.json and the referenced PNGs. Select one and copy it into your Xcode asset catalog; rename if another AppIcon exists. PNGs have no alpha channel. These are flat image asset catalogs, not layered Icon Composer projects.

apps/android/res: copy/merge into your Android app's res directory. Includes legacy launcher PNGs, a v26 adaptive icon, a v33 themed monochrome layer, vector foreground, and background color. In AndroidManifest.xml use android:icon="@mipmap/ic_launcher". Background is Ink; colored mark is Gold/White. Vector layers are 108dp with the mark 58.5dp wide within the central safe area. google-play-icon-512.png is a separate full-square sRGB store image.

web/: theme-aware SVG favicon, light/dark ICO alternatives, PNG favicons, a 180px Apple touch icon, and 192/512px regular and maskable PWA icons. The 16px favicon deliberately drops the sparkle for clarity. Default ICO/PNG favicons use the light-surface mark; use the dark ICO on a dark browser surface when serving a fixed theme. The SVG favicon adapts its sparkle to the browser color preference.

Copy the web/ contents to /brand/ for the provided head-snippet.html. Change start_url, theme_color, background_color, name, and paths in manifest.webmanifest to fit your app. The regular and maskable PWA files share safe, centered artwork. No account-specific URL or application bundle identifier is invented.

## Brand use

Use the horizontal logo for headers and documents; stacked for compact panels; wordmark when the diamond is already nearby. Use the symbol for avatars, launchers, and compact navigation. Keep proportions fixed. Use the light logo on white/cream and the dark logo on Ink/Black.

Suggested clear space is one-quarter of the diamond width around the full visible mark. Suggested minimums: horizontal logo 155px wide; stacked 130px; complete symbol 32px; diamond-only 16px. These are new practical recommendations for this pack, not historical brand rules.

Gold is an accent. Use Black/Ink text on Gold; White text on Ink; use Dark Gold #8A6500 for small gold-colored text on white. The original Gold on White has relatively low contrast; use it for the logo/accent artwork rather than small body text. Exact contrast ratios are in the PDF and colors table. Typography suggestion for product UI is the system sans-serif stack in tokens.css. The supplied logo's source font was not identified, and the logo outlines do not depend on that suggestion.

branding/: JSON palette, CSS tokens, GIMP .gpl palette, and source provenance. manifest.json / manifest.csv inventory each delivered asset with dimensions, color mode, and SHA-256. PNGs are exported in sRGB. CMYK/spot-color matching needs a print-specific proof; no exact metallic ink match is implied.

## Platform references checked 2026-10-12

- Android adaptive icon design: https://developer.android.com/develop/ui/compose/system/icon_design_adaptive
- Google Play icon specifications: https://developer.android.com/distribute/google-play/resources/icon-design-specifications
- Apple's conventional asset catalog format: https://developer.apple.com/library/archive/documentation/Xcode/Reference/xcode_ref-Asset_Catalog_Format/AppIconType.html

The artwork was checked for transparency, pixel dimensions, vector structure, referenced platform resources, and gallery file links. The catalogs/resources have not been compiled inside an Xcode or Gradle application.
