// Six logo directions for Noura Lawyers // Each exports a React component rendering on a 900x560 canvas // Palette: navy #0F1B2D ground, gold #C9A961 mark const NAVY = '#0F1B2D'; const NAVY_DEEP = '#0A1220'; const GOLD = '#C9A961'; const GOLD_BRIGHT = '#E0BD6E'; const GOLD_SOFT = '#8E7340'; const CREAM = '#F5F1EA'; // ---------- Shared lockup pieces ---------- function Wordmark({ size = 64, letterSpacing = '0.06em', weight = 500, color = GOLD, font = "'Cormorant Garamond', serif" }) { return (
NOURA
); } function Subtitle({ text = 'LAWYERS', size = 13, color = GOLD, letterSpacing = '0.42em', weight = 500 }) { return (
{text}
); } function ArabicWord({ size = 30, color = GOLD, font = "'Amiri', serif" }) { // نورة للمحاماة - Noura for Law return (
نورة
); } function ConceptLabel({ name, tagline, color = GOLD_SOFT }) { return (
{name}
{tagline}
); } function Frame({ children, bg = NAVY, label, tagline }) { return (
{children}
{/* hairline frame */}
); } // ============================================ // 1. ECLIPSE — Light from Shadow // A gold disc with a navy crescent emerging. Litigation = bringing // what was hidden into the light. // ============================================ function LogoEclipse() { return ( {/* Horizontal lockup matching the original: mark | divider | wordmark */}
{/* Eclipse mark — left */} {/* Vertical divider */}
{/* Wordmark stack — right */}
NOURA
LAWYERS
); } // ============================================ // 2. HORIZON — Sunrise / We Rise // Gold half-disc rising over a horizon line. Forward-moving, // optimistic challenger energy. // ============================================ function LogoHorizon() { return ( {/* rays */} {[-50, -30, -10, 10, 30, 50].map((deg, i) => { const len = 6; const rad = (deg - 90) * Math.PI / 180; const x1 = 110 + Math.cos(rad) * 78; const y1 = 120 + Math.sin(rad) * 78; const x2 = 110 + Math.cos(rad) * (78 + 12); const y2 = 120 + Math.sin(rad) * (78 + 12); return ; })} {/* half disc */} {/* horizon line */} {/* inner navy line — slim cut for depth */} ); } // ============================================ // 3. NOON (ن) — Arabic Heritage // The first letter of نورة in Arabic — already a bowl with a sun-dot. // The most meaningful, ownable mark for a GCC firm. // ============================================ function LogoNoon() { return ( {/* Stylized geometric Noon (ن): half-circle bowl below + dot above */} {/* Bowl: open at top, thick stroke */} {/* Tiny terminals on either side - make it feel like a proper letter */} {/* Dot above — this is the sun */}
{/* Both Latin and Arabic rendered in Amiri — one family, perfect match */}
NOURA
نورة
LAWYERS · المحاماة
); } // ============================================ // 4. PRISM — Clarity from Complexity // Sun split into wedges of light. Litigation = analyzing facts, // separating truth into its parts. // ============================================ function LogoPrism() { return ( {/* 8 wedges around a hollow center, alternating opacity */} {[0,1,2,3,4,5,6,7].map(i => { const a1 = (i * 45 - 90 - 18) * Math.PI / 180; const a2 = (i * 45 - 90 + 18) * Math.PI / 180; const r1 = 22, r2 = 70; const x1 = Math.cos(a1)*r1, y1 = Math.sin(a1)*r1; const x2 = Math.cos(a1)*r2, y2 = Math.sin(a1)*r2; const x3 = Math.cos(a2)*r2, y3 = Math.sin(a2)*r2; const x4 = Math.cos(a2)*r1, y4 = Math.sin(a2)*r1; return ( ); })} {/* center dot */} ); } // ============================================ // 5. MONOGRAM — Serif N + Sun // A bold custom serif N where the gold disc nests in the negative space. // The mark IS the wordmark's initial. // ============================================ function LogoMonogram() { return ( {/* Outer ring/frame */} {/* Gold disc (sun) */} {/* The N — drawn in navy on top of the disc, with serifs */} {/* Left vertical */} {/* Right vertical */} {/* Diagonal */} {/* Serifs - top left */} {/* Serifs - top right */} {/* Serifs - bottom left */} {/* Serifs - bottom right */} ); } // ============================================ // 6. SEAL — Stamp of Truth // Circular emblem like a notarial seal. Tradition + authority, // but rendered with restraint and a modern sun at center. // ============================================ function LogoSeal() { // Curved text along an arc return ( {/* Outer ring */} {/* Tick marks around the ring */} {Array.from({length: 36}).map((_, i) => { const a = (i * 10) * Math.PI / 180; const x1 = 100 + Math.cos(a) * 79; const y1 = 100 + Math.sin(a) * 79; const x2 = 100 + Math.cos(a) * 83; const y2 = 100 + Math.sin(a) * 83; return ; })} {/* Curved name text along top */} NOURA · LAWYERS {/* Established year along bottom */} · EST · GCC · {/* Central mark: sun + Arabic noon dot above */} {/* Bottom flank stars */} ); } // ============================================ // Reference: the original logo as supplied // ============================================ function LogoOriginal() { return (
NOURA
LAWYERS
); } // ============================================ // System tile — shows ECLIPSE applied to brand touchpoints // (card, signage, app icon) so the user can feel the system // ============================================ function SystemPreview() { return (
{/* Business card */}
BUSINESS CARD
Layla Al-Hassan
SENIOR LITIGATOR
NOURA
{/* App icon + signage */}
APP ICON
SIGNAGE · MONOTONE
NOURA
LAWYERS
); } Object.assign(window, { LogoEclipse, LogoHorizon, LogoNoon, LogoPrism, LogoMonogram, LogoSeal, LogoOriginal, SystemPreview, }); // === app === const { useState } = React; function App() { return ( ); } ReactDOM.createRoot(document.getElementById('root')).render();