Logo Usage
The mark should feel confident, fast, and product-first. Give it room, keep contrast high, and do not redraw or restyle the flame.
Dark Backgrounds
Use the white wordmark on black, charcoal, deep product headers, and orange hero bands.
Light Backgrounds
Use the color wordmark on white, off-white, and light neutral surfaces.
Orange Fields
Use white only. Avoid color-on-orange combinations that reduce legibility.
Use the full FireRankings wordmark when space allows.
Use the flame icon only in compact app chrome, favicons, and square avatar placements.
Keep clear space around the logo equal to the height of the flame mark.
Use the white logo on black, charcoal, or orange backgrounds.
Use the color logo on white or very light surfaces.
Palette
FireRankings is anchored by bright orange, black product chrome, warm light surfaces, and clear green success states.
Fire Orange
Primary actions, selected states, active navigation, emphasis.
Warm Orange
Gradient starts, highlights, hover warmth.
Charcoal
Dark nav, hero backgrounds, product chrome.
Panel Black
Dark cards, modals, app panels.
Success Green
Connected states, completed checks, safe confirmations.
Soft Surface
Light backgrounds, subtle sections, calm contrast.
Typography
Use display type for confident headlines, then switch to clear sans-serif text for instructions, data, and workflows.
Display
Use for brand headlines, large page titles, hero statements, and major section headers.
Interface
Use for product UI, body copy, controls, labels, analytics, cards, tables, and documentation.
Product Theme
The product should feel like a serious operating system for content, with sharp actions and high-confidence status states.
Controls
The app uses clear state color: orange means active or primary; green means connected or complete; black means strong secondary action.
Rules
Graphics And Media
FireRankings visuals should show real outcomes: calendars, drafts, publishing states, dashboards, generated content, and brand-safe assets.
Show the product, the generated asset, or the publishing workflow whenever possible.
Use orange as a decisive accent, not a full-page wash unless the content is a CTA or status moment.
For generated images and reels, use the workspace's uploaded logo and brand colors when available.
Avoid random stock images that do not match the account, campaign, or generated prompt.
Avoid blurry atmospheric backgrounds when a user needs to inspect the actual output.
Avoid changing, stretching, recoloring, or outlining the FireRankings logo.
Messaging And Wording
The FireRankings voice is pragmatic, fast-moving, and specific. It helps users understand what will happen next.
Voice Principles
Lead with the concrete outcome before the mechanism.
Use plain language: generate, schedule, publish, rank, connect.
Sound capable and direct, not cute or overly casual.
Make automation feel controlled: users approve, edit, and steer.
Avoid vague AI hype. Show the workflow and the result.
Wording Examples
Automate SEO content across blogs, social, and email.
Revolutionize your content with magical AI.
Generate a post, review the draft, then schedule it.
Sit back while AI does everything perfectly.
Fire Credits
Tokens, coins, points, or AI units