Brand identity

AIEE.DEV is precise, calm, and education-first: generous white space, crisp typography, and interfaces that feel lightweight rather than loud.

Default surfaces are white or near-white; accent color is used sparingly for actions and focus. This balances corporate trust with a Gen‑Z minimalist aesthetic—clean grids, subtle borders, no visual noise.

In external communications, lead with outcomes for learners and organizations—clarity over hype, evidence over slogans, and inclusive language that respects classrooms and workplaces worldwide.

Write for busy professionals and curious learners: short sentences, concrete verbs, and explicit next steps. Prefer active voice; avoid jargon unless you define it once.

Enterprise credibility comes from specificity—name the skill, the cohort, and the measurable outcome. Gen‑Z accessibility comes from plain language, respectful humor only when on-brand, and zero condescension.

Calls to action should be singular per surface (one primary outcome). Error and system messages stay calm, blame-free, and solution-oriented.

Show real learning contexts: diverse classrooms, hybrid teams, and hands-on practice with clear light and shallow depth-of-field where appropriate. Avoid stock clichés (overly perfect smiles, fake whiteboards).

Color grade neutrally so UI blues and whites stay true; do not tint photography to match the accent color unless art-directed for a campaign.

When placing the logo on photography, use a white or neutral panel or soft gradient scrim behind the mark to preserve contrast.

Primary mark is the AIEE.DEV wordmark (bold, tight tracking). When a site logo image is configured in admin settings, it may appear alongside or instead of the wordmark in product chrome—never mix competing marks in one lockup.

Download logo files

Download the approved AIEE.DEV wordmark as SVG or PNG. It matches the live navbar logotype. Older circular-icon or alternate lockup artwork is not the primary brand mark unless your team has explicitly approved it.

AIEE.DEV wordmark

Primary logo: the four-letter AIEE.DEV logotype only—bold sans-serif with tight tracking, matching the site header.

SVGPNG

The approved brand palette for communications is **two tokens only**: an off-white canvas (`--brand-bg`) and a dark navy text color (`--brand-text`). Do not introduce extra accent colors for brochures, slides, or marketing unless a separate campaign is explicitly approved.

Prefer system or geometric sans-serif stacks already used in marketing layouts; keep headings sentence or title case for a modern, approachable tone.

--font-sans-stack: "Helvetica Neue", Helvetica, Arial, ui-sans-serif, system-ui, sans-serif;

Most public pages follow a simple vertical rhythm: global navbar → hero → supporting sections → footer wordmark. Content blocks use a single-column stack on small screens and widen into grids at `lg` breakpoints.

+--------------------------------------------------+
| [ Nav | AIEE.DEV | Menu ................... Auth ]   |
+--------------------------------------------------+
|  Hero: headline + subcopy + primary CTA          |
+--------------------------------------------------+
|  Section cards / feature grid                    |
+--------------------------------------------------+
|  Social proof, FAQ, or resources (optional)      |
+--------------------------------------------------+
|  Footer: sitemap columns + large AIEE.DEV wordmark   |
+--------------------------------------------------+

ASCII wireframe — spacing and section order, not pixel layout.

The live product is a Next.js application with authenticated areas for educators, students, and admins. Public marketing routes share the same design language but avoid authenticated data.

Use the wordmark or approved logo centered on white or light neutral for profile images where possible. Keep critical content inside safe zones—platform UI overlays avatars and corners.

Official platform marks for identification (trademarks belong to their owners).

• Instagram
• Facebook
• LinkedIn
• X (Twitter)
• TikTok
• YouTube

Primary actions use filled primary color; secondary actions use outline or ghost buttons. Links are text-colored with underline on hover where appropriate.

• Maintain tap targets ≥ 44px height on mobile for primary CTAs.
• Pair one primary button per view when possible to reduce decision friction.
• Favicon and app icons should use the simplified mark on white or transparent background.

Brochures, flyers, posters, and booth graphics should feel as calm and precise as the digital product: generous white space, the AIEE.DEV wordmark, token-based color, and usually one clear call to action per piece.

Brochures, flyers & promotional print

Files, color & finishing