Country Code Founder tool with colorful styling and all its features use any free library...

 

Country Code Finder

* { box-sizing: border-box; } body { font-family: Arial, sans-serif; background: linear-gradient(135deg, #72c6ef, #f0a3b7); color: #333; margin: 0; padding: 20px; } .container { background: white; border-radius: 8px; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); padding: 20px; max-width: 500px; margin: auto; text-align: center; } h1 { color: #ff6347; } input[type="text"] { width: 100%; padding: 10px; border-radius: 5px; border: 1px solid #ddd; margin-bottom: 15px; } button { background-color: #ff6347; color: white; padding: 10px 15px; border: none; border-radius: 5px; cursor: pointer; font-size: 16px; transition: background-color 0.3s; } button:hover { background-color: #e5533d; } .result { margin-top: 20px; font-size: 18px; color: #333; } document.getElementById('searchButton').addEventListener('click', function() { const input = document.getElementById('searchInput').value.trim(); const resultDiv = document.getElementById('result'); if (!input) { resultDiv.textContent = 'Please enter a country name or code.'; return; } fetch(`https://restcountries.com/v3.1/name/${input}?fullText=true`) .then(response => { if (!response.ok) { throw new Error('Country not found. Please try again.'); } return response.json(); }) .then(data => { const country = data[0]; const countryName = country.name.common; const countryCode = country.cca2; // 2-letter country code resultDiv.innerHTML = ` Country: ${countryName}
Code: ${countryCode} `; }) .catch(error => { resultDiv.textContent = error.message; }); });