● SYSTEM ONLINE
Marks · Brand Asset Dossier

Directz

Outbound campaigns, sales motions and direct response experiences. This page defines how the mark should appear across product surfaces, browser chrome, documents and compact icon placements.

primary mark systemDirect outreach
Directz primary logo
Directz symbol
Directz dark preview
faviconfavicon.ico
3232px
6464px
180180px
512512px

Directz uses a shared z-family visual system: a red app tile, white initial symbol and dark navy wordmark. The system is built for product suites where every mark should feel related without becoming identical in use.

Primary MarkUse the full horizontal logo for headers, landing pages, presentation covers and formal brand moments.
Symbol SystemUse the square icon for app launchers, avatars, favicons, sidebar navigation and compact UI spaces.
Minimum SizeBelow small header sizes, switch from horizontal logo to icon. Do not force the wordmark into cramped areas.

The package separates vector identity files from raster app/browser assets. SVG should remain the default for crisp interface use; PNG and ICO files exist for browser, PWA and platform-specific requirements.

logo
logo.svgPrimary horizontal mark.Aç
icon
icon.svgVector app symbol.Aç
512
icon-512.pngLarge raster app icon.Aç
favicon
favicon.icoBrowser tab icon.Aç
Favicon SetUse favicon.ico for browser fallback, icon-32.png for small tabs, icon-180.png for Apple touch and icon-512.png for PWA surfaces.
Export GuidancePrefer SVG for UI and marketing pages. Use PNG where a platform requires fixed raster dimensions.
Web HeaderUse the horizontal logo on light navigation bars when there is enough width.
App SidebarUse the square symbol to avoid compressing the wordmark.
Email SignatureUse the horizontal logo at moderate size with generous whitespace.
Social AvatarUse the icon only; the wordmark will not stay readable in circular crops.
PDF / ProposalUse the primary mark on covers and the symbol in footers or section dividers.
Browser ChromeUse favicon.ico and 32px PNG for reliable tab rendering.
Lockup VariationsPrimary horizontal logo, standalone symbol, favicon set and large app icon are the approved lockups.
Background RulesUse the primary logo on clean light surfaces. For dark or busy surfaces, test contrast before handoff.

The mark should feel deliberate wherever it appears. Most failures come from forcing the horizontal wordmark into small spaces or changing the color system to match a random background.

Primary Tile#D83F3F
Wordmark#0C0C3F
Symbol Fill#FFFFFF
Do not stretchNever change the mark's horizontal or vertical proportion.
Do not recolorKeep the red tile, navy wordmark and white symbol unless a new approved variant is created.
Do not crowdLeave clearspace around the logo; do not attach it to page edges, cards or text blocks.
Do not decorateAvoid shadows, outlines, glows, gradients or effects on top of the mark.

Before delivery, verify that the favicon appears clearly in a real browser tab and that the icon remains sharp on retina/high-density screens.

Quality Checklist

Check contrast on light and dark surfaces, confirm icon dimensions, test favicon rendering, preserve file names and use the correct asset for each surface.

HTMLLink favicon.ico plus PNG touch icons where needed.
PWAUse 180px and 512px icons for app-like surfaces.
SVGUse logo.svg for scalable UI and marketing placements.