SAFI, go to homepage
3-Month Free Trial

Brand assets

These are the logo files, icons, and colors currently used on SAFI.pk.

Open brand assets

These are the logo files, icons, and colors currently used on SAFI.pk.

Download all (ZIP)

This repository has no separate brand-rules document. Do not stretch the mark. Use the light-background file on a light surface and the dark-background file on a dark surface.

Logos for light backgrounds

Icon, light background

Icon, light background

PNG and WebP links are the original files, at the sizes written on the buttons. SVG is a real vector file. No extra PNG was generated from it.

Stacked logo, light background

Stacked logo, light background

PNG and WebP links are the original files, at the sizes written on the buttons. SVG is a real vector file. No extra PNG was generated from it.

Monochrome logo, light background

Monochrome logo, light background

PNG and WebP links are the original files, at the sizes written on the buttons. SVG is a real vector file. No extra PNG was generated from it.

Logos for dark backgrounds

Icon, dark background

Icon, dark background

PNG and WebP links are the original files, at the sizes written on the buttons. SVG is a real vector file. No extra PNG was generated from it.

Stacked logo, dark background

Stacked logo, dark background

PNG and WebP links are the original files, at the sizes written on the buttons. SVG is a real vector file. No extra PNG was generated from it.

Monochrome logo, dark background

Monochrome logo, dark background

PNG and WebP links are the original files, at the sizes written on the buttons. SVG is a real vector file. No extra PNG was generated from it.

Icons and favicons

Color palette

Taken from the site stylesheet: the @theme defaults, then the :root and .dark overrides where a token changes. Tokens that share one value are listed together.

  • Black

    @theme --color-safi-black, --color-safi-charcoal, --color-brand-primary, --color-brand-secondary, --color-action-primary, --color-header-blue

  • White

    @theme --color-safi-white, --color-surface-white

  • Neutral dark

    @theme --color-safi-neutral-dark

  • Elevated

    @theme --color-safi-elevated, --color-brand-action, --color-card-dark

  • Gray

    @theme --color-safi-gray, --color-trust-blue, --color-feedback-error, --color-feedback-info

  • Border

    @theme --color-safi-border

  • Surface

    @theme --color-safi-surface, --color-surface-light

  • Muted

    @theme --color-feedback-success

  • Warning gray

    @theme --color-feedback-warning

  • Border dark

    @theme --color-border-dark

  • Header raised, light

    :root --color-header-raised

  • Header line, light

    :root --color-header-line

  • Header line, dark

    .dark --color-header-line

  • Dark mode primary text

    .dark --color-brand-primary, --color-action-primary

  • Dark mode action

    .dark --color-brand-action, --color-trust-blue

Not included

  • public/Favicons/ (root) and public/Favicons/v2/ — Older favicon sets. The live set is public/Favicons/v3.
  • public/images/svg, png, and components/safi-concept1-* — Concept drafts, not the current logo.
  • public/images/logo.svg, logo-blue.svg, logo-ur.svg, logo.webp, and public/logo.webp — Earlier logo files. The owner-supplied lockups are in Logo/v3.
  • public/images/blog/** and public/images/pakish-office-team-1.webp — Editorial photos, not brand marks.
  • public/og/default.png — Social preview image, not a logo download.
  • public/next.svg, window.svg, globe.svg, file.svg — Framework sample icons.
  • public/rdp-hero.webp and other page art — Page imagery, not a brand asset.
  • public/pm/qr/*.png — Payment QR codes. They are not logos.

Technical Support