diff --git a/ToDo.md b/ToDo.md
index ac2c41a..f94ed1d 100644
--- a/ToDo.md
+++ b/ToDo.md
@@ -4,4 +4,4 @@
 [ ] Improove: In the preview page, add possibility select custom color for each target.
 [ ] Strategy: Add differents base/collections of images: Flags,
 [v] Strategy: WebApp, PWA
-[ ] Improove: Add to filter Image variants - just logo, line logo, square logo
+[v] Improove: Add to filter Image variants - just logo, line logo, square logo
diff --git a/public/data/logos.json b/public/data/logos.json
index 60ac57d..6fe0f92 100644
--- a/public/data/logos.json
+++ b/public/data/logos.json
@@ -1,6 +1,7 @@
 [
   {
     "name": "1password",
+    "title": "1password",
     "path": "logos/1password.svg",
     "format": "SVG",
     "disable": false,
@@ -8,14 +9,23 @@
     "tags": [
       "Password Manager",
       "Security"
+    ],
+    "variants": [
+      "Logo only",
+      "Icon",
+      "Circle"
     ]
   },
   {
-    "name": "Adguard",
+    "name": "adguard",
+    "title": "Adguard",
     "path": "logos/adguard.svg",
     "format": "SVG",
     "disable": false,
     "brand": "AdGuard",
+    "variants": [
+      "Logo with right text"
+    ],
     "tags": [
       "Selfhosted",
       "adblocker",
@@ -38,11 +48,15 @@
     }
   },
   {
-    "name": "Adguard",
+    "name": "adguard-logo",
+    "title": "Adguard",
     "path": "logos/adguard-logo.svg",
     "format": "SVG",
     "disable": false,
     "brand": "AdGuard",
+    "variants": [
+      "Logo only"
+    ],
     "tags": [
       "Selfhosted",
       "adblocker",
@@ -50,11 +64,15 @@
     ]
   },
   {
-    "name": "Adidas",
+    "name": "adidas",
+    "title": "Adidas",
     "path": "logos/adidas.svg",
     "format": "SVG",
     "brand": "Adidas",
     "disable": false,
+    "variants": [
+      "Logo only"
+    ],
     "tags": [
       "clothing",
       "sports",
@@ -62,7 +80,8 @@
     ]
   },
   {
-    "name": "Affinity Designer",
+    "name": "affinity-designer",
+    "title": "Affinity Designer",
     "path": "logos/affinity-designer.svg",
     "format": "SVG",
     "disable": false,
@@ -71,10 +90,15 @@
       "Design",
       "Software"
     ],
-    "variants": ["logo_only", "icon"]
+    "variants": [
+      "Logo only",
+      "Icon",
+      "Square"
+    ]
   },
   {
-    "name": "Affinity Photo",
+    "name": "affinity-photo",
+    "title": "Affinity Photo",
     "path": "logos/affinity-photo.svg",
     "format": "SVG",
     "disable": false,
@@ -82,10 +106,15 @@
     "tags": [
       "Software"
     ],
-    "variants": ["logo_only", "icon"]
+    "variants": [
+      "Logo only",
+      "Icon",
+      "Square"
+    ]
   },
   {
-    "name": "Affinity Publisher",
+    "name": "affinity-publisher",
+    "title": "Affinity Publisher",
     "path": "logos/affinity-publisher.svg",
     "format": "SVG",
     "disable": false,
@@ -94,36 +123,53 @@
       "Design",
       "Software"
     ],
-    "variants": ["logo_only", "icon"]
+    "variants": [
+      "Logo only",
+      "Icon",
+      "Square"
+    ]
   },
   {
-    "name": "Amazon",
+    "name": "amazon",
+    "title": "Amazon",
     "path": "logos/amazon.svg",
     "format": "SVG",
     "disable": false,
+    "variants": [
+      "Logo only"
+    ],
     "brand": "Amazon",
     "tags": [
       "retail"
     ]
   },
   {
-    "name": "Android Auto",
+    "name": "android-auto",
+    "title": "Android Auto",
     "path": "logos/android-auto.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Google",
-    "tags": []
+    "tags": [],
+    "variants": [
+      "Logo only"
+    ]
   },
   {
-    "name": "Apache",
+    "name": "apache",
+    "title": "Apache",
     "path": "logos/apache.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Apache",
-    "tags": []
+    "tags": [],
+    "variants": [
+      "Logo only"
+    ]
   },
   {
-    "name": "Apple",
+    "name": "apple",
+    "title": "Apple",
     "path": "logos/apple.svg",
     "format": "SVG",
     "disable": false,
@@ -131,6 +177,9 @@
       "tech"
     ],
     "brand": "Apple",
