Country & Territory Flags — examples

Every flag keeps its official colours in every example below. Change size, padding and background around a flag — never its colours.

1. As an image

Flag of France (Original)Flag of France (Rectangle)Flag of France (Circle)Flag of France (Rounded)
<img src="svg/original/fr.svg" height="64" alt="Flag of France">

2. Inline SVG

Flag of France
<span><svg viewBox="…" height="64">…</svg></span>

3. CSS classes (flags.css)

<link rel="stylesheet" href="examples/flags.css">
<span class="hti-flag hti-flag-fr" role="img" aria-label="Flag of France"></span>
<span class="hti-flag hti-flag-circle hti-flag-fr" role="img" aria-label="Flag of France"></span>

4. Padding and background

Flag of France
.pad { padding: 12px; background: #0d1b3e; border-radius: 12px; }