City picker for dating apps

Dating apps need a city field for two different reasons at once: it's shown on the profile ("Sarah, 28, London"), and it drives distance-based matching, which needs real coordinates, not a text string. A city autocomplete that resolves to a canonical city with latitude/longitude solves both — the display text is consistent, and you get real coordinates to feed into a distance query without geocoding the free-text input separately.

Live demo

Type a UK city — production apps would swap in the user's detected or selected country:

Type to search the United Kingdom cities…

Integration snippet

Resolve the picked city to coordinates for matching, using the main search endpoint (requires a free RapidAPI key):

async function resolveCityForProfile(cityId) {
  const res = await fetch(`https://geomelon.p.rapidapi.com/cities/${cityId}`, {
    headers: {
      'x-rapidapi-host': 'geomelon.p.rapidapi.com',
      'x-rapidapi-key': 'YOUR_API_KEY',
    },
  });
  const city = await res.json();
  // city.latitude, city.longitude, city.name — store these on the profile
  return city;
}

Once two profiles both have coordinates, distance-based matching is a Haversine calculation away — no separate geocoding step, since the autocomplete step already resolved a real city with known coordinates.

Try the API free on RapidAPI