Icon clarity at different sizes - from favicon to app icons

Font Usage

Inter is used for all typography in KOGRAL branding. The font is clean, modern, and highly readable at all sizes.

Logo Usage

Use the full logo for primary brand identification on websites, marketing materials, and product pages. The horizontal variant works well for header areas and social media. For small spaces, use the square or horizontal-small variants. Always maintain sufficient whitespace around the logo (minimum 20px).

Color Palette

Primary Blue (#4a9eff) is the main brand color representing knowledge and connectivity. Accent Green (#3dd68d) highlights active states and interactions. Gold (#fbbf24) emphasizes important elements like the central knowledge node. Use the black & white variants for print and high-contrast applications.

Typography

Use Inter font family from Google Fonts for all text. Weight 800 for display/hero text, 700 for headings, 600 for subheadings, 400 for body text, and 500 for UI elements. Use Courier New monospace for code, filenames, and HEX values. Maintain line height of 1.3-1.7 for optimal readability.

Icon Usage

Use kogral-icon.svg (200x200px) for most applications including favicons and UI elements. The small variant is optimized for tight spaces and mobile interfaces. The monochrome versions are suitable for print, document headers, and accessibility contexts.