# I made all countries' flags using HTML & CSS

This article is special, you may ask why. It is because, in my last article [CSS Flag: India](https://hashnode.j471n.in/css-flag-india), I said- 

>I am starting a new series called **CSS Flag**. Where I'll be making different countries' flags starting with India.

I asked myself "Why don't I make an article which will have all 195 countries' flags instead of creating 195 articles?". Well, Here I am. 

In this article, I have made all countries' flags by just using HTML and CSS. At the end of the article. You will have a special Bonus (you have to reach the end of the article to see it).


### Disclaimer

>- The idea of this series came up in my mind on 15 August as I mention in my previous article [CSS Flag: India](https://hashnode.j471n.in/css-flag-india). 
- I don't want to hurt anyone's feelings or sentiments through this article. As It could offend some people if their country's flag is slightly off point. I respect every country's flag and its people. If you find any mistakes in any of the flags then please let me know. I'll fix it as soon as possible.
- If there are some issues with codepen in mobile devices try to switch to the desktop mode or visit through desktop/laptop browsers.
- I have used images (PNG) in some of the flags as well because it was kind of complex to create them
- The size of each flag is 300x200 pixels. Some of the countries' flags use different sizes. So It could be a little bit different due to the size difference.



## Afghanistan

%[https://codepen.io/j471n/pen/YzabZbN]

## Albania

%[https://codepen.io/j471n/pen/RwMmpzg]

## Algeria

%[https://codepen.io/j471n/pen/MWVdmgd]

## Andorra

%[https://codepen.io/j471n/pen/qBoGmEN]

## Angola

%[https://codepen.io/j471n/pen/BareRyx]

## Antigua and Barbuda

%[https://codepen.io/j471n/pen/jOzomPX]

## Argentina

%[https://codepen.io/j471n/pen/abYrWdd]

## Armenia

%[https://codepen.io/j471n/pen/KKoLmVE]

## Australia

%[https://codepen.io/j471n/pen/vYRwmGJ]

## Austria

%[https://codepen.io/j471n/pen/XWEwRKb]

## Azerbaijan

%[https://codepen.io/j471n/pen/RwMmVGj]

## Bahamas

%[https://codepen.io/j471n/pen/YzabVNr]

## Bahrain

%[https://codepen.io/j471n/pen/poLmPRX]

## Bangladesh

%[https://codepen.io/j471n/pen/VwXObbz]

## Barbados

%[https://codepen.io/j471n/pen/oNqRWww]

## Belarus

%[https://codepen.io/j471n/pen/jOzomJO]

## Belgium

%[https://codepen.io/j471n/pen/RwMmVdY]

## Belize

%[https://codepen.io/j471n/pen/PoRvmgV]

## Benin

%[https://codepen.io/j471n/pen/QWmRvRW]

## Bhutan

%[https://codepen.io/j471n/pen/OJvYmYq]

## Bolivia

%[https://codepen.io/j471n/pen/XWEwRLM]

## Bosnia and Herzegovina

%[https://codepen.io/j471n/pen/wvmbdLL]

## Botswana

%[https://codepen.io/j471n/pen/VwXObod]

## Brazil

%[https://codepen.io/j471n/pen/QWmRgLw]

## Brunei

%[https://codepen.io/j471n/pen/ExEzXYX]

## Bulgaria

%[https://codepen.io/j471n/pen/LYdoLPQ]

## Burkina Faso

%[https://codepen.io/j471n/pen/XWEwgWR]

## Burundi

%[https://codepen.io/j471n/pen/gOeJROE]

## Cambodia

%[https://codepen.io/j471n/pen/XWEwgbR]

## Cameroon

%[https://codepen.io/j471n/pen/KKoLqdV]

## Canada

%[https://codepen.io/j471n/pen/wvmbyGx]

## Cape Verde

%[https://codepen.io/j471n/pen/yLKWvOW]

## Central African

%[https://codepen.io/j471n/pen/eYMaVzO]

## Chad

%[https://codepen.io/j471n/pen/LYdoQZb]

## Chile

%[https://codepen.io/j471n/pen/RwMmQRL]

## China

%[https://codepen.io/j471n/pen/GRxaQqy]

## Colombia

%[https://codepen.io/j471n/pen/jOzoZrd

## Comoros

%[https://codepen.io/j471n/pen/zYWQRKG]

## Democratic Republic of the Congo

%[https://codepen.io/j471n/pen/JjLqpRK]

## Republic of the Congo

%[https://codepen.io/j471n/pen/GRxaQjy]

## Costa Rica

%[https://codepen.io/j471n/pen/yLKWvaW]

## Croatia

%[https://codepen.io/j471n/pen/eYMaVBY]

## Cuban

%[https://codepen.io/j471n/pen/VwXOQmW]

## Cyprus

%[https://codepen.io/j471n/pen/VwXOQPW]

## Czechia

%[https://codepen.io/j471n/pen/OJvYQWE]

## Denmark

%[https://codepen.io/j471n/pen/bGvyLgm]

## Djibouti

%[https://codepen.io/j471n/pen/rNdgJya]

## Dominica

%[https://codepen.io/j471n/pen/YzabeZx]

## Dominican

%[https://codepen.io/j471n/pen/poLmaem]

## East Timor

%[https://codepen.io/j471n/pen/QWmRRao]

## Ecuador

%[https://codepen.io/j471n/pen/LYdoQyW]

## Egypt

%[https://codepen.io/j471n/pen/LYdoQLW]

## El Salvador

%[https://codepen.io/j471n/pen/wvmbyeY]

## Equatorial Guinea

%[https://codepen.io/j471n/pen/GRxaQMd]

## Eritrea

%[https://codepen.io/j471n/pen/jOzoZGo]

## Estonia

%[https://codepen.io/j471n/pen/MWVdQOW]

## Eswatini

%[https://codepen.io/j471n/pen/YzabeEE]

## Ethiopia

%[https://codepen.io/j471n/pen/NWYVywo]

## Fiji

%[https://codepen.io/j471n/pen/MWVdQrW]

## Finland

%[https://codepen.io/j471n/pen/oNqREpw]

## France

%[https://codepen.io/j471n/pen/BareYJq]

## Gabon

%[https://codepen.io/j471n/pen/jOzoZYo]

## Gambia

%[https://codepen.io/j471n/pen/MWVdQQW]

## Georgia

%[https://codepen.io/j471n/pen/OJvYQQB]

## Germany

%[https://codepen.io/j471n/pen/WNzBMMW]

## Ghana

%[https://codepen.io/j471n/pen/yLKWvKL]

## Greece

%[https://codepen.io/j471n/pen/mdxYXxL]

## Grenada

%[https://codepen.io/j471n/pen/qBoGxYm]

## Guatemala

%[https://codepen.io/j471n/pen/GRxaQdG]

## Guinea

%[https://codepen.io/j471n/pen/NWYVyMJ]

## Guinea-Bissau

%[https://codepen.io/j471n/pen/QWmRQxX]

## Guyana

%[https://codepen.io/j471n/pen/vYRwdaR]

## Haiti

%[https://codepen.io/j471n/pen/QWmRQBX]

## Honduras

%[https://codepen.io/j471n/pen/xxWNYaq]

## Hungary

%[https://codepen.io/j471n/pen/BareYOv]

## Iceland

%[https://codepen.io/j471n/pen/ZExNrqQ]

## India

%[https://codepen.io/j471n/pen/VwXOQEQ]

## Indonesia

%[https://codepen.io/j471n/pen/OJvYQBr]

## Iran

%[https://codepen.io/j471n/pen/KKoLQrK]

## Iraq

%[https://codepen.io/j471n/pen/bGvyLQJ]

## Ireland

%[https://codepen.io/j471n/pen/eYMaVbZ]

## Israel

%[https://codepen.io/j471n/pen/rNdgJoL]

## Italy

%[https://codepen.io/j471n/pen/bGvyLOJ]

## Ivory Coast

%[https://codepen.io/j471n/pen/zYWQReN]

## Jamaica

%[https://codepen.io/j471n/pen/YzabeBL]

## Japan

%[https://codepen.io/j471n/pen/MWVdQxK]

## Jordan

%[https://codepen.io/j471n/pen/YzabegL]

## Kazakhstan

%[https://codepen.io/j471n/pen/KKoLQYw]

## Kenya

%[https://codepen.io/j471n/pen/qBoGxwP]

## Kiribati

%[https://codepen.io/j471n/pen/OJvYQGd]

## North Korea

%[https://codepen.io/j471n/pen/KKoLQLw]

## South Korea

%[https://codepen.io/j471n/pen/bGvyLyP]

## Kuwait

%[https://codepen.io/j471n/pen/zYWQRVZ]

## Kyrgyzstan

%[https://codepen.io/j471n/pen/Yzabeov]

## Laos

%[https://codepen.io/j471n/pen/WNzBMVe]

## Latvia

%[https://codepen.io/j471n/pen/KKoLoPp]

## Lebanon

%[https://codepen.io/j471n/pen/KKoLeJK]

## Lesotho

%[https://codepen.io/j471n/pen/mdxYKvj]

## Liberia

%[https://codepen.io/j471n/pen/rNdgKRM]

## Libya

%[https://codepen.io/j471n/pen/bGvyKZy]

## Liechtenstein

%[https://codepen.io/j471n/pen/abYrKxW]

## Lithuania

%[https://codepen.io/j471n/pen/YzabvML]

## Luxembourg

%[https://codepen.io/j471n/pen/wvmbXZZ]

## Madagascar

%[https://codepen.io/j471n/pen/eYMaKaz]

## Malawi

%[https://codepen.io/j471n/pen/GRxaGaY]

## Malaysia

%[https://codepen.io/j471n/pen/jOzoKjO]

## Maldives

%[https://codepen.io/j471n/pen/xxWNzoL]

## Mali

%[https://codepen.io/j471n/pen/vYRwrqa]

## Malta

%[https://codepen.io/j471n/pen/BareVgE]

## Marshall Islands

%[https://codepen.io/j471n/pen/eYMaKqd]

## Mauritania

%[https://codepen.io/j471n/pen/RwMmJXY]

## Mauritius

%[https://codepen.io/j471n/pen/KKoLBPp]

## Mexico

%[https://codepen.io/j471n/pen/abYrjow]

## Micronesia

%[https://codepen.io/j471n/pen/PoRvBYV]

## Moldova

%[https://codepen.io/j471n/pen/zYWQLYw]

## Monaco

%[https://codepen.io/j471n/pen/NWYVBPK]

## Mongolia

%[https://codepen.io/j471n/pen/xxWNJbX]

## Montenegro

%[https://codepen.io/j471n/pen/vYRwaEz]

## Morocco

%[https://codepen.io/j471n/pen/QWmRBbw]

## Mozambique

%[https://codepen.io/j471n/pen/KKoLBdd]

## Myanmar

%[https://codepen.io/j471n/pen/zYWQLvz]

## Namibia

%[https://codepen.io/j471n/pen/GRxaBpz]

## Nauru

%[https://codepen.io/j471n/pen/rNdgrxy]

## Nepal

%[https://codepen.io/j471n/pen/BarePjg]

## Netherland

%[https://codepen.io/j471n/pen/rNdgJmV]

## New Zealand

%[https://codepen.io/j471n/pen/WNzBKxb]

## Nicaragua

%[https://codepen.io/j471n/pen/VwXOBjG]

## Niger

%[https://codepen.io/j471n/pen/bGvyjwG]

## Nigeria

%[https://codepen.io/j471n/pen/eYMajdv]

## North Macedonia

%[https://codepen.io/j471n/pen/yLKWqVa]

## Norway

%[https://codepen.io/j471n/pen/xxWNJRp]

## Oman

%[https://codepen.io/j471n/pen/BarePQX]

## Pakistan

%[https://codepen.io/j471n/pen/XWEwBpa]

## Palau

%[https://codepen.io/j471n/pen/WNzBKpQ]

## Palestine

%[https://codepen.io/j471n/pen/qBoGyrY]

## Panama

%[https://codepen.io/j471n/pen/NWYVBjq]

## Papua New Guinea

%[https://codepen.io/j471n/pen/JjLqBNL]

## Paraguay

%[https://codepen.io/j471n/pen/wvmbxev]

## Peru

%[https://codepen.io/j471n/pen/gOeJjRN]

## Philippines

%[https://codepen.io/j471n/pen/xxWNJLW]

## Poland

%[https://codepen.io/j471n/pen/QWmRBqN]

## Portugal

%[https://codepen.io/j471n/pen/zYWQLEP]

## Qatar

%[https://codepen.io/j471n/pen/NWYVBwG]

## Romania

%[https://codepen.io/j471n/pen/rNdgrYG]

## Russia

%[https://codepen.io/j471n/pen/LYdoBOJ]

## Rwanda

%[https://codepen.io/j471n/pen/bGvyjaV]

## Saint Kitts and Nevis

%[https://codepen.io/j471n/pen/RwMmBxO]

## Saint Lucia

%[https://codepen.io/j471n/pen/bGvyjLV]

## Saint Vincent and the Grenadines

%[https://codepen.io/j471n/pen/ExEzpQQ]

## Samoa

%[https://codepen.io/j471n/pen/NWYVBYx]

## San Marino

%[https://codepen.io/j471n/pen/rNdgrdY]

## São Tomé and Príncipe

%[https://codepen.io/j471n/pen/xxWNJWz]

## Saudi Arabia

%[https://codepen.io/j471n/pen/zYWQLjR]

## Senegal

%[https://codepen.io/j471n/pen/OJvYwEP]

## Serbia

%[https://codepen.io/j471n/pen/poLmZKe]

## Seychelles

%[https://codepen.io/j471n/pen/XWEwBYV]

## Sierra Leone

%[https://codepen.io/j471n/pen/poLmZZe]

## Singapore

%[https://codepen.io/j471n/pen/abYrjjK]

## Slovakia

%[https://codepen.io/j471n/pen/YzabjjM]

## Slovenia

%[https://codepen.io/j471n/pen/jOzopvy]

## Solomon Islands

%[https://codepen.io/j471n/pen/oNqRMPJ]

## Somalia

%[https://codepen.io/j471n/pen/GRxaBYK]

## South Africa

%[https://codepen.io/j471n/pen/QWmRBZG]

## South Sudan

%[https://codepen.io/j471n/pen/vYRwaVw]

## Spain

%[https://codepen.io/j471n/pen/eYMajQy]

## Sri Lanka

%[https://codepen.io/j471n/pen/BarePvj]

## Sudan

%[https://codepen.io/j471n/pen/eYMaXBv]

## Suriname

%[https://codepen.io/j471n/pen/oNqRVYy]

## Sweden

%[https://codepen.io/j471n/pen/KKoLEaz]

## Switzerland

%[https://codepen.io/j471n/pen/BarebpX]

## Syria

%[https://codepen.io/j471n/pen/XWEwGMg]

## Taiwan

%[https://codepen.io/j471n/pen/KKojGzx]

## Tajikistan

%[https://codepen.io/j471n/pen/dymErvj]

## Tanzania

%[https://codepen.io/j471n/pen/bGvyZWG]

## Thailand

%[https://codepen.io/j471n/pen/JjLqVwj]

## Togo

%[https://codepen.io/j471n/pen/gOeJyZW]

## Tonga

%[https://codepen.io/j471n/pen/jOzoRXK]

## Trinidad and Tobago

%[https://codepen.io/j471n/pen/abYrxPe]

## Tunisia

%[https://codepen.io/j471n/pen/zYWQXeV]

## Turkey

%[https://codepen.io/j471n/pen/YzabMMG]

## Turkmenistan

%[https://codepen.io/j471n/pen/NWYVmmY]

## Tuvalu

%[https://codepen.io/j471n/pen/ExEzJJq]

## Uganda

%[https://codepen.io/j471n/pen/wvmbZbp]

## Ukraine

%[https://codepen.io/j471n/pen/MWVdRdL]

## United Arab Emirates

%[https://codepen.io/j471n/pen/oNqROrx]

## United Kingdom

%[https://codepen.io/j471n/pen/BareEgJ]

## United States

%[https://codepen.io/j471n/pen/ZExNZdP]

## Uruguay

%[https://codepen.io/j471n/pen/YzabMmp]

## Uzbekistan

%[https://codepen.io/j471n/pen/bGvyJXv]

## Vanuatu

%[https://codepen.io/j471n/pen/ZExNZgP]

## Vatican City

%[https://codepen.io/j471n/pen/ExEzzYY]

## Venezuela

%[https://codepen.io/j471n/pen/dymEEyp]

## Vietnam

%[https://codepen.io/j471n/pen/RwMmmwV]

## Yemen

%[https://codepen.io/j471n/pen/WNzBBNK]

## Zambia

%[https://codepen.io/j471n/pen/ExEzzax]

## Zimbabwe

%[https://codepen.io/j471n/pen/vYRwwEx]




### Bonus 

As I told you at the start of the article I'll attach a bonus section. Here it is. You can find all countries' flags in the following Codepen (All in One):

%[https://codepen.io/j471n/pen/rNdEGzB]


## Wrapping up

I have used images in some of the flags as well because it was kind of complex to create them. I hope you enjoyed the article, if you did then don't forget to press ❤️. If you have any queries or suggestions don't hesitate to drop them. You can extend your support by [Buying me a Coffee](https://buymeacoffee.com/j471n). I'll see you in the next one.


## References

- [Wikipedia](https://en.wikipedia.org/wiki/Gallery_of_sovereign_state_flags)
- [seekflag.com](https://seekflag.com/)


Thumbnail Image b [@krisetya](https://unsplash.com/@krisetya) at [Unsplash](https://unsplash.com/photos/k0Jo8m6DO6k)