showesy

Brand & design system

The Showesy brand.

Our logo, colours, type and icons, and the surfaces that make every Showesy screen feel the same: elevation instead of borders, glass for depth and organic shapes for art.

showesy

Create. Publish. Show.From idea to screen.

Brand message

Create content. Publish it. Show it.

From idea to screen.

Showesy removes the complexity between an idea and a screen. Create, manage and publish visual content, all in one place, and soon with AI that follows your brand.

Logo. One S, on every surface.

  • showesy

    Primary logo

    The gradient S with the wordmark, on light backgrounds.

  • showesy

    On dark

    The same logo with a white wordmark, on ink and dark images.

  • showesy

    Monochrome

    Ink only, for one-colour print and embossing.

  • showesy

    Monochrome, white

    White only, on dark or busy backgrounds.

  • Simplified icon

    A flat S for favicons and very small sizes.

  • App icon

    The S on an ink tile, for the app and the home screen.

Colour. Purple, pink and orange on ink and cloud.

  • Showesy Purple#6D4AFFPrimary
  • Showesy Pink#E85AADSecondary
  • Showesy Orange#FF8A3DAccent
  • Showesy Ink#11111ADark
  • Showesy Cloud#F7F7FBLight
  • Purple → Pink → OrangeBrand gradient
  • Blue → MintAlternative gradient

Typography. Manrope for headlines, Inter for the rest.

  • Manrope

    Headlines and display

    Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz 0123456789

    • ExtraBold
    • Bold
    • SemiBold
    • Medium

  • Inter

    Body text and interface

    Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz 0123456789

    • Bold
    • SemiBold
    • Medium
    • Regular

Iconography. Simple line icons with round ends.

  • Create
  • Campaigns
  • Playlists
  • AI
  • Edit
  • Schedule
  • Connect
  • Publish

24 px grid, 1.6 px strokes, round caps and joins. Purple in the interface; pink, orange and teal for accents.

Logo usage. Give it room to breathe.

Clear space

Keep a clear space around the logo equal to the height of the S.

Minimum size

Never show the logo smaller than this, so the S stays recognisable.

  • showesy50 pxMinimum size, digital
  • showesy25 mmMinimum size, print

Surfaces. Elevation, glass and organic shapes.

  • Elevation instead of borders

    • rest
    • hover
    • modal
    Apple: 18px radius · 2px 4px 12px .08 → hover 2px 4px 16px .16 + scale(1.01)

  • Glass (backdrop-filter)

    Glass over content
    rgba(255,255,255,.3) · blur(12px) saturate(160%) · inset light edge

  • Organic shapes

    63% 37% 54% 46% / 55% 48% 52% 45% and more – decoration and image masks only