+    "variants": [
+      "Logo only"
+    ],
     "colors": {
       "green": "#75bd21",
       "yellow": "#ffc728",
@@ -171,26 +220,36 @@
     }
   },
   {
-    "name": "Apple Icloud",
+    "name": "apple_icloud",
+    "title": "Apple iCloud",
     "path": "logos/apple_icloud.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Apple",
+    "variants": [
+      "Logo only"
+    ],
     "tags": [
       "cloud",
       "storage"
     ]
   },
   {
-    "name": "Apple App Store",
+    "name": "apple_app_store",
+    "title": "Apple App Store",
     "path": "logos/apple_app_store.svg",
     "format": "SVG",
     "disable": false,
+    "variants": [
+      "Logo only",
+      "Icon"
+    ],
     "tags": [],
     "brand": "Apple"
   },
   {
-    "name": "Apple Homekit",
+    "name": "apple_homekit",
+    "title": "Apple Homekit",
     "path": "logos/apple_homekit.svg",
     "format": "SVG",
     "disable": false,
@@ -201,7 +260,8 @@
     "brand": "Apple"
   },
   {
-    "name": "Apple Music",
+    "name": "apple_music",
+    "title": "Apple Music",
     "path": "logos/apple_music.svg",
     "format": "SVG",
     "disable": false,
@@ -212,7 +272,8 @@
     "brand": "Apple"
   },
   {
-    "name": "Apple Books",
+    "name": "apple_books",
+    "title": "Apple Books",
     "path": "logos/apple_books.svg",
     "format": "SVG",
     "disable": false,
@@ -221,6 +282,7 @@
   },
   {
     "name": "arm",
+    "title": "arm",
     "path": "logos/arm.svg",
     "format": "SVG",
     "disable": false,
@@ -245,7 +307,8 @@
     }
   },
   {
-    "name": "ATB",
+    "name": "atb",
+    "title": "ATB",
     "path": "logos/atb.svg",
     "format": "SVG",
     "disable": false,
@@ -256,7 +319,8 @@
     ]
   },
   {
-    "name": "Authentik",
+    "name": "authentik",
+    "title": "Authentik",
     "path": "logos/authentik.svg",
     "format": "SVG",
     "disable": false,
@@ -292,7 +356,8 @@
     }
   },
   {
-    "name": "Authentik",
+    "name": "authentik-logo",
+    "title": "Authentik",
     "path": "logos/authentik-logo.svg",
     "format": "SVG",
     "disable": false,
@@ -324,7 +389,8 @@
     }
   },
   {
-    "name": "Binance",
+    "name": "binance",
+    "title": "Binance",
     "path": "logos/binance.svg",
     "format": "SVG",
     "disable": false,
@@ -336,7 +402,8 @@
     "brand": "Binance"
   },
   {
-    "name": "Bitcoin",
+    "name": "bitcoin",
+    "title": "Bitcoin",
     "path": "logos/bitcoin.svg",
     "format": "SVG",
     "disable": false,
@@ -348,7 +415,8 @@
     "brand": "Bitcoin"
   },
   {
-    "name": "Bitwarden",
+    "name": "bitwarden",
+    "title": "Bitwarden",
     "path": "logos/bitwarden.svg",
     "format": "SVG",
     "disable": false,
@@ -360,7 +428,8 @@
     ]
   },
   {
-    "name": "Bluesky",
+    "name": "bluesky",
+    "title": "Bluesky",
     "path": "logos/bluesky.svg",
     "format": "SVG",
     "disable": false,
@@ -370,7 +439,8 @@
     ]
   },
   {
-    "name": "BMW",
+    "name": "bmw",
+    "title": "BMW",
     "path": "logos/bmw.svg",
     "format": "SVG",
     "disable": false,
@@ -381,7 +451,8 @@
     "brand": "BMW"
   },
   {
-    "name": "Digital Ocean",
+    "name": "digital-ocean",
+    "title": "Digital Ocean",
     "path": "logos/digital-ocean.svg",
     "format": "SVG",
     "disable": false,
@@ -393,28 +464,32 @@
     ]
   },
   {
-    "name": "Docker",
+    "name": "docker-icon",
+    "title": "Docker",
     "path": "logos/docker-icon.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Docker"
   },
   {
-    "name": "Dockge",
+    "name": "dockge",
+    "title": "Dockge",
     "path": "logos/dockge.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Dockge"
   },
   {
-    "name": "DuckDuckGo",
+    "name": "duckduckgo",
+    "title": "DuckDuckGo",
     "path": "logos/duckduckgo.svg",
     "format": "SVG",
     "disable": false,
     "brand": "DuckDuckGo"
   },
   {
-    "name": "Enpass",
+    "name": "enpass",
+    "title": "Enpass",
     "path": "logos/enpass.svg",
     "format": "SVG",
     "disable": false,
@@ -440,7 +515,8 @@
     }
   },
   {
-    "name": "Eufy",
+    "name": "eufy",
+    "title": "Eufy",
     "path": "logos/eufy.svg",
     "format": "SVG",
     "disable": false,
@@ -470,7 +546,8 @@
     }
   },
   {
-    "name": "Homarr",
+    "name": "homarr",
+    "title": "Homarr",
     "path": "logos/homarr.svg",
     "format": "SVG",
     "disable": false,
@@ -500,7 +577,8 @@
     }
   },
   {
-    "name": "Influxdb",
+    "name": "influxdb",
+    "title": "Influxdb",
     "path": "logos/influxdb.svg",
     "format": "SVG",
     "disable": false,
@@ -529,7 +607,8 @@
     }
   },
   {
-    "name": "Influxdb",
+    "name": "influxdb-logo",
+    "title": "Influxdb",
     "path": "logos/influxdb-logo.svg",
     "format": "SVG",
     "disable": false,
@@ -558,7 +637,8 @@
     }
   },
   {
-    "name": "Laravel",
+    "name": "laravel",
+    "title": "Laravel",
     "path": "logos/laravel.svg",
     "format": "SVG",
     "disable": false,
@@ -588,7 +668,8 @@
     }
   },
   {
-    "name": "Matter",
+    "name": "matter",
+    "title": "Matter",
     "path": "logos/matter.svg",
     "format": "SVG",
     "disable": false,
@@ -618,7 +699,8 @@
     }
   },
   {
-    "name": "Matter",
+    "name": "matter-icon",
+    "title": "Matter",
     "path": "logos/matter-icon.svg",
     "format": "SVG",
     "disable": false,
@@ -648,7 +730,8 @@
     }
   },
   {
-    "name": "Mattermost",
+    "name": "mattermost-icon",
+    "title": "Mattermost",
     "path": "logos/mattermost-icon.svg",
     "format": "SVG",
     "disable": false,
@@ -684,7 +767,8 @@
     }
   },
   {
-    "name": "Mattermost",
+    "name": "mattermost-line",
+    "title": "Mattermost",
     "path": "logos/mattermost-line.svg",
     "format": "SVG",
     "disable": false,
@@ -720,7 +804,8 @@
     }
   },
   {
-    "name": "Messenger",
+    "name": "facebook-messenger",
+    "title": "Messenger",
     "path": "logos/facebook-messenger.svg",
     "format": "SVG",
     "disable": false,
@@ -732,7 +817,8 @@
     ]
   },
   {
-    "name": "Forgejo",
+    "name": "forgejo",
+    "title": "Forgejo",
     "path": "logos/forgejo.svg",
     "format": "SVG",
     "disable": false,
@@ -744,14 +830,16 @@
     ]
   },
   {
-    "name": "Freebsd",
+    "name": "freebsd",
+    "title": "Freebsd",
     "path": "logos/freebsd.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Freebsd"
   },
   {
-    "name": "Frigate",
+    "name": "frigate-logo",
+    "title": "Frigate",
     "path": "logos/frigate-logo.svg",
     "format": "SVG",
     "disable": false,
@@ -763,7 +851,8 @@
     ]
   },
   {
-    "name": "Gitlab",
+    "name": "gitlab-logo",
+    "title": "Gitlab",
     "path": "logos/gitlab-logo.svg",
     "format": "SVG",
     "disable": false,
@@ -775,28 +864,32 @@
     ]
   },
   {
-    "name": "Google Cloud",
+    "name": "google-cloud",
+    "title": "Google Cloud",
     "path": "logos/google-cloud.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Google"
   },
   {
-    "name": "Google Drive",
+    "name": "google-drive",
+    "title": "Google Drive",
     "path": "logos/google-drive.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Google"
   },
   {
-    "name": "Google Fit",
+    "name": "google-fit",
+    "title": "Google Fit",
     "path": "logos/google-fit.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Google"
   },
   {
-    "name": "Google Home",
+    "name": "google-home",
+    "title": "Google Home",
     "path": "logos/google-home.svg",
     "format": "SVG",
     "disable": false,
@@ -806,14 +899,16 @@
     ]
   },
   {
-    "name": "Google Maps",
+    "name": "google-maps",
+    "title": "Google Maps",
     "path": "logos/google-maps.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Google"
   },
   {
-    "name": "Google Meet",
+    "name": "google-meet",
+    "title": "Google Meet",
     "path": "logos/google-meet.svg",
     "format": "SVG",
     "disable": false,
@@ -825,21 +920,24 @@
     ]
   },
   {
-    "name": "Google Photos",
+    "name": "google-photos",
+    "title": "Google Photos",
     "path": "logos/google-photos.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Google"
   },
   {
-    "name": "Google Play",
+    "name": "google-play-icon",
+    "title": "Google Play",
     "path": "logos/google-play-icon.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Google"
   },
   {
-    "name": "Grafana",
+    "name": "grafana",
+    "title": "Grafana",
     "path": "logos/grafana.svg",
     "format": "SVG",
     "disable": false,
@@ -851,14 +949,16 @@
     ]
   },
   {
-    "name": "GraphQL",
+    "name": "graphql",
+    "title": "GraphQL",
     "path": "logos/graphql.svg",
     "format": "SVG",
     "disable": false,
     "brand": "GraphQL"
   },
   {
-    "name": "Homebridge",
+    "name": "homebridge",
+    "title": "Homebridge",
     "path": "logos/homebridge.svg",
     "format": "SVG",
     "disable": false,
@@ -869,7 +969,8 @@
     ]
   },
   {
-    "name": "Immich",
+    "name": "immich",
+    "title": "Immich",
     "path": "logos/immich.svg",
     "format": "SVG",
     "disable": false,
@@ -882,7 +983,8 @@
     ]
   },
   {
-    "name": "Jellyfin",
+    "name": "jellyfin",
+    "title": "Jellyfin",
     "path": "logos/jellyfin.svg",
     "format": "SVG",
     "disable": false,
@@ -894,7 +996,8 @@
     ]
   },
   {
-    "name": "Kubernetes",
+    "name": "kubernetes",
+    "title": "Kubernetes",
     "path": "logos/kubernetes.svg",
     "format": "SVG",
     "disable": false,
@@ -954,14 +1057,16 @@
     }
   },
   {
-    "name": "Languagetool",
+    "name": "languagetool",
+    "title": "Languagetool",
     "path": "logos/languagetool.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Languagetool"
   },
   {
-    "name": "Laravel",
+    "name": "laravel-logo",
+    "title": "Laravel",
     "path": "logos/laravel-logo.svg",
     "format": "SVG",
     "disable": false,
@@ -991,7 +1096,8 @@
     }
   },
   {
-    "name": "Letsencrypt",
+    "name": "letsencrypt",
+    "title": "Letsencrypt",
     "path": "logos/letsencrypt.svg",
     "format": "SVG",
     "disable": false,
@@ -1002,7 +1108,8 @@
     ]
   },
   {
-    "name": "Letsencrypt",
+    "name": "letsencrypt-logo",
+    "title": "Letsencrypt",
     "path": "logos/letsencrypt-logo.svg",
     "format": "SVG",
     "disable": false,
@@ -1013,21 +1120,24 @@
     ]
   },
   {
-    "name": "Linux Mint",
+    "name": "linux-mint",
+    "title": "Linux Mint",
     "path": "logos/linux-mint.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Linux Mint"
   },
   {
-    "name": "Linux Tux",
+    "name": "linux-tux",
+    "title": "Linux Tux",
     "path": "logos/linux-tux.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Tux"
   },
   {
-    "name": "MariaDB",
+    "name": "mariadb",
+    "title": "MariaDB",
     "path": "logos/mariadb.svg",
     "format": "SVG",
     "disable": false,
@@ -1037,7 +1147,8 @@
     ]
   },
   {
-    "name": "MariaDB",
+    "name": "mariadb-icon",
+    "title": "MariaDB",
     "path": "logos/mariadb-icon.svg",
     "format": "SVG",
     "disable": false,
@@ -1047,7 +1158,8 @@
     ]
   },
   {
-    "name": "Mastercard",
+    "name": "mastercard",
+    "title": "Mastercard",
     "path": "logos/mastercard.svg",
     "format": "SVG",
     "disable": false,
@@ -1058,7 +1170,8 @@
     "brand": "Mastercard"
   },
   {
-    "name": "Chromium",
+    "name": "chromium",
+    "title": "Chromium",
     "path": "logos/chromium.svg",
     "format": "SVG",
     "disable": false,
@@ -1069,7 +1182,8 @@
     "brand": "Chromium"
   },
   {
-    "name": "Coca-Cola",
+    "name": "coca-cola",
+    "title": "Coca-Cola",
     "path": "logos/coca-cola.svg",
     "format": "SVG",
     "disable": false,
@@ -1080,7 +1194,8 @@
     "brand": "Coca-Cola"
   },
   {
-    "name": "Dalnoboy Service",
+    "name": "dalnoboy-service",
+    "title": "Dalnoboy Service",
     "path": "logos/dalnoboy-service.svg",
     "format": "SVG",
     "disable": false,
@@ -1094,7 +1209,8 @@
     }
   },
   {
-    "name": "Debian",
+    "name": "debian",
+    "title": "Debian",
     "path": "logos/debian.svg",
     "format": "SVG",
     "disable": false,
@@ -1106,7 +1222,8 @@
     "brand": "Debian"
   },
   {
-    "name": "Disney",
+    "name": "disney",
+    "title": "Disney",
     "path": "logos/disney.svg",
     "format": "SVG",
     "disable": false,
@@ -1117,7 +1234,8 @@
     ]
   },
   {
-    "name": "Docker",
+    "name": "docker",
+    "title": "Docker",
     "path": "logos/docker.svg",
     "format": "SVG",
     "disable": false,
@@ -1140,7 +1258,8 @@
     }
   },
   {
-    "name": "Dodge",
+    "name": "dodge",
+    "title": "Dodge",
     "path": "logos/dodge.svg",
     "format": "SVG",
     "disable": false,
@@ -1169,7 +1288,8 @@
     }
   },
   {
-    "name": "Fedora",
+    "name": "fedora",
+    "title": "Fedora",
     "path": "logos/fedora.svg",
     "format": "SVG",
     "disable": false,
@@ -1181,7 +1301,8 @@
     "brand": "Fedora"
   },
   {
-    "name": "Fedora",
+    "name": "fedora_logo",
+    "title": "Fedora",
     "path": "logos/fedora_logo.svg",
     "format": "SVG",
     "disable": false,
@@ -1193,7 +1314,8 @@
     ]
   },
   {
-    "name": "Fiat",
+    "name": "fiat",
+    "title": "Fiat",
     "path": "logos/fiat.svg",
     "format": "SVG",
     "disable": false,
@@ -1204,7 +1326,8 @@
     "brand": "Fiat"
   },
   {
-    "name": "Firefox",
+    "name": "firefox",
+    "title": "Firefox",
     "path": "logos/firefox.svg",
     "format": "SVG",
     "disable": false,
@@ -1215,7 +1338,8 @@
     "brand": "Firefox"
   },
   {
-    "name": "Ford",
+    "name": "ford",
+    "title": "Ford",
     "path": "logos/ford.svg",
     "format": "SVG",
     "disable": false,
@@ -1226,7 +1350,8 @@
     "brand": "Ford"
   },
   {
-    "name": "Git",
+    "name": "git",
+    "title": "Git",
     "path": "logos/git.svg",
     "format": "SVG",
     "disable": false,
@@ -1237,7 +1362,8 @@
     "brand": "Git"
   },
   {
-    "name": "Gitea",
+    "name": "gitea",
+    "title": "Gitea",
     "path": "logos/gitea.svg",
     "format": "SVG",
     "disable": false,
@@ -1249,7 +1375,8 @@
     ]
   },
   {
-    "name": "GitHub",
+    "name": "github-logo",
+    "title": "GitHub",
     "path": "logos/github-logo.svg",
     "format": "SVG",
     "disable": false,
@@ -1271,7 +1398,8 @@
     }
   },
   {
-    "name": "Github",
+    "name": "github",
+    "title": "Github",
     "path": "logos/github.svg",
     "format": "SVG",
     "disable": false,
@@ -1293,7 +1421,8 @@
     }
   },
   {
-    "name": "GitLab",
+    "name": "gitlab",
+    "title": "GitLab",
     "path": "logos/gitlab.svg",
     "format": "SVG",
     "disable": false,
@@ -1305,7 +1434,8 @@
     "brand": "GitLab"
   },
   {
-    "name": "Go",
+    "name": "go-dev",
+    "title": "Go",
     "path": "logos/go.dev.svg",
     "format": "SVG",
     "disable": false,
@@ -1343,7 +1473,8 @@
     }
   },
   {
-    "name": "Google",
+    "name": "google",
+    "title": "Google",
     "path": "logos/google.svg",
     "format": "SVG",
     "disable": false,
@@ -1353,7 +1484,8 @@
     ]
   },
   {
-    "name": "Gmail",
+    "name": "gmail",
+    "title": "Gmail",
     "path": "logos/gmail.svg",
     "format": "SVG",
     "disable": false,
@@ -1365,7 +1497,8 @@
     "brand": "Google"
   },
   {
-    "name": "Google Chrome",
+    "name": "google_chrome",
+    "title": "Google Chrome",
     "path": "logos/google_chrome.svg",
     "format": "SVG",
     "disable": false,
@@ -1376,7 +1509,8 @@
     "brand": "Google"
   },
   {
-    "name": "Google Chrome",
+    "name": "google_chrome_icon",
+    "title": "Google Chrome",
     "path": "logos/google_chrome_icon.svg",
     "format": "SVG",
     "disable": false,
@@ -1387,7 +1521,8 @@
     "brand": "Google"
   },
   {
-    "name": "Guinness",
+    "name": "guinness",
+    "title": "Guinness",
     "path": "logos/guinness.svg",
     "format": "SVG",
     "disable": false,
@@ -1398,7 +1533,8 @@
     "brand": "Guinness"
   },
   {
-    "name": "Home Assistant",
+    "name": "home-assistant-logo",
+    "title": "Home Assistant",
     "path": "logos/home-assistant-logo.svg",
     "format": "SVG",
     "disable": false,
@@ -1410,7 +1546,8 @@
     "brand": "Home Assistant"
   },
   {
-    "name": "Home Assistant",
+    "name": "home-assistant",
+    "title": "Home Assistant",
     "path": "logos/home-assistant.svg",
     "format": "SVG",
     "disable": false,
@@ -1422,7 +1559,8 @@
     "brand": "Home Assistant"
   },
   {
-    "name": "Honda",
+    "name": "honda",
+    "title": "Honda",
     "path": "logos/honda.svg",
     "format": "SVG",
     "disable": false,
@@ -1433,7 +1571,8 @@
     "brand": "Honda"
   },
   {
-    "name": "IBKR",
+    "name": "ibkr",
+    "title": "IBKR",
     "path": "logos/ibkr.svg",
     "format": "SVG",
     "disable": false,
@@ -1444,7 +1583,8 @@
     "brand": "IBKR"
   },
   {
-    "name": "Jägermeister",
+    "name": "j-germeister",
+    "title": "Jägermeister",
     "path": "logos/jägermeister.svg",
     "format": "SVG",
     "disable": false,
@@ -1455,7 +1595,8 @@
     "brand": "Jägermeister"
   },
   {
-    "name": "Jeep",
+    "name": "jeep",
+    "title": "Jeep",
     "path": "logos/jeep.svg",
     "format": "SVG",
     "disable": false,
@@ -1477,7 +1618,8 @@
     }
   },
   {
-    "name": "Kyivstar",
+    "name": "kyivstar",
+    "title": "Kyivstar",
     "path": "logos/kyivstar.svg",
     "format": "SVG",
     "disable": false,
@@ -1488,7 +1630,8 @@
     ]
   },
   {
-    "name": "Lego",
+    "name": "lego",
+    "title": "Lego",
     "path": "logos/lego.svg",
     "format": "SVG",
     "disable": false,
@@ -1499,7 +1642,8 @@
     "brand": "Lego"
   },
   {
-    "name": "LG",
+    "name": "lg",
+    "title": "LG",
     "path": "logos/lg.svg",
     "format": "SVG",
     "disable": false,
@@ -1521,7 +1665,8 @@
     }
   },
   {
-    "name": "Lifecell",
+    "name": "lifecell",
+    "title": "Lifecell",
     "path": "logos/lifecell.svg",
     "format": "SVG",
     "disable": false,
@@ -1532,7 +1677,8 @@
     ]
   },
   {
-    "name": "Lifecell Logo",
+    "name": "lifecell_logo",
+    "title": "Lifecell Logo",
     "path": "logos/lifecell_logo.svg",
     "format": "SVG",
     "disable": false,
@@ -1543,7 +1689,8 @@
     ]
   },
   {
-    "name": "Mattermost",
+    "name": "mattermost",
+    "title": "Mattermost",
     "path": "logos/mattermost.svg",
     "format": "SVG",
     "disable": false,
@@ -1579,7 +1726,8 @@
     }
   },
   {
-    "name": "McDonald's",
+    "name": "mcdonalds",
+    "title": "McDonald's",
     "path": "logos/mcdonalds.svg",
     "format": "SVG",
     "disable": false,
@@ -1590,7 +1738,8 @@
     "brand": "McDonald's"
   },
   {
-    "name": "Meest",
+    "name": "meest",
+    "title": "Meest",
     "path": "logos/meest.svg",
     "format": "SVG",
     "disable": false,
@@ -1601,7 +1750,8 @@
     "brand": "Meest"
   },
   {
-    "name": "Meta",
+    "name": "meta",
+    "title": "Meta",
     "path": "logos/meta.svg",
     "format": "SVG",
     "disable": false,
@@ -1611,7 +1761,8 @@
     ]
   },
   {
-    "name": "Facebook",
+    "name": "meta-facebook",
+    "title": "Facebook",
     "path": "logos/meta-facebook.svg",
     "format": "SVG",
     "disable": false,
@@ -1622,7 +1773,8 @@
     ]
   },
   {
-    "name": "Meta",
+    "name": "meta-icon",
+    "title": "Meta",
     "path": "logos/meta-icon.svg",
     "format": "SVG",
     "disable": false,
@@ -1632,7 +1784,8 @@
     ]
   },
   {
-    "name": "Instagram",
+    "name": "meta-instagram",
+    "title": "Instagram",
     "path": "logos/meta-instagram.svg",
     "format": "SVG",
     "disable": false,
@@ -1657,7 +1810,8 @@
     }
   },
   {
-    "name": "Microsoft Azure",
+    "name": "microsoft-azure",
+    "title": "Microsoft Azure",
     "path": "logos/microsoft-azure.svg",
     "format": "SVG",
     "disable": false,
@@ -1669,7 +1823,8 @@
     ]
   },
   {
-    "name": "MongoDB",
+    "name": "mongodb",
+    "title": "MongoDB",
     "path": "logos/mongodb.svg",
     "format": "SVG",
     "disable": false,
@@ -1679,7 +1834,8 @@
     ]
   },
   {
-    "name": "MQTT",
+    "name": "mqtt",
+    "title": "MQTT",
     "path": "logos/mqtt.svg",
     "format": "SVG",
     "disable": false,
@@ -1690,7 +1846,8 @@
     ]
   },
   {
-    "name": "Neo4j",
+    "name": "neo4j",
+    "title": "Neo4j",
     "path": "logos/neo4j.svg",
     "format": "SVG",
     "disable": false,
@@ -1700,7 +1857,8 @@
     ]
   },
   {
-    "name": "OpenVPN",
+    "name": "openvpn",
+    "title": "OpenVPN",
     "path": "logos/openvpn.svg",
     "format": "SVG",
     "disable": false,
@@ -1712,7 +1870,8 @@
     ]
   },
   {
-    "name": "Reolink",
+    "name": "reolink",
+    "title": "Reolink",
     "path": "logos/reolink.svg",
     "format": "SVG",
     "disable": false,
@@ -1742,7 +1901,8 @@
     }
   },
   {
-    "name": "Slack",
+    "name": "slack",
+    "title": "Slack",
     "path": "logos/slack.svg",
     "format": "SVG",
     "disable": false,
@@ -1755,7 +1915,8 @@
     ]
   },
   {
-    "name": "SLZB",
+    "name": "slzb",
+    "title": "SLZB",
     "path": "logos/slzb.svg",
     "format": "SVG",
     "disable": false,
@@ -1766,14 +1927,16 @@
     ]
   },
   {
-    "name": "Thread",
+    "name": "thread-net",
+    "title": "Thread",
     "path": "logos/thread-net.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Thread"
   },
   {
-    "name": "Traefik Logo",
+    "name": "traefik-logo",
+    "title": "Traefik Logo",
     "path": "logos/traefik-logo.svg",
     "format": "SVG",
     "disable": false,
@@ -1784,7 +1947,8 @@
     ]
   },
   {
-    "name": "Traefik Proxy",
+    "name": "traefik-proxy",
+    "title": "Traefik Proxy",
     "path": "logos/traefik-proxy.svg",
     "format": "SVG",
     "disable": false,
@@ -1795,7 +1959,8 @@
     ]
   },
   {
-    "name": "Traefik Proxy",
+    "name": "traefik-proxy-logo",
+    "title": "Traefik Proxy",
     "path": "logos/traefik-proxy-logo.svg",
     "format": "SVG",
     "disable": false,
@@ -1806,7 +1971,8 @@
     ]
   },
   {
-    "name": "Trakt",
+    "name": "trakt",
+    "title": "Trakt",
     "path": "logos/trakt.svg",
     "format": "SVG",
     "disable": false,
@@ -1816,7 +1982,8 @@
     ]
   },
   {
-    "name": "Unifi",
+    "name": "unifi",
+    "title": "Unifi",
     "path": "logos/unifi.svg",
     "format": "SVG",
     "disable": false,
@@ -1843,7 +2010,8 @@
     }
   },
   {
-    "name": "Uptime Kuma",
+    "name": "uptimekuma",
+    "title": "Uptime Kuma",
     "path": "logos/uptimekuma.svg",
     "format": "SVG",
     "disable": false,
@@ -1854,7 +2022,8 @@
     ]
   },
   {
-    "name": "Whatsapp",
+    "name": "meta-whatsapp-icon",
+    "title": "Whatsapp",
     "path": "logos/meta-whatsapp-icon.svg",
     "format": "SVG",
     "disable": false,
@@ -1888,35 +2057,40 @@
     }
   },
   {
-    "name": "Microsoft",
+    "name": "microsoft",
+    "title": "Microsoft",
     "path": "logos/microsoft.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Microsoft"
   },
   {
-    "name": "Microsoft Edge",
+    "name": "microsoft-edge",
+    "title": "Microsoft Edge",
     "path": "logos/microsoft-edge.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Microsoft"
   },
   {
-    "name": "LinkedIn",
+    "name": "microsoft-linkedin",
+    "title": "LinkedIn",
     "path": "logos/microsoft-linkedin.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Microsoft"
   },
   {
-    "name": "LinkedIn",
+    "name": "microsoft-linkedin-icon",
+    "title": "LinkedIn",
     "path": "logos/microsoft-linkedin-icon.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Microsoft"
   },
   {
-    "name": "Microsoft Office Outlook",
+    "name": "microsoft_office_outlook",
+    "title": "Microsoft Office Outlook",
     "path": "logos/microsoft_office_outlook.svg",
     "format": "SVG",
     "disable": false,
@@ -1928,14 +2102,16 @@
     "brand": "Microsoft"
   },
   {
-    "name": "Microsoft Onedrive",
+    "name": "microsoft-onedrive",
+    "title": "Microsoft Onedrive",
     "path": "logos/microsoft-onedrive.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Microsoft"
   },
   {
-    "name": "Microsoft Outlook",
+    "name": "microsoft_outlook",
+    "title": "Microsoft Outlook",
     "path": "logos/microsoft_outlook.svg",
     "format": "SVG",
     "disable": false,
@@ -1947,28 +2123,32 @@
     "brand": "Microsoft"
   },
   {
-    "name": "Microsoft Teams",
+    "name": "microsoft-teams",
+    "title": "Microsoft Teams",
     "path": "logos/microsoft-teams.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Microsoft"
   },
   {
-    "name": "Microsoft Windows",
+    "name": "microsoft-windows",
+    "title": "Microsoft Windows",
     "path": "logos/microsoft-windows.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Microsoft"
   },
   {
-    "name": "Microsoft Windows",
+    "name": "microsoft-windows-icon",
+    "title": "Microsoft Windows",
     "path": "logos/microsoft-windows-icon.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Microsoft"
   },
   {
-    "name": "Mikrotik",
+    "name": "mikrotik",
+    "title": "Mikrotik",
     "path": "logos/mikrotik.svg",
     "format": "SVG",
     "disable": false,
@@ -1980,7 +2160,8 @@
     ]
   },
   {
-    "name": "Mikrotik Logo",
+    "name": "mikrotik_logo",
+    "title": "Mikrotik Logo",
     "path": "logos/mikrotik_logo.svg",
     "format": "SVG",
     "disable": false,
@@ -1988,7 +2169,8 @@
     "tags": []
   },
   {
-    "name": "Monobank",
+    "name": "monobank_text",
+    "title": "Monobank",
     "path": "logos/monobank_text.svg",
     "format": "SVG",
     "disable": false,
@@ -1999,7 +2181,8 @@
     ]
   },
   {
-    "name": "Mono",
+    "name": "mono",
+    "title": "Mono",
     "path": "logos/mono.svg",
     "format": "SVG",
     "disable": false,
@@ -2033,7 +2216,8 @@
     }
   },
   {
-    "name": "Monobank paw",
+    "name": "monobank_paw",
+    "title": "Monobank paw",
     "path": "logos/monobank_paw.svg",
     "format": "SVG",
     "disable": false,
@@ -2044,7 +2228,8 @@
     ]
   },
   {
-    "name": "MySQL",
+    "name": "mysql",
+    "title": "MySQL",
     "path": "logos/mysql.svg",
     "format": "SVG",
     "disable": false,
@@ -2055,21 +2240,24 @@
     "brand": "MySQL"
   },
   {
-    "name": "MySQL",
+    "name": "mysql-icon",
+    "title": "MySQL",
     "path": "logos/mysql-icon.svg",
     "format": "SVG",
     "disable": false,
     "brand": "MySQL"
   },
   {
-    "name": "Namecheap",
+    "name": "namecheap",
+    "title": "Namecheap",
     "path": "logos/namecheap.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Namecheap"
   },
   {
-    "name": "Nationwide",
+    "name": "nationwide",
+    "title": "Nationwide",
     "path": "logos/nationwide.svg",
     "format": "SVG",
     "disable": false,
@@ -2080,7 +2268,8 @@
     "brand": "Nationwide"
   },
   {
-    "name": "Neocom",
+    "name": "neocom",
+    "title": "Neocom",
     "path": "logos/neocom.svg",
     "format": "SVG",
     "disable": false,
@@ -2091,7 +2280,8 @@
     ]
   },
   {
-    "name": "Netflix",
+    "name": "netflix",
+    "title": "Netflix",
     "path": "logos/netflix.svg",
     "format": "SVG",
     "disable": false,
@@ -2102,7 +2292,8 @@
     ]
   },
   {
-    "name": "Nikamebel",
+    "name": "nikamebel",
+    "title": "Nikamebel",
     "path": "logos/nikamebel.svg",
     "format": "SVG",
     "disable": false,
@@ -2112,7 +2303,8 @@
     "brand": "Nikamebel"
   },
   {
-    "name": "Nova Post",
+    "name": "nova_post",
+    "title": "Nova Post",
     "path": "logos/nova_post.svg",
     "format": "SVG",
     "disable": false,
@@ -2120,7 +2312,8 @@
     "tags": []
   },
   {
-    "name": "Nova Global",
+    "name": "nova_global",
+    "title": "Nova Global",
     "path": "logos/nova_global.svg",
     "format": "SVG",
     "disable": false,
@@ -2128,7 +2321,8 @@
     "tags": []
   },
   {
-    "name": "Novapay",
+    "name": "novapay",
+    "title": "Novapay",
     "path": "logos/novapay.svg",
     "format": "SVG",
     "disable": false,
@@ -2139,7 +2333,8 @@
     ]
   },
   {
-    "name": "Nvidia",
+    "name": "nvidia",
+    "title": "Nvidia",
     "path": "logos/nvidia.svg",
     "format": "SVG",
     "disable": false,
@@ -2147,14 +2342,16 @@
     "brand": "Nvidia"
   },
   {
-    "name": "Nvidia",
+    "name": "nvidia_vertical",
+    "title": "Nvidia",
     "path": "logos/nvidia_vertical.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Nvidia"
   },
   {
-    "name": "Okko",
+    "name": "okko",
+    "title": "Okko",
     "path": "logos/okko.svg",
     "format": "SVG",
     "disable": false,
@@ -2164,28 +2361,32 @@
     "brand": "Okko"
   },
   {
-    "name": "OpenAI",
+    "name": "openai-icon",
+    "title": "OpenAI",
     "path": "logos/openai-icon.svg",
     "format": "SVG",
     "disable": false,
     "brand": "OpenAI"
   },
   {
-    "name": "Opera",
+    "name": "opera",
+    "title": "Opera",
     "path": "logos/opera.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Opera"
   },
   {
-    "name": "Paypal",
+    "name": "paypal",
+    "title": "Paypal",
     "path": "logos/paypal.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Paypal"
   },
   {
-    "name": "Pepsi",
+    "name": "pepsi",
+    "title": "Pepsi",
     "path": "logos/pepsi.svg",
     "format": "SVG",
     "disable": false,
@@ -2196,7 +2397,8 @@
     "brand": "Pepsi"
   },
   {
-    "name": "Pepsi (2014-2023)",
+    "name": "pepsi_2014-2023",
+    "title": "Pepsi (2014-2023)",
     "path": "logos/pepsi_2014-2023.svg",
     "format": "SVG",
     "disable": false,
@@ -2207,7 +2409,8 @@
     "brand": "Pepsi"
   },
   {
-    "name": "PHP",
+    "name": "php",
+    "title": "PHP",
     "path": "logos/php.svg",
     "format": "SVG",
     "disable": false,
@@ -2218,7 +2421,8 @@
     "brand": "PHP"
   },
   {
-    "name": "PostgreSQL",
+    "name": "postgresql",
+    "title": "PostgreSQL",
     "path": "logos/postgresql.svg",
     "format": "SVG",
     "disable": false,
@@ -2228,7 +2432,8 @@
     "brand": "PostgreSQL"
   },
   {
-    "name": "Privatbank",
+    "name": "privatbank",
+    "title": "Privatbank",
     "path": "logos/privatbank.svg",
     "format": "SVG",
     "disable": false,
@@ -2239,7 +2444,8 @@
     ]
   },
   {
-    "name": "Privatbank",
+    "name": "privatbank_logo",
+    "title": "Privatbank",
     "path": "logos/privatbank_logo.svg",
     "format": "SVG",
     "disable": false,
@@ -2250,7 +2456,8 @@
     ]
   },
   {
-    "name": "Privat24",
+    "name": "privat24",
+    "title": "Privat24",
     "path": "logos/privat24.svg",
     "format": "SVG",
     "disable": false,
@@ -2261,7 +2468,8 @@
     ]
   },
   {
-    "name": "Privat24 Bussiness",
+    "name": "privat24bussiness",
+    "title": "Privat24 Bussiness",
     "path": "logos/privat24bussiness.svg",
     "format": "SVG",
     "disable": false,
@@ -2272,7 +2480,8 @@
     ]
   },
   {
-    "name": "Puma",
+    "name": "puma",
+    "title": "Puma",
     "path": "logos/puma.svg",
     "format": "SVG",
     "disable": false,
@@ -2284,7 +2493,8 @@
     "brand": "Puma"
   },
   {
-    "name": "Pumb",
+    "name": "pumb",
+    "title": "Pumb",
     "path": "logos/pumb.svg",
     "format": "SVG",
     "disable": false,
@@ -2295,7 +2505,8 @@
     ]
   },
   {
-    "name": "Python",
+    "name": "python",
+    "title": "Python",
     "path": "logos/python.svg",
     "format": "SVG",
     "disable": false,
@@ -2307,7 +2518,8 @@
     "brand": "Python"
   },
   {
-    "name": "Python",
+    "name": "python-logo",
+    "title": "Python",
     "path": "logos/python-logo.svg",
     "format": "SVG",
     "disable": false,
@@ -2319,7 +2531,8 @@
     "brand": "Python"
   },
   {
-    "name": "RabbitMQ",
+    "name": "rabbitmq",
+    "title": "RabbitMQ",
     "path": "logos/rabbitmq.svg",
     "format": "SVG",
     "disable": false,
@@ -2329,7 +2542,8 @@
     "brand": "RabbitMQ"
   },
   {
-    "name": "RabbitMQ",
+    "name": "rabbitmq-logo",
+    "title": "RabbitMQ",
     "path": "logos/rabbitmq-logo.svg",
     "format": "SVG",
     "disable": false,
@@ -2339,28 +2553,32 @@
     "brand": "RabbitMQ"
   },
   {
-    "name": "Raspberry Pi",
+    "name": "raspberry-pi",
+    "title": "Raspberry Pi",
     "path": "logos/raspberry-pi.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Raspberry Pi"
   },
   {
-    "name": "React",
+    "name": "react",
+    "title": "React",
     "path": "logos/react.svg",
     "format": "SVG",
     "disable": false,
     "brand": "React"
   },
   {
-    "name": "Reddit",
+    "name": "reddit-icon",
+    "title": "Reddit",
     "path": "logos/reddit-icon.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Reddit"
   },
   {
-    "name": "Redis",
+    "name": "redis",
+    "title": "Redis",
     "path": "logos/redis.svg",
     "format": "SVG",
     "disable": false,
@@ -2384,7 +2602,8 @@
     }
   },
   {
-    "name": "Redis",
+    "name": "redis-logo",
+    "title": "Redis",
     "path": "logos/redis-logo.svg",
     "format": "SVG",
     "disable": false,
@@ -2394,7 +2613,8 @@
     "brand": "Redis"
   },
   {
-    "name": "Reebok",
+    "name": "reebok",
+    "title": "Reebok",
     "path": "logos/reebok.svg",
     "format": "SVG",
     "disable": false,
@@ -2406,7 +2626,8 @@
     ]
   },
   {
-    "name": "Revolut",
+    "name": "revolut",
+    "title": "Revolut",
     "path": "logos/revolut.svg",
     "format": "SVG",
     "disable": false,
@@ -2418,7 +2639,8 @@
     ]
   },
   {
-    "name": "RoomerIN",
+    "name": "roomerin",
+    "title": "RoomerIN",
     "path": "logos/roomerin.svg",
     "format": "SVG",
     "disable": false,
@@ -2443,7 +2665,8 @@
     }
   },
   {
-    "name": "Sainsbury's",
+    "name": "sainsburys",
+    "title": "Sainsbury's",
     "path": "logos/sainsburys.svg",
     "format": "SVG",
     "disable": false,
@@ -2454,7 +2677,8 @@
     "brand": "Sainsbury's"
   },
   {
-    "name": "Samsung",
+    "name": "samsung",
+    "title": "Samsung",
     "path": "logos/samsung.svg",
     "format": "SVG",
     "disable": false,
@@ -2467,7 +2691,8 @@
     "brand": "Samsung"
   },
   {
-    "name": "Sendpulse",
+    "name": "sendpulse",
+    "title": "Sendpulse",
     "path": "logos/sendpulse.svg",
     "format": "SVG",
     "disable": false,
@@ -2478,7 +2703,8 @@
     ]
   },
   {
-    "name": "Sendpulse Logo",
+    "name": "sendpulse_logo",
+    "title": "Sendpulse Logo",
     "path": "logos/sendpulse_logo.svg",
     "format": "SVG",
     "disable": false,
@@ -2490,6 +2716,7 @@
   },
   {
     "name": "shadoll",
+    "title": "shadoll",
     "path": "logos/shadoll.svg",
     "format": "SVG",
     "disable": false,
@@ -2536,7 +2763,8 @@
     }
   },
   {
-    "name": "Shkafnik",
+    "name": "shkafnik",
+    "title": "Shkafnik",
     "path": "logos/shkafnik.svg",
     "format": "SVG",
     "disable": false,
@@ -2546,7 +2774,8 @@
     ]
   },
   {
-    "name": "Shkafnik",
+    "name": "shkafnik_logo",
+    "title": "Shkafnik",
     "path": "logos/shkafnik_logo.svg",
     "format": "SVG",
     "disable": false,
@@ -2556,7 +2785,8 @@
     ]
   },
   {
-    "name": "Siemens",
+    "name": "siemens",
+    "title": "Siemens",
     "path": "logos/siemens.svg",
     "format": "SVG",
     "disable": false,
@@ -2567,7 +2797,8 @@
     "brand": "Siemens"
   },
   {
-    "name": "Signal",
+    "name": "signal",
+    "title": "Signal",
     "path": "logos/signal.svg",
     "format": "SVG",
     "disable": false,
@@ -2589,7 +2820,8 @@
     }
   },
   {
-    "name": "Signal",
+    "name": "signal-logo",
+    "title": "Signal",
     "path": "logos/signal-logo.svg",
     "format": "SVG",
     "disable": false,
@@ -2611,7 +2843,8 @@
     }
   },
   {
-    "name": "Silpo",
+    "name": "silpo",
+    "title": "Silpo",
     "path": "logos/silpo.svg",
     "format": "SVG",
     "disable": false,
@@ -2622,7 +2855,8 @@
     ]
   },
   {
-    "name": "Skechers",
+    "name": "skechers",
+    "title": "Skechers",
     "path": "logos/skechers.svg",
     "format": "SVG",
     "disable": false,
@@ -2650,35 +2884,40 @@
     }
   },
   {
-    "name": "Spotify",
+    "name": "spotify",
+    "title": "Spotify",
     "path": "logos/spotify.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Spotify"
   },
   {
-    "name": "Spotify",
+    "name": "spotify-icon",
+    "title": "Spotify",
     "path": "logos/spotify-icon.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Spotify"
   },
   {
-    "name": "Stackoverflow",
+    "name": "stackoverflow",
+    "title": "Stackoverflow",
     "path": "logos/stackoverflow.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Stackoverflow"
   },
   {
-    "name": "Stackoverflow",
+    "name": "stackoverflow-icon",
+    "title": "Stackoverflow",
     "path": "logos/stackoverflow-icon.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Stackoverflow"
   },
   {
-    "name": "Starbucks",
+    "name": "starbucks",
+    "title": "Starbucks",
     "path": "logos/starbucks.svg",
     "format": "SVG",
     "disable": false,
@@ -2690,7 +2929,8 @@
     "brand": "Starbucks"
   },
   {
-    "name": "Suzuki",
+    "name": "suzuki",
+    "title": "Suzuki",
     "path": "logos/suzuki.svg",
     "format": "SVG",
     "disable": false,
@@ -2701,7 +2941,8 @@
     "brand": "Suzuki"
   },
   {
-    "name": "Suzuki",
+    "name": "suzuki_vertical",
+    "title": "Suzuki",
     "path": "logos/suzuki_vertical.svg",
     "format": "SVG",
     "disable": false,
@@ -2712,21 +2953,24 @@
     "brand": "Suzuki"
   },
   {
-    "name": "Svelte",
+    "name": "svelte-icon",
+    "title": "Svelte",
     "path": "logos/svelte-icon.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Svelte"
   },
   {
-    "name": "Swagger",
+    "name": "swagger",
+    "title": "Swagger",
     "path": "logos/swagger.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Swagger"
   },
   {
-    "name": "Swift",
+    "name": "swift",
+    "title": "Swift",
     "path": "logos/swift.svg",
     "format": "SVG",
     "disable": false,
@@ -2737,7 +2981,8 @@
     "brand": "Apple"
   },
   {
-    "name": "Tesla",
+    "name": "tesla",
+    "title": "Tesla",
     "path": "logos/tesla.svg",
     "format": "SVG",
     "disable": false,
@@ -2759,7 +3004,8 @@
     }
   },
   {
-    "name": "Threads",
+    "name": "meta-threads",
+    "title": "Threads",
     "path": "logos/meta-threads.svg",
     "format": "SVG",
     "disable": false,
@@ -2770,7 +3016,8 @@
     "brand": "Meta"
   },
   {
-    "name": "Toyota",
+    "name": "toyota",
+    "title": "Toyota",
     "path": "logos/toyota.svg",
     "format": "SVG",
     "disable": false,
@@ -2792,7 +3039,8 @@
     }
   },
   {
-    "name": "Toyota",
+    "name": "toyota_logo",
+    "title": "Toyota",
     "path": "logos/toyota_logo.svg",
     "format": "SVG",
     "disable": false,
@@ -2814,7 +3062,8 @@
     }
   },
   {
-    "name": "Ubuntu",
+    "name": "ubuntu",
+    "title": "Ubuntu",
     "path": "logos/ubuntu.svg",
     "format": "SVG",
     "disable": false,
@@ -2826,7 +3075,8 @@
     "brand": "Ubuntu"
   },
   {
-    "name": "@UKR.NET Mail",
+    "name": "ukrnet",
+    "title": "@UKR.NET Mail",
     "path": "logos/ukrnet.svg",
     "format": "SVG",
     "disable": false,
@@ -2838,14 +3088,16 @@
     "brand": "Ukrnet"
   },
   {
-    "name": "Ubuntu",
+    "name": "ubuntu-logo",
+    "title": "Ubuntu",
     "path": "logos/ubuntu-logo.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Ubuntu"
   },
   {
-    "name": "Ukrposhta",
+    "name": "ukrposhta",
+    "title": "Ukrposhta",
     "path": "logos/ukrposhta.svg",
     "format": "SVG",
     "disable": false,
@@ -2856,7 +3108,8 @@
     "brand": "Ukrposhta"
   },
   {
-    "name": "Viber",
+    "name": "viber",
+    "title": "Viber",
     "path": "logos/viber.svg",
     "format": "SVG",
     "disable": false,
@@ -2881,7 +3134,8 @@
     }
   },
   {
-    "name": "Vintage",
+    "name": "vintage",
+    "title": "Vintage",
     "path": "logos/vintage.svg",
     "format": "SVG",
     "disable": false,
@@ -2891,14 +3145,16 @@
     "brand": "Vintage"
   },
   {
-    "name": "Visual Studio Code",
+    "name": "visual-studio-code",
+    "title": "Visual Studio Code",
     "path": "logos/visual-studio-code.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Microsoft"
   },
   {
-    "name": "Vodafone",
+    "name": "vodafone",
+    "title": "Vodafone",
     "path": "logos/vodafone.svg",
     "format": "SVG",
     "disable": false,
@@ -2909,7 +3165,8 @@
     ]
   },
   {
-    "name": "Visa",
+    "name": "visa",
+    "title": "Visa",
     "path": "logos/visa.svg",
     "format": "SVG",
     "disable": false,
@@ -2920,42 +3177,48 @@
     "brand": "Visa"
   },
   {
-    "name": "Vue",
+    "name": "vue",
+    "title": "Vue",
     "path": "logos/vue.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Vue"
   },
   {
-    "name": "Webhooks",
+    "name": "webhooks",
+    "title": "Webhooks",
     "path": "logos/webhooks.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Webhooks"
   },
   {
-    "name": "Webkit",
+    "name": "webkit",
+    "title": "Webkit",
     "path": "logos/webkit.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Webkit"
   },
   {
-    "name": "Webtorrent",
+    "name": "webtorrent",
+    "title": "Webtorrent",
     "path": "logos/webtorrent.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Webtorrent"
   },
   {
-    "name": "Wifi",
+    "name": "wifi",
+    "title": "Wifi",
     "path": "logos/wifi.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Wifi"
   },
   {
-    "name": "Wireguard",
+    "name": "wireguard",
+    "title": "Wireguard",
     "path": "logos/wireguard.svg",
     "format": "SVG",
     "disable": false,
@@ -2986,7 +3249,8 @@
     }
   },
   {
-    "name": "Wise",
+    "name": "wise",
+    "title": "Wise",
     "path": "logos/wise.svg",
     "format": "SVG",
     "disable": false,
@@ -2997,14 +3261,16 @@
     ]
   },
   {
-    "name": "Wise",
+    "name": "wise-icon",
+    "title": "Wise",
     "path": "logos/wise-icon.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Wise"
   },
   {
-    "name": "WOG",
+    "name": "wog",
+    "title": "WOG",
     "path": "logos/wog.svg",
     "format": "SVG",
     "disable": false,
@@ -3014,28 +3280,32 @@
     "brand": "WOG"
   },
   {
-    "name": "Yahoo",
+    "name": "yahoo",
+    "title": "Yahoo",
     "path": "logos/yahoo.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Yahoo"
   },
   {
-    "name": "Yahoo Logo",
+    "name": "yahoo_logo",
+    "title": "Yahoo Logo",
     "path": "logos/yahoo_logo.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Yahoo"
   },
   {
-    "name": "Yahoo Mail",
+    "name": "yahoo_mail",
+    "title": "Yahoo Mail",
     "path": "logos/yahoo_mail.svg",
     "format": "SVG",
     "disable": false,
     "brand": "Yahoo"
   },
   {
-    "name": "Youtube",
+    "name": "youtube",
+    "title": "Youtube",
     "path": "logos/youtube.svg",
     "format": "SVG",
     "disable": false,
@@ -3043,7 +3313,8 @@
     "brand": "Youtube"
   },
   {
-    "name": "Zigbee2mqtt",
+    "name": "zigbee2mqtt",
+    "title": "Zigbee2mqtt",
     "path": "logos/zigbee2mqtt.svg",
     "format": "SVG",
     "disable": false,
@@ -3055,7 +3326,8 @@
     ]
   },
   {
-    "name": "Zoom",
+    "name": "zoom",
+    "title": "Zoom",
     "path": "logos/zoom.svg",
     "format": "SVG",
     "disable": false,
@@ -3067,7 +3339,8 @@
     ]
   },
   {
-    "name": "Zoom",
+    "name": "zoom-icon",
+    "title": "Zoom",
     "path": "logos/zoom-icon.svg",
     "format": "SVG",
     "disable": false,
@@ -3079,7 +3352,8 @@
     ]
   },
   {
-    "name": "Банк Власний Рахунок",
+    "name": "bvr",
+    "title": "Банк Власний Рахунок",
     "path": "logos/bvr.svg",
     "format": "SVG",
     "disable": false,
@@ -3089,4 +3363,4 @@
     ],
     "brand": "Bvr"
   }
