JSPM

circle-flags

1.0.0
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 576
  • Score
    100M100P100Q90804F
  • License MIT

A collection of circular SVG country flags.

Package Exports

    This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (circle-flags) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

    Readme

    circle-flags circle-flags animated logo

    A collection of circular SVG country flags.

    Usage

    https://hatscripts.github.io/circle-flags/flags/xx.svg

    (Where xx is the ISO 3166-1 alpha-2 code of a country).

    For example, the following code:

    <img src="https://hatscripts.github.io/circle-flags/flags/br.svg" width="48">
    <img src="https://hatscripts.github.io/circle-flags/flags/cn.svg" width="48">
    <img src="https://hatscripts.github.io/circle-flags/flags/gb.svg" width="48">
    <img src="https://hatscripts.github.io/circle-flags/flags/id.svg" width="48">
    <img src="https://hatscripts.github.io/circle-flags/flags/in.svg" width="48">
    <img src="https://hatscripts.github.io/circle-flags/flags/ng.svg" width="48">
    <img src="https://hatscripts.github.io/circle-flags/flags/ru.svg" width="48">
    <img src="https://hatscripts.github.io/circle-flags/flags/us.svg" width="48">

    ...produces this:

    To view all the available flags, check the gallery.

    React

    If you're using React, you may want to try the react-circle-flags package.

    NPM

    If you want to install this package as a dependency, you can install it from this GitHub repository:

    npm install --save https://github.com/HatScripts/circle-flags

    Userscripts

    Contributing

    To contribute, you need to have the latest version of svgo installed.

    First, edit the relevant SVG files in the flags/ directory.

    Then run svgo to optimize the SVG files:

    svgo ./flags --recursive --config=svgo.config.js

    Then commit the changes, and submit them as a pull request.

    The color palette

    Submitted flags should conform to the following color palette.
    Try to match the flag's original colors with the nearest color from the palette.

    • #eeeeee: white
    • #acabb1: gray
    • #333333: black
    • #a2001d: dark red
    • #d80027: red
    • #ff9811: orange
    • #ffda44: yellow
    • #6da544: green
    • #496e2d: dark green
    • #338af3: light blue
    • #0052b4: blue

    Special cases:

    License

    This project is released under the MIT license.