Adding FlutterMap in a application

i am trying to show a map using FlutterMap package. So far I have shown like this:

FlutterMap(
          mapController: mapController,
          options: MapOptions(
            center: LatLng(xx, yy),
            zoom: 14.4746,
          ),
          children: [
            TileLayer(
              urlTemplate: 'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
              userAgentPackageName: 'com.example.app',
            ),
            
          ],
        )

but I would like to change ui of FlutterMap, in GoogleMap package we can change it using map type. As I know, in FlutterMap using urlTemplate: 'https://tile.openstreetmap.org/{z}/{x}/{y}.png', to change the ui, is there another free web map so that I can change the ui map

As you've said, flutter_map cannot style the tiles for you, see https://docs.fleaflet.dev/frequently-asked-questions#how-can-i-use-a-custom-map-style-how-can-i-prevent-poi-labels-rotating-when-the-map-rotates-how-can. This is a limitation of this technology.

Free maps are hard to come across, but you can find some here: https://wiki.openstreetmap.org/wiki/Raster_tile_providers. Always read their Terms of Service - the free ones will likely have harsh limits on number of requests or disallow usage in certain (eg. commercial) situations. They are free in terms of cost, but not free in terms of responsibility.

> If you need more support, please get in touch via the Discord server where we will find your question quicker and be able to give better support: https://docs.fleaflet.dev/#get-help.

PS. Please remove the 'google-maps' tag from your question, as that is an unrelated package and may attract unrelated answers.