Skip to the content

Hata旗

Load a native country or region flag, choose supported framing and keep each drawing’s source, author and licence.

Hata (旗) is Japanese for a flag. About the name

Contents

Reference · BR-PE flag SVG

defaultconstant

The flag of Pernambuco (ペルナンブーコ州), BR-PE, as an SVG string: viewBox 540 by 360 (3:2), 935 B. From Wikimedia Commons, "Bandeira de Pernambuco.svg" (public domain); the /manifest entry gives its author, licence and why it was chosen. It has a viewBox and no width or height, so it fills the box it is put in at its own aspect ratio.

Import it

import value from "@johnmorrisdotca/hata/flags/br-pe";

Definition

const svg: string = "<svg data-hata=\"br-pe\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 540 360\"><path fill=\"#3155a4\" d=\"M0 0h540v216H0z\"/><path stroke=\"#c34342\" stroke-width=\"12\" d=\"M69 270a129 129 202.5 0 1 402 0\" style=\"fill:none\"/><path stroke=\"#ffb511\" stroke-width=\"12\" d=\"M81 270a117 117 202.5 0 1 378 0\" style=\"fill:none\"/><path stroke=\"#00ad4a\" stroke-width=\"12\" d=\"M93 270a105 105 202.5 0 1 354 0\" style=\"fill:none\"/><path fill=\"#fff\" d=\"M0 216h540v144H0z\"/><path fill=\"none\" stroke=\"#c34342\" stroke-width=\"12\" d=\"M270 243v90m-27-58.5h54\"/><path fill=\"#ffb511\" d=\"m270 126 3 9.2 5.2-8.1.4 9.6 7.1-6.5-2 9.4 8.6-4.4-4.4 8.6 9.4-2-6.5 7 9.6.5-8 5.3 9.1 2.9-9.2 3 8.1 5.2-9.6.4 6.5 7.1-9.4-2 4.4 8.6-8.6-4.4 2 9.4-7-6.5-.5 9.6-5.3-8-2.9 9.1-3-9.2-5.2 8.1-.4-9.6-7.1 6.5 2-9.4-8.6 4.4 4.4-8.6-9.4 2 6.5-7-9.6-.5 8-5.3-9.1-2.9 9.2-3-8.1-5.2 9.6-.4-6.5-7.1 9.4 2-4.4-8.6 8.6 4.4-2-9.4 7 6.5.5-9.6 5.3 8zm0-108 8.8 27-23-16.7h28.4l-23 16.7z\"/></svg>"

Examples

Example 1

import flag from "@johnmorrisdotca/hata/flags/br-pe";

const host=document.createElement("div");
host.innerHTML = flag; // or toDataUri(flag) from "@johnmorrisdotca/hata" for an <img src>
console.log(host.querySelector("svg")?.getAttribute("viewBox"));

Example 2

import { svg } from "@johnmorrisdotca/hata/flags/br-pe";
console.log(svg.startsWith("<svg"),svg.length);
true 935

What it prints (run when this page was built)

View sourceEdit on GitHubMade from the source of @johnmorrisdotca/hata 1.6.0.