diff --git a/ui/desktop/src/components/settings/providers/BaseProviderGrid.tsx b/ui/desktop/src/components/settings/providers/BaseProviderGrid.tsx
index ba799819..eae5b137 100644
--- a/ui/desktop/src/components/settings/providers/BaseProviderGrid.tsx
+++ b/ui/desktop/src/components/settings/providers/BaseProviderGrid.tsx
@@ -252,7 +252,7 @@ export function BaseProviderGrid({
   onTakeoff,
 }: BaseProviderGridProps) {
   return (
-    <div className="grid grid-cols-3 sm:grid-cols-4 lg:grid-cols-5 xl:grid-cols-6 2xl:grid-cols-7 gap-3 auto-rows-fr max-w-full [&_*]:z-20">
+    <div className="grid grid-cols-[repeat(auto-fill,_minmax(140px,_1fr))] gap-3 [&_*]:z-20">
       {providers.map((provider) => {
         const hasRequiredKeys = required_keys[provider.name]?.length > 0;
         return (