src/features/DisplayFont/ui/FontSampler/FontSampler.svelte

@@ -94,14 +94,14 @@ const stats = $derived([
             </span>
 
             {#if fontType}
-                <Badge size="xs" variant="default" class="text-nowrap font-mono">
+                <Badge size="xs" variant="default" nowrap>
                     {fontType}
                 </Badge>
             {/if}
 
             <!-- Provider badge -->
             {#if providerBadge}
-                <Badge size="xs" variant="default" class="text-nowrap font-mono" data-provider={font.provider}>
+                <Badge size="xs" variant="default" nowrap data-provider={font.provider}>
                     {providerBadge}
                 </Badge>
             {/if}

src/shared/ui/Badge/Badge.svelte

@@ -37,6 +37,11 @@ interface Props extends HTMLAttributes<HTMLSpanElement> {
      * @default false
      */
     dot?: boolean;
+    /**
+     * Prevent text wrapping
+     * @default false
+     */
+    nowrap?: boolean;
     /**
      * Content snippet
      */
@@ -51,6 +56,7 @@ let {
     variant = 'default',
     size = 'xs',
     dot = false,
+    nowrap = false,
     children,
     class: className,
     ...rest
@@ -63,6 +69,7 @@ let {
         'font-mono uppercase tracking-wide',
         labelSizeConfig[size],
         badgeVariantConfig[variant],
+        nowrap && 'text-nowrap',
         className,
     )}
     {...rest}