Demo site — fictional. Built as a sample of custom web design by Wendi Coffman-Porter. Back to Web Design · Pricing · Hire me · hi@wendicoffmanporter.com

Branding kit · demo

Ember Frame Photo

Mark, lockup, favicon, palette, and type for this fictional client — each demo gets its own visual system.

Logos

Ember Frame Photo logo mark
Mark

Ornate gold oval picture frame with EF monogram and star — decorative frame for Ember Frame Photo.

Ember Frame Photo logo lockup
Lockup

Darkroom nameplate with the ornate frame beside EMBER FRAME PHOTO and LIGHT · FRAME · STORY.

Favicon

A favicon is the tiny icon in your browser tab — next to the page title, and often in bookmarks and phone home-screen shortcuts. Most people never say the word; they just recognize “your site” from that little mark.

It does not have to match the full logo mark pixel-for-pixel. Marks can be too detailed to read at 16×16. A good favicon keeps the intent of the brand (hall seal, shield, paw, frame, book) in a simple shape that still looks clear when it’s smaller than a fingernail.

How it shows up

Mock browser tab — the small icon is the favicon.

Ember Frame Photo favicon
File

32×32 PNG — designed to stay readable at tab size (about 16×16).

Colors

Hex values from this demo’s palette — each role is intentional for the vertical.

  • Ember gold#e8c45aBook-shoot CTAs and frame metal (#e8c45a).
  • Darkroom deep#a88420Active links (#a88420).
  • Print black#0c0c0eFolio void so photos dominate.
  • Mat board#16161aCaption panels.
  • Paper ink#f2f0eaShoot titles.
  • Gelatin muted#a8a49aSession notes.

Type

Ember Frame Photo

Display

DM Sans — soft folio titles.

Light · Frame · Story. Fictional photographer site with folio feature, contact sheet, and about.

Body

IBM Plex Sans — clean shoot blurbs.

Hero image

Folio strip of location / portrait stills — dusk and window light as the product.