jesus/syntaxis
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
syntaxis/assets/logos/static/SYNTAXIS_LOGO_README.md
Jesús Pérez 9cef9b8d57 refactor: consolidate configuration directories 
Merge _configs/ into config/ for single configuration directory.
Update all path references.

Changes:
- Move _configs/* to config/
- Update .gitignore for new patterns
- No code references to _configs/ found

Impact: -1 root directory (layout_conventions.md compliance)
2025-12-26 18:36:23 +00:00

2.8 KiB
Raw Permalink Blame History

SYNTAXIS Logo Files

Generated SVG logo variations for the SYNTAXIS brand.

Files Included

Primary Logos

  1. syntaxis-logo-icon.svg (200×200)

    • Standalone geometric icon
    • Use for: Favicon, app icon, profile pictures
    • Works at: 32px minimum

  2. syntaxis-logo-horizontal.svg (500×120)

    • Full horizontal lockup with icon, wordmark, and tagline
    • Use for: Website headers, business cards, marketing materials
    • Best for: Wide spaces, headers

  3. syntaxis-logo-compact.svg (400×100)

    • Horizontal without tagline
    • Use for: Toolbars, navigation, smaller spaces
    • Best for: UI components, email signatures

  4. syntaxis-logo-vertical.svg (300×300)

    • Stacked layout with icon above text
    • Use for: Square spaces, mobile layouts, posters
    • Best for: Vertical layouts, social media

  5. syntaxis-logo-monogram.svg (200×200)

    • Geometric "S" construction
    • Use for: Watermarks, very small sizes, alternative branding
    • Best for: Minimal contexts

Monochrome Versions

  1. syntaxis-logo-mono-light.svg (200×200)

    • Black shapes for light backgrounds
    • Use for: Print, high contrast, accessibility

  2. syntaxis-logo-mono-dark.svg (200×200)

    • White shapes for dark backgrounds
    • Use for: Dark mode interfaces, dark presentations

Color Palette Used

  • SYNTAXIS Blue (#2C5F8E): Primary shapes, wordmark
  • Greek Stone Gray (#6B7280): Secondary shapes, tagline
  • Arrangement Gold (#D97706): Central triangle accent

Design Elements

Each logo incorporates the core geometric pattern:

  • ◆ Diamonds: Project phases (blue)
  • ■ Squares: Tasks (gray)
  • ▲ Triangle: Core priority (gold)

Usage Guidelines

Minimum Sizes

  • With text: 120px wide
  • Icon only: 32px
  • Never scale below these minimums

Clear Space

Maintain clear space of 0.5× logo height around all sides

Do's

✓ Use on white or dark backgrounds as appropriate ✓ Scale proportionally ✓ Maintain color integrity ✓ Use monochrome versions when color isn't available

Don'ts

✗ Don't distort or stretch ✗ Don't change colors ✗ Don't add effects (shadows, outlines, etc.) ✗ Don't rotate or tilt ✗ Don't place on busy backgrounds

Next Steps for Production

To create raster versions (PNG):

# Using Inkscape or similar SVG converter
inkscape syntaxis-logo-icon.svg --export-type=png --export-width=512

Recommended raster sizes:

  • Favicon: 16×16, 32×32, 64×64
  • App icons: 128×128, 256×256, 512×512, 1024×1024
  • Social media: 400×400, 800×800
  • Open Graph: 1200×630

Files Format

All files are:

  • Vector SVG format
  • Web-optimized
  • Embedded fonts (system fallback to Inter/sans-serif)
  • Clean, hand-coded paths

Contact

Questions? hello@syntaxis.dev Brand guidelines: SYNTAXIS_VISUAL_IDENTITY.md

syntaxis.dev | Systematic Orchestration, Perfectly Arranged