-]
+]
\ No newline at end of file
diff --git a/src/App.svelte b/src/App.svelte
index 5aa88bb..443f13d 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -39,6 +39,7 @@
       window.appData.filteredLogos = window.appData.logos.filter((logo) => {
         const matchesSearch =
           logo.name.toLowerCase().includes(val.toLowerCase()) ||
+          (logo.title && logo.title.toLowerCase().includes(val.toLowerCase())) ||
           (logo.brand && logo.brand.toLowerCase().includes(val.toLowerCase()));
         const matchesTags =
           !selectedTags.length ||
@@ -349,6 +350,7 @@
   $: filteredLogos = logos.filter((logo) => {
     const matchesSearch =
       logo.name.toLowerCase().includes(searchQuery.toLowerCase()) ||
+      (logo.title && logo.title.toLowerCase().includes(searchQuery.toLowerCase())) ||
       (logo.brand &&
         logo.brand.toLowerCase().includes(searchQuery.toLowerCase()));
     const matchesTags =
@@ -704,6 +706,7 @@
       window.appData.filteredLogos = window.appData.logos.filter((logo) => {
         const matchesSearch =
           logo.name.toLowerCase().includes(searchQuery.toLowerCase()) ||
+          (logo.title && logo.title.toLowerCase().includes(searchQuery.toLowerCase())) ||
           (logo.brand && logo.brand.toLowerCase().includes(searchQuery.toLowerCase()));
         const matchesTags =
           !selectedTags.length ||
diff --git a/src/components/CardFull.svelte b/src/components/CardFull.svelte
index 229d989..d8a5a33 100644
--- a/src/components/CardFull.svelte
+++ b/src/components/CardFull.svelte
@@ -132,7 +132,7 @@
   {#if logo}
     <div class="modal-header">
       <div class="header-spacer"></div>
-      <h2>{logo.name}</h2>
+      <h2>{logo.title || logo.name}</h2>
       <div class="header-spacer"></div>
     </div>
     <div class="preview-body">
@@ -149,10 +149,10 @@
             sets={logo.sets}
             colors={logo.colors}
             activeSet={logo._activeSet}
-            alt={logo.name}
+            alt={logo.title || logo.name}
           />
         {:else}
-          <img src={logo.path} alt={logo.name} />
+          <img src={logo.path} alt={logo.title || logo.name} />
         {/if}
       </div>
       <div class="right-column">
@@ -185,6 +185,13 @@
               {/each}
             </div>
           {/if}
+          {#if logo.variants && logo.variants.length}
+              <div class="variants-list">
+                {#each logo.variants as variant}
+                  <span class="logo-variant">{variant}</span>
+                {/each}
+              </div>
+          {/if}
         </div>
 
         <div class="preview-actions-container">
@@ -295,6 +302,13 @@
     flex-wrap: wrap;
     gap: 0.5rem;
   }
+
+  .variants-list {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.5rem;
+    margin-top: 0.5rem;
+  }
   .logo-tag {
     display: inline-block;
     background: var(--color-accent);
@@ -309,6 +323,25 @@
     margin-bottom: 0.2em;
     transition: background 0.2s;
   }
+
+  .logo-variant {
+    display: inline-block;
+    background: #9b59b6;
+    color: white;
+    border-radius: 12px;
+    padding: 0.2em 0.8em;
+    font-size: 0.85em;
+    font-weight: 500;
+    letter-spacing: 0.02em;
+    margin-right: 0.3em;
+    margin-top: 0.2em;
+    margin-bottom: 0.2em;
+    transition: background 0.2s;
+  }
+
+  .logo-variant:hover {
+    background: #8e44ad;
+  }
   .preview-actions-container {
     width: 100%;
     background: var(--color-card);
diff --git a/src/components/CardMiddle.svelte b/src/components/CardMiddle.svelte
index 2b5eb22..1a0de85 100644
--- a/src/components/CardMiddle.svelte
+++ b/src/components/CardMiddle.svelte
@@ -51,16 +51,16 @@
           sets={logo.sets}
           colors={logo.colors}
           activeSet={logo._activeSet}
-          alt={logo.name}
+          alt={logo.title || logo.name}
         />
       {/key}
     {:else}
-      <img src={logo.path} alt={logo.name} />
+      <img src={logo.path} alt={logo.title || logo.name}/>
     {/if}
   </div>
   <div class="logo-info">
     <div class="logo-title-row">
-      <h3>{logo.name}</h3>
+      <h3>{logo.title || logo.name}</h3>
       {#if logo.brand}
         <button
           class="brand-filter-btn"
diff --git a/src/components/CardSmall.svelte b/src/components/CardSmall.svelte
index c5bc369..2ba7acf 100644
--- a/src/components/CardSmall.svelte
+++ b/src/components/CardSmall.svelte
@@ -55,12 +55,12 @@
         />
       {/key}
     {:else}
-      <img src={logo.path} alt={logo.name} />
+      <img src={logo.path} alt={logo.title || logo.name} />
     {/if}
   </div>
   <div class="logo-content">
     <div class="logo-header">
-      <h3>{logo.name}</h3>
+      <h3>{logo.title || logo.name}</h3>
       {#if logo.brand}
         <button
           class="brand-filter-btn"
diff --git a/src/components/CardTiny.svelte b/src/components/CardTiny.svelte
index 15dd7ff..a65415a 100644
--- a/src/components/CardTiny.svelte
+++ b/src/components/CardTiny.svelte
@@ -51,10 +51,10 @@
         sets={logo.sets}
         colors={logo.colors}
         activeSet={logo._activeSet}
-        alt={logo.name}
+        alt={logo.title || logo.name}
       />
     {:else}
-      <img src={logo.path} alt={logo.name} />
+      <img src={logo.path} alt={logo.title || logo.name} />
     {/if}
   </div>
   {#if logo.colors}
@@ -63,7 +63,7 @@
       logo._activeSet = setName;
     }} />
   {/if}
-  <div class="name">{logo.name}</div>
+  <div class="name">{logo.title || logo.name}</div>
 </div>
 
 <style>
diff --git a/src/pages/Preview.svelte b/src/pages/Preview.svelte
index 068ff2b..674b76c 100644
--- a/src/pages/Preview.svelte
+++ b/src/pages/Preview.svelte
@@ -22,8 +22,10 @@
         }
         const logoName = params.logoName.replace(/-/g, ' ');
         logo = logos.find(l =>
+          l.name.toLowerCase() === params.logoName.toLowerCase() ||
           l.name.toLowerCase().replace(/\s+/g, '-') === params.logoName.toLowerCase() ||
-          l.name.toLowerCase() === logoName.toLowerCase()
+          (l.title && l.title.toLowerCase() === logoName.toLowerCase()) ||
+          (l.title && l.title.toLowerCase().replace(/\s+/g, '-') === params.logoName.toLowerCase())
         );
         if (!logo) {
           console.error("Logo not found:", params.logoName);