Flags

The official flags of the Principality of Kaharagia represent the nation, its people, and royal institutions.

Official Flags

National Flag

Saint Michael's Flag

The official flag of the Principality of Kaharagia since the foundation of the nation.

Download SVG →

Civil Flag

Kaharagian Civil Flag

The common Kaharagian flag combining the colours of the Royal Family and the Order of Saint Michael.

Download SVG →

Cultural Flag

Royal Family Banner

The banner of the Royal Family, displaying the colours from the Royal Family Arms.

Download SVG →

Cultural Flag

Saint Michael's Banner

The original civil flag of Kaharagia, derived from the Order of Saint Michael colours.

Download SVG →

Usage Guidelines

Always maintain the 3:2 aspect ratio
Do not alter the colours or proportions
Minimum display size: 90×60 pixels
Use a subtle shadow when displayed on light backgrounds
Provide descriptive alt text for accessibility

Display Guidelines

Aspect Ratio

All Kaharagian flags use a 3:2 aspect ratio. When displaying flags, ensure this ratio is preserved to maintain the correct proportions.

/* CSS to maintain flag aspect ratio */
.flag {
  width: 100%;
  max-width: 360px;
  height: auto;
  aspect-ratio: 3 / 2;
}

/* Alternative using padding */
.flag-container {
  position: relative;
  width: 100%;
  max-width: 360px;
  padding-bottom: 66.67%; /* 2/3 = 66.67% */
}

.flag-container img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

Minimum Size

Flags should not be displayed smaller than 90×60 pixels to ensure visibility and recognisability of the design elements.

Background Considerations

When displaying flags on light backgrounds, add a subtle shadow or border to ensure the flag edges are visible:

<img
  src="/flags/stm_flag.svg"
  alt="Saint Michael's Flag"
  class="flag"
  style="box-shadow: 0 2px 4px rgba(0,0,0,0.1);"
>

Accessibility

Always include descriptive alt text identifying the specific flag
Do not rely on flag colours alone to convey information
Provide text labels alongside flags when used for selection or navigation

HTML Example

<!-- Display the Saint Michael's Flag -->
<figure class="flag-figure">
  <img
    src="/flags/stm_flag.svg"
    alt="Saint Michael's Flag - Official flag of the Principality of Kaharagia"
    class="flag"
  >
  <figcaption>The Saint Michael's Flag</figcaption>
</figure>