cybercore-css 0.2.5 → 0.3.0

package/README.md

@@ -74,13 +74,44 @@ npm install cybercore-css
 
 ![Glitch Effect](assets/img.png)
 
-_Glitch text effect with chromatic aberration and animated distortion_
+_Glitch text effect with chromatic aberration, scanlines, and animated
+distortion_
 
 ### Neon Border
 
 ![Neon Border](assets/img_1.png)
 
-_Animated neon glow border effect with pulsing illumination_
+_Animated neon glow borders in cyan, magenta, and green variants_
+
+### Terminal
+
+![Terminal](assets/terminal.png)
+
+_Cyberpunk terminal component with scanlines and colored output_
+
+### Buttons
+
+![Buttons](assets/buttons.png)
+
+_Button variants: primary colors, outline, and ghost styles_
+
+### Cards
+
+![Cards](assets/cards.png)
+
+_Card components with datastream effect and interactive elements_
+
+### Icons
+
+![Icons](assets/icons.png)
+
+_153 cyberpunk-themed SVG icons across 10 categories with search and filters_
+
+### Dashboard Showcase
+
+![Dashboard](assets/showcase.png)
+
+_Full dashboard example combining multiple CYBERCORE components_
 
 </div>
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cybercore-css",
-  "version": "0.2.5",
+  "version": "0.3.0",
   "type": "module",
   "description": "A pure CSS cyberpunk design system inspired by Cyberpunk 2077. Zero JavaScript, framework-agnostic, 2026+ optimized.",
   "main": "dist/cybercore.css",

package/src/icons/defs/actions/check.ts

@@ -10,25 +10,19 @@ export const check: IconDefinition = {
   description: 'Confirm or mark complete',
   tags: ['check', 'checkmark', 'confirm', 'done', 'success'],
   svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M20 6L9 17l-5-5"/>
-  <circle cx="9" cy="17" r="1"/>
-  <line x1="7" y1="10" x2="9" y2="12"/>
+  <polyline points="4 12 9 17 20 6"/>
 </svg>`,
   variants: {
     solid: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
   <path d="M20.71 5.29a1 1 0 0 1 0 1.42l-11 11a1 1 0 0 1-1.42 0l-5-5a1 1 0 1 1 1.42-1.42L9 15.59l10.29-10.3a1 1 0 0 1 1.42 0z"/>
 </svg>`,
     duotone: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M4 12l5 5L20 6" fill="currentColor" opacity="0.3"/>
-  <path d="M20 6L9 17l-5-5"/>
-  <circle cx="9" cy="17" r="1"/>
-  <line x1="7" y1="10" x2="9" y2="12"/>
+  <polyline points="4 12 9 17 20 6" stroke-width="3" opacity="0.3"/>
+  <polyline points="4 12 9 17 20 6"/>
 </svg>`,
     glitch: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M20 6L9 17l-5-5" transform="translate(1,-1)" opacity="0.5"/>
-  <path d="M20 6L9 17l-5-5"/>
-  <circle cx="9" cy="17" r="1"/>
-  <line x1="7" y1="10" x2="9" y2="12"/>
+  <polyline points="4 12 9 17 20 6" transform="translate(1,-1)" opacity="0.5"/>
+  <polyline points="4 12 9 17 20 6"/>
 </svg>`,
   },
 };

package/src/icons/defs/actions/cut.ts

@@ -10,33 +10,36 @@ export const cut: IconDefinition = {
   description: 'Cut to clipboard',
   tags: ['cut', 'scissors', 'clipboard', 'remove', 'snip'],
   svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <circle cx="6" cy="18" r="2"/>
-  <circle cx="18" cy="18" r="2"/>
-  <path d="M8 18l4-9 4 9"/>
-  <path d="M12 9l8-6"/>
-  <line x1="8" y1="3" x2="12" y2="9"/>
+  <circle cx="6" cy="6" r="3"/>
+  <circle cx="6" cy="18" r="3"/>
+  <line x1="20" y1="4" x2="8.12" y2="15.88"/>
+  <line x1="14.47" y1="9.53" x2="20" y2="20"/>
+  <line x1="8.12" y1="8.12" x2="12" y2="12"/>
 </svg>`,
   variants: {
     solid: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
-  <path d="M6 15a3 3 0 1 0 0 6 3 3 0 0 0 0-6zm12 0a3 3 0 1 0 0 6 3 3 0 0 0 0-6zm-9.5 1.5l3.5-7.5 3.5 7.5h-7zm3.5-8.5l7.5-5.5a1 1 0 0 1 1.2 1.6l-8 5.9a1 1 0 0 1-1.4 0L4.3 3.6a1 1 0 1 1 1.2-1.6L12 7.5z"/>
+  <circle cx="6" cy="6" r="3"/>
+  <circle cx="6" cy="18" r="3"/>
+  <path d="M19.3 3.3a1 1 0 0 1 0 1.4l-11 11a1 1 0 0 1-1.4-1.4l11-11a1 1 0 0 1 1.4 0z"/>
+  <path d="M14 9l6 11a1 1 0 0 1-1.7 1l-5-9z"/>
 </svg>`,
     duotone: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <circle cx="6" cy="18" r="2" fill="currentColor" opacity="0.3"/>
-  <circle cx="18" cy="18" r="2" fill="currentColor" opacity="0.3"/>
-  <circle cx="6" cy="18" r="2"/>
-  <circle cx="18" cy="18" r="2"/>
-  <path d="M8 18l4-9 4 9"/>
-  <path d="M12 9l8-6"/>
-  <line x1="8" y1="3" x2="12" y2="9"/>
+  <circle cx="6" cy="6" r="3" fill="currentColor" opacity="0.3"/>
+  <circle cx="6" cy="18" r="3" fill="currentColor" opacity="0.3"/>
+  <circle cx="6" cy="6" r="3"/>
+  <circle cx="6" cy="18" r="3"/>
+  <line x1="20" y1="4" x2="8.12" y2="15.88"/>
+  <line x1="14.47" y1="9.53" x2="20" y2="20"/>
+  <line x1="8.12" y1="8.12" x2="12" y2="12"/>
 </svg>`,
     glitch: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <circle cx="6" cy="18" r="2" transform="translate(1,-1)" opacity="0.5"/>
-  <circle cx="18" cy="18" r="2" transform="translate(1,-1)" opacity="0.5"/>
-  <circle cx="6" cy="18" r="2"/>
-  <circle cx="18" cy="18" r="2"/>
-  <path d="M8 18l4-9 4 9"/>
-  <path d="M12 9l8-6"/>
-  <line x1="8" y1="3" x2="12" y2="9"/>
+  <circle cx="6" cy="6" r="3" transform="translate(1,-1)" opacity="0.5"/>
+  <circle cx="6" cy="18" r="3" transform="translate(1,-1)" opacity="0.5"/>
+  <circle cx="6" cy="6" r="3"/>
+  <circle cx="6" cy="18" r="3"/>
+  <line x1="20" y1="4" x2="8.12" y2="15.88"/>
+  <line x1="14.47" y1="9.53" x2="20" y2="20"/>
+  <line x1="8.12" y1="8.12" x2="12" y2="12"/>
 </svg>`,
   },
 };

package/src/icons/defs/actions/double-check.ts

@@ -0,0 +1,36 @@
+/**
+ * Double Check Icon
+ * @category actions
+ */
+import type { IconDefinition } from '../../types';
+
+export const doubleCheck: IconDefinition = {
+  name: 'double-check',
+  category: 'actions',
+  description: 'Double checkmark for read/delivered status',
+  tags: ['check', 'checkmark', 'confirm', 'read', 'delivered', 'double'],
+  svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
+  <polyline points="2 12 7 17 13 9"/>
+  <polyline points="8 12 13 17 22 6"/>
+</svg>`,
+  variants: {
+    solid: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
+  <path d="M13.71 8.29a1 1 0 0 1 0 1.42l-6 6a1 1 0 0 1-1.42 0l-5-5a1 1 0 1 1 1.42-1.42L7 13.59l5.29-5.3a1 1 0 0 1 1.42 0z"/>
+  <path d="M22.71 5.29a1 1 0 0 1 0 1.42l-9 9a1 1 0 0 1-1.42 0l-3-3a1 1 0 1 1 1.42-1.42L13 13.59l8.29-8.3a1 1 0 0 1 1.42 0z"/>
+</svg>`,
+    duotone: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
+  <polyline points="2 12 7 17 13 9" stroke-width="3" opacity="0.3"/>
+  <polyline points="8 12 13 17 22 6" stroke-width="3" opacity="0.3"/>
+  <polyline points="2 12 7 17 13 9"/>
+  <polyline points="8 12 13 17 22 6"/>
+</svg>`,
+    glitch: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
+  <polyline points="2 12 7 17 13 9" transform="translate(1,-1)" opacity="0.5"/>
+  <polyline points="8 12 13 17 22 6" transform="translate(1,-1)" opacity="0.5"/>
+  <polyline points="2 12 7 17 13 9"/>
+  <polyline points="8 12 13 17 22 6"/>
+</svg>`,
+  },
+};
+
+export default doubleCheck;

package/src/icons/defs/actions/index.ts

@@ -20,6 +20,7 @@ export { redo } from './redo';
 export { plus } from './plus';
 export { minus } from './minus';
 export { check } from './check';
+export { doubleCheck } from './double-check';
 export { x } from './x';
 export { refresh } from './refresh';
 export { drag } from './drag';

package/src/icons/defs/actions/minus.ts

@@ -10,31 +10,19 @@ export const minus: IconDefinition = {
   description: 'Remove or subtract item',
   tags: ['minus', 'remove', 'subtract', 'delete', 'decrease'],
   svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M5 12h14"/>
-  <circle cx="5" cy="12" r="1"/>
-  <circle cx="19" cy="12" r="1"/>
-  <line x1="8" y1="9" x2="6" y2="11"/>
-  <line x1="16" y1="9" x2="18" y2="11"/>
+  <line x1="5" y1="12" x2="19" y2="12"/>
 </svg>`,
   variants: {
     solid: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
-  <path d="M4 12a1 1 0 0 1 1-1h14a1 1 0 0 1 0 2H5a1 1 0 0 1-1-1z"/>
+  <rect x="4" y="11" width="16" height="2" rx="1"/>
 </svg>`,
     duotone: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M5 11h14v2H5z" fill="currentColor" opacity="0.3"/>
-  <path d="M5 12h14"/>
-  <circle cx="5" cy="12" r="1"/>
-  <circle cx="19" cy="12" r="1"/>
-  <line x1="8" y1="9" x2="6" y2="11"/>
-  <line x1="16" y1="9" x2="18" y2="11"/>
+  <rect x="5" y="11" width="14" height="2" fill="currentColor" opacity="0.3"/>
+  <line x1="5" y1="12" x2="19" y2="12"/>
 </svg>`,
     glitch: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M5 12h14" transform="translate(1,-1)" opacity="0.5"/>
-  <path d="M5 12h14"/>
-  <circle cx="5" cy="12" r="1"/>
-  <circle cx="19" cy="12" r="1"/>
-  <line x1="8" y1="9" x2="6" y2="11"/>
-  <line x1="16" y1="9" x2="18" y2="11"/>
+  <line x1="5" y1="12" x2="19" y2="12" transform="translate(1,-1)" opacity="0.5"/>
+  <line x1="5" y1="12" x2="19" y2="12"/>
 </svg>`,
   },
 };

package/src/icons/defs/actions/unlink.ts

@@ -10,33 +10,41 @@ export const unlink: IconDefinition = {
   description: 'Break or remove link',
   tags: ['unlink', 'broken-chain', 'disconnect', 'remove-link', 'detach'],
   svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M10 13a5 5 0 0 0 7.54.54l1.5-1.5"/>
-  <path d="M14 11a5 5 0 0 0-7.54-.54l-1.5 1.5"/>
-  <line x1="3" y1="3" x2="21" y2="21"/>
-  <path d="M18 6l1.5-1.5"/>
-  <path d="M6 18l-1.5 1.5"/>
+  <path d="M18.84 12.25l1.72-1.71a5 5 0 0 0-7.08-7.08l-1.71 1.72"/>
+  <path d="M5.16 11.75l-1.72 1.71a5 5 0 0 0 7.08 7.08l1.71-1.72"/>
+  <line x1="8" y1="2" x2="8" y2="5"/>
+  <line x1="2" y1="8" x2="5" y2="8"/>
+  <line x1="16" y1="19" x2="16" y2="22"/>
+  <line x1="19" y1="16" x2="22" y2="16"/>
 </svg>`,
   variants: {
     solid: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
-  <path d="M2.29 2.29a1 1 0 0 1 1.42 0l18 18a1 1 0 0 1-1.42 1.42l-18-18a1 1 0 0 1 0-1.42zm17.13 2.42a7 7 0 0 1 1.1 8.87l-1.81-1.81a5 5 0 0 0-5.24-7.24l-1.8-1.81a7 7 0 0 1 7.75 1.99zM4.58 19.29a7 7 0 0 1-1.1-8.87l1.81 1.81a5 5 0 0 0 5.24 7.24l1.8 1.81a7 7 0 0 1-7.75-1.99z"/>
+  <path d="M18.84 12.25l1.72-1.71a5 5 0 0 0-7.08-7.08l-1.71 1.72"/>
+  <path d="M5.16 11.75l-1.72 1.71a5 5 0 0 0 7.08 7.08l1.71-1.72"/>
+  <rect x="7" y="1" width="2" height="4"/>
+  <rect x="1" y="7" width="4" height="2"/>
+  <rect x="15" y="19" width="2" height="4"/>
+  <rect x="19" y="15" width="4" height="2"/>
 </svg>`,
     duotone: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M10 13a5 5 0 0 0 7.54.54l1.5-1.5" fill="currentColor" opacity="0.3"/>
-  <path d="M14 11a5 5 0 0 0-7.54-.54l-1.5 1.5" fill="currentColor" opacity="0.3"/>
-  <path d="M10 13a5 5 0 0 0 7.54.54l1.5-1.5"/>
-  <path d="M14 11a5 5 0 0 0-7.54-.54l-1.5 1.5"/>
-  <line x1="3" y1="3" x2="21" y2="21"/>
-  <path d="M18 6l1.5-1.5"/>
-  <path d="M6 18l-1.5 1.5"/>
+  <path d="M18.84 12.25l1.72-1.71a5 5 0 0 0-7.08-7.08l-1.71 1.72" stroke-width="3" opacity="0.3"/>
+  <path d="M5.16 11.75l-1.72 1.71a5 5 0 0 0 7.08 7.08l1.71-1.72" stroke-width="3" opacity="0.3"/>
+  <path d="M18.84 12.25l1.72-1.71a5 5 0 0 0-7.08-7.08l-1.71 1.72"/>
+  <path d="M5.16 11.75l-1.72 1.71a5 5 0 0 0 7.08 7.08l1.71-1.72"/>
+  <line x1="8" y1="2" x2="8" y2="5"/>
+  <line x1="2" y1="8" x2="5" y2="8"/>
+  <line x1="16" y1="19" x2="16" y2="22"/>
+  <line x1="19" y1="16" x2="22" y2="16"/>
 </svg>`,
     glitch: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M10 13a5 5 0 0 0 7.54.54l1.5-1.5" transform="translate(1,-1)" opacity="0.5"/>
-  <path d="M14 11a5 5 0 0 0-7.54-.54l-1.5 1.5" transform="translate(-1,1)" opacity="0.5"/>
-  <path d="M10 13a5 5 0 0 0 7.54.54l1.5-1.5"/>
-  <path d="M14 11a5 5 0 0 0-7.54-.54l-1.5 1.5"/>
-  <line x1="3" y1="3" x2="21" y2="21"/>
-  <path d="M18 6l1.5-1.5"/>
-  <path d="M6 18l-1.5 1.5"/>
+  <path d="M18.84 12.25l1.72-1.71a5 5 0 0 0-7.08-7.08l-1.71 1.72" transform="translate(1,-1)" opacity="0.5"/>
+  <path d="M5.16 11.75l-1.72 1.71a5 5 0 0 0 7.08 7.08l1.71-1.72" transform="translate(-1,1)" opacity="0.5"/>
+  <path d="M18.84 12.25l1.72-1.71a5 5 0 0 0-7.08-7.08l-1.71 1.72"/>
+  <path d="M5.16 11.75l-1.72 1.71a5 5 0 0 0 7.08 7.08l1.71-1.72"/>
+  <line x1="8" y1="2" x2="8" y2="5"/>
+  <line x1="2" y1="8" x2="5" y2="8"/>
+  <line x1="16" y1="19" x2="16" y2="22"/>
+  <line x1="19" y1="16" x2="22" y2="16"/>
 </svg>`,
   },
 };

package/src/icons/defs/communication/phone-off.ts

@@ -10,24 +10,26 @@ export const phoneOff: IconDefinition = {
   description: 'End call (phone with X)',
   tags: ['phone', 'end', 'hangup', 'disconnect', 'off'],
   svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"/>
-  <line x1="2" y1="2" x2="22" y2="22"/>
+  <path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.88.36 1.72.7 2.53.15.36.08.78-.19 1.06l-1.27 1.27a16 16 0 0 0 6 6l1.27-1.27c.28-.27.7-.34 1.06-.19.81.34 1.65.57 2.53.7a2 2 0 0 1 1.72 2z"/>
+  <line x1="3" y1="3" x2="21" y2="21"/>
 </svg>`,
   variants: {
-    solid: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
-  <path d="M2.707 1.293a1 1 0 0 0-1.414 1.414l1.42 1.42A2 2 0 0 0 2 5.99c0 9.28 7.72 17 17.01 17 .54 0 .99-.26.99-.99v-3.45c0-.54-.45-.99-.99-.99-1.23 0-2.42-.2-3.53-.56-.28-.11-.59-.03-.79.17l-1.57 1.97c-1.16-.56-2.24-1.27-3.24-2.09l12.41-12.41a1 1 0 0 0-1.414-1.414L2.707 1.293zM8.09 9.91l-1.27 1.25c-.28.27-.36.67-.24 1.02.37 1.11.56 2.3.56 3.53 0 .54.45.99.99.99h3.46c.74 0 1.18-.83.75-1.45-.32-.47-.71-.91-1.16-1.31L8.09 9.91z"/>
-  <line x1="2" y1="2" x2="22" y2="22" stroke="currentColor" stroke-width="2"/>
+    solid: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" stroke="none">
+  <path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.88.36 1.72.7 2.53.15.36.08.78-.19 1.06l-1.27 1.27a16 16 0 0 0 6 6l1.27-1.27c.28-.27.7-.34 1.06-.19.81.34 1.65.57 2.53.7a2 2 0 0 1 1.72 2z"/>
+  <path d="M3.7 2.3L2.3 3.7l18 18 1.4-1.4-18-18z"/>
 </svg>`,
     duotone: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M10.68 13.31a16 16 0 0 0 3.41 2.6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7 2 2 0 0 1 1.72 2v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.42 19.42 0 0 1-3.33-2.67m-2.67-3.34a19.79 19.79 0 0 1-3.07-8.63A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91" fill="currentColor" opacity="0.3"/>
-  <path d="M10.68 13.31a16 16 0 0 0 3.41 2.6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7 2 2 0 0 1 1.72 2v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.42 19.42 0 0 1-3.33-2.67m-2.67-3.34a19.79 19.79 0 0 1-3.07-8.63A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91"/>
-  <line x1="22" y1="2" x2="2" y2="22"/>
+  <path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.88.36 1.72.7 2.53.15.36.08.78-.19 1.06l-1.27 1.27a16 16 0 0 0 6 6l1.27-1.27c.28-.27.7-.34 1.06-.19.81.34 1.65.57 2.53.7a2 2 0 0 1 1.72 2z" fill="currentColor" opacity="0.3"/>
+  <path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.88.36 1.72.7 2.53.15.36.08.78-.19 1.06l-1.27 1.27a16 16 0 0 0 6 6l1.27-1.27c.28-.27.7-.34 1.06-.19.81.34 1.65.57 2.53.7a2 2 0 0 1 1.72 2z"/>
+  <line x1="3" y1="3" x2="21" y2="21"/>
 </svg>`,
     glitch: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M10.68 13.31a16 16 0 0 0 3.41 2.6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7 2 2 0 0 1 1.72 2v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.42 19.42 0 0 1-3.33-2.67m-2.67-3.34a19.79 19.79 0 0 1-3.07-8.63A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91" transform="translate(1,-1)" opacity="0.5"/>
-  <path d="M10.68 13.31a16 16 0 0 0 3.41 2.6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7 2 2 0 0 1 1.72 2v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.42 19.42 0 0 1-3.33-2.67m-2.67-3.34a19.79 19.79 0 0 1-3.07-8.63A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91"/>
-  <line x1="22" y1="2" x2="2" y2="22" transform="translate(1,-1)" opacity="0.5"/>
-  <line x1="22" y1="2" x2="2" y2="22"/>
+  <g opacity="0.4" transform="translate(-0.5, 0.5)">
+    <path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.88.36 1.72.7 2.53.15.36.08.78-.19 1.06l-1.27 1.27a16 16 0 0 0 6 6l1.27-1.27c.28-.27.7-.34 1.06-.19.81.34 1.65.57 2.53.7a2 2 0 0 1 1.72 2z"/>
+    <line x1="3" y1="3" x2="21" y2="21"/>
+  </g>
+  <path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.88.36 1.72.7 2.53.15.36.08.78-.19 1.06l-1.27 1.27a16 16 0 0 0 6 6l1.27-1.27c.28-.27.7-.34 1.06-.19.81.34 1.65.57 2.53.7a2 2 0 0 1 1.72 2z"/>
+  <line x1="3" y1="3" x2="21" y2="21"/>
 </svg>`,
   },
 };

package/src/icons/defs/data/cloud.ts

@@ -10,8 +10,7 @@ export const cloud: IconDefinition = {
   description: 'Cloud storage',
   tags: ['cloud', 'storage', 'data', 'remote', 'server'],
   svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M17.5 19H9a7 7 0 1 1 6.71-9h1.79a4.5 4.5 0 1 1 0 9Z"/>
-  <path d="M14 10h.01"/>
+  <path d="M17.5 19H9a7 7 0 1 1 6.71-9h1.79a4.5 4.5 0 1 1 0 9z"/>
 </svg>`,
   variants: {
     solid: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">

package/src/icons/defs/data/sync.ts

@@ -10,10 +10,10 @@ export const sync: IconDefinition = {
   description: 'Synchronize data with bidirectional arrows',
   tags: ['sync', 'refresh', 'update', 'data', 'transfer', 'arrows'],
   svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M21 10V8a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v2"/>
-  <path d="M3 14v2a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-2"/>
-  <path d="M7 7l-4 3 4 3"/>
-  <path d="M17 17l4-3-4-3"/>
+  <path d="M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8"/>
+  <path d="M3 3v5h5"/>
+  <path d="M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16"/>
+  <path d="M16 16h5v5"/>
 </svg>`,
   variants: {
     solid: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">

package/src/icons/defs/files/attachment.ts

@@ -10,23 +10,19 @@ export const attachment: IconDefinition = {
   description: 'Attachment paperclip',
   tags: ['attachment', 'paperclip', 'attach', 'file'],
   svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M21 10v7a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V7a4 4 0 0 1 4-4h7"/>
-  <path d="M8 15c0 1.1.9 2 2 2h4a2 2 0 0 0 2-2V8"/>
+  <path d="M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48"/>
 </svg>`,
   variants: {
-    solid: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" stroke="none">
-  <path d="M21 10v7a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V7a4 4 0 0 1 4-4h7v2H7a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-7h2zM10 8v7a2 2 0 0 0 2 2h2a2 2 0 0 0 2-2V8h-6z"/>
+    solid: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
+  <path d="M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48" stroke="currentColor" stroke-width="2"/>
 </svg>`,
     duotone: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M21 10v7a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V7a4 4 0 0 1 4-4h7" fill="currentColor" opacity="0.3"/>
-  <path d="M21 10v7a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V7a4 4 0 0 1 4-4h7"/>
-  <path d="M8 15c0 1.1.9 2 2 2h4a2 2 0 0 0 2-2V8"/>
+  <path d="M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48" stroke-width="4" opacity="0.3"/>
+  <path d="M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48"/>
 </svg>`,
     glitch: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M21 10v7a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V7a4 4 0 0 1 4-4h7" transform="translate(1,-1)" opacity="0.5"/>
-  <path d="M21 10v7a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V7a4 4 0 0 1 4-4h7"/>
-  <path d="M8 15c0 1.1.9 2 2 2h4a2 2 0 0 0 2-2V8" transform="translate(-1,1)" opacity="0.5"/>
-  <path d="M8 15c0 1.1.9 2 2 2h4a2 2 0 0 0 2-2V8"/>
+  <path d="M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48" transform="translate(1,-1)" opacity="0.5"/>
+  <path d="M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48"/>
 </svg>`,
   },
 };

package/src/icons/defs/files/folder-open.ts

@@ -10,8 +10,8 @@ export const folderOpen: IconDefinition = {
   description: 'Open folder',
   tags: ['folder', 'directory', 'open', 'expanded'],
   svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 2h7a2 2 0 0 1 2 2v1"/>
-  <path d="M2 11h20v8a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2z"/>
+  <path d="M2 9V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2v1"/>
+  <path d="M2 9h20l-2 10a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2L2 9z"/>
 </svg>`,
   variants: {
     solid: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" stroke="none">

package/src/icons/defs/security/eye-off.ts

@@ -10,30 +10,30 @@ export const eyeOff: IconDefinition = {
   description: 'Hidden or hide content with slashed eye',
   tags: ['eye', 'hide', 'hidden', 'invisible', 'private', 'password'],
   svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M9.9 4.24A9.12 9.12 0 0112 4c7 0 10 7 10 7a18.5 18.5 0 01-2.16 3.19"/>
-  <path d="M14.12 14.12a3 3 0 11-4.24-4.24"/>
-  <path d="M6.61 6.61A13.5 13.5 0 002 12s3 7 10 7a9.74 9.74 0 005.39-1.61"/>
+  <path d="M2 12s3-7 10-7 10 7 10 7-3 7-10 7S2 12 2 12z"/>
+  <circle cx="12" cy="12" r="3"/>
   <line x1="3" y1="3" x2="21" y2="21"/>
 </svg>`,
   variants: {
-    solid: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
-  <path d="M3.7 2.3L2.3 3.7l2.4 2.4C3.2 7.8 1.5 11.5 1.5 12s3.3 7.5 10.5 7.5c1.7 0 3.2-.4 4.5-1l2.8 2.8 1.4-1.4L3.7 2.3zM12 16.5c-2.5 0-4.5-2-4.5-4.5 0-.8.2-1.5.6-2.1l1.5 1.5c0 .2-.1.4-.1.6 0 1.7 1.3 3 3 3 .2 0 .4 0 .6-.1l1.5 1.5c-.6.4-1.3.6-2.1.6l-.5.5zm10.5-4.5s-1.5-3.3-4.4-5.4l-1.5 1.5c1.5 1.2 2.5 2.7 3 3.9-.5 1.2-1.5 2.7-3 3.9L15 17.4c2.9-2.1 4.4-5.4 4.4-5.4l3.1.1zM12 7.5c.8 0 1.5.2 2.1.6l3.9-3.9C16.7 3.4 14.4 2.5 12 2.5 8.8 2.5 6 3.9 3.9 6.1l3.9 3.9c.6-.4 1.3-.6 2.1-.6 2.5 0 4.5 2 4.5 4.5 0 .8-.2 1.5-.6 2.1l1.5 1.5c1.2-1.5 1.9-3.4 1.9-5.5 0-4.4-3.6-8-8-8z"/>
+    solid: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" stroke="none">
+  <path d="M12 5c-7 0-10 7-10 7s3 7 10 7 10-7 10-7-3-7-10-7zm0 11a4 4 0 1 1 0-8 4 4 0 0 1 0 8z"/>
+  <circle cx="12" cy="12" r="2"/>
+  <path d="M3.7 2.3L2.3 3.7l18 18 1.4-1.4-18-18z"/>
 </svg>`,
     duotone: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M9.9 4.24A9.12 9.12 0 0112 4c7 0 10 7 10 7a18.5 18.5 0 01-2.16 3.19" fill="currentColor" opacity="0.3"/>
-  <path d="M9.9 4.24A9.12 9.12 0 0112 4c7 0 10 7 10 7a18.5 18.5 0 01-2.16 3.19"/>
-  <path d="M14.12 14.12a3 3 0 11-4.24-4.24"/>
-  <path d="M6.61 6.61A13.5 13.5 0 002 12s3 7 10 7a9.74 9.74 0 005.39-1.61" fill="currentColor" opacity="0.3"/>
-  <path d="M6.61 6.61A13.5 13.5 0 002 12s3 7 10 7a9.74 9.74 0 005.39-1.61"/>
+  <path d="M2 12s3-7 10-7 10 7 10 7-3 7-10 7S2 12 2 12z" fill="currentColor" opacity="0.3"/>
+  <path d="M2 12s3-7 10-7 10 7 10 7-3 7-10 7S2 12 2 12z"/>
+  <circle cx="12" cy="12" r="3" fill="currentColor" opacity="0.3"/>
+  <circle cx="12" cy="12" r="3"/>
   <line x1="3" y1="3" x2="21" y2="21"/>
 </svg>`,
     glitch: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M9.9 4.24A9.12 9.12 0 0112 4c7 0 10 7 10 7a18.5 18.5 0 01-2.16 3.19" transform="translate(1,-1)" opacity="0.3"/>
-  <path d="M9.9 4.24A9.12 9.12 0 0112 4c7 0 10 7 10 7a18.5 18.5 0 01-2.16 3.19"/>
-  <path d="M14.12 14.12a3 3 0 11-4.24-4.24" transform="translate(1,-1)" opacity="0.3"/>
-  <path d="M14.12 14.12a3 3 0 11-4.24-4.24"/>
-  <path d="M6.61 6.61A13.5 13.5 0 002 12s3 7 10 7a9.74 9.74 0 005.39-1.61" transform="translate(1,-1)" opacity="0.3"/>
-  <path d="M6.61 6.61A13.5 13.5 0 002 12s3 7 10 7a9.74 9.74 0 005.39-1.61"/>
+  <g opacity="0.4" transform="translate(-0.5, 0.5)">
+    <path d="M2 12s3-7 10-7 10 7 10 7-3 7-10 7S2 12 2 12z"/>
+    <circle cx="12" cy="12" r="3"/>
+  </g>
+  <path d="M2 12s3-7 10-7 10 7 10 7-3 7-10 7S2 12 2 12z"/>
+  <circle cx="12" cy="12" r="3"/>
   <line x1="3" y1="3" x2="21" y2="21"/>
 </svg>`,
   },

package/src/icons/defs/security/fingerprint.ts

@@ -10,40 +10,40 @@ export const fingerprint: IconDefinition = {
   description: 'Biometric authentication with fingerprint',
   tags: ['fingerprint', 'biometric', 'authentication', 'identity', 'scan', 'secure'],
   svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M12 11c0-2.5-2-4.5-4.5-4.5S3 8.5 3 11c0 1 .3 2 .8 2.8"/>
-  <path d="M12 11c0 4.5-1.8 8-4 8"/>
-  <path d="M12 11c0-4.8 3.9-8.7 8.7-8.7.7 0 1.3.1 1.9.3"/>
-  <path d="M12 11c0 6.1 1.9 11 4.2 11"/>
-  <path d="M12 11v8"/>
-  <path d="M8.5 15.5c.3 1.5.5 3.2.5 5"/>
-  <path d="M16 14.5c.5 1.7.8 3.5.8 5.5"/>
+  <path d="M2 12c0-5.5 4.5-10 10-10 1.6 0 3.2.4 4.5 1"/>
+  <path d="M7 3.8A10 10 0 0 0 2 12"/>
+  <path d="M22 12c0 5.5-4.5 10-10 10"/>
+  <path d="M17 20.2A10 10 0 0 0 22 12"/>
+  <path d="M12 6a6 6 0 0 0-6 6c0 1.5.5 2.8 1.3 3.8"/>
+  <path d="M15.5 7A6 6 0 0 1 18 12c0 1.5-.5 2.8-1.3 3.8"/>
+  <path d="M12 10a2 2 0 0 0-2 2c0 2.2.5 4.5 1.5 6.5"/>
+  <path d="M14 12a2 2 0 0 0-2-2"/>
 </svg>`,
   variants: {
-    solid: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
-  <path d="M7.5 5.5C5 5.5 3 7.5 3 10c0 1.2.3 2.3.9 3.3l1.5-1c-.4-.7-.6-1.5-.6-2.3 0-1.7 1.3-3 3-3h.7v-1.5h-.7-.3zm4.5 4v9.5h1.5V10c0-1-.2-2-.6-2.9l-1.4.7c.3.7.5 1.4.5 2.2zm0-5.2c-1.3-.5-2.7-.8-4-.8v1.5c1 0 2 .2 2.9.6l1.1-1.3zM12 10c0 5.3-1.5 9.5-3.5 9.5v1.5c3.2 0 5-5.2 5-11h-1.5zm8.4-7.4C19.1 2.2 17.7 2 16.2 2v1.5c1.2 0 2.3.2 3.4.5l.8-1.4zM12 10c0 6.8 2.3 12.5 5 12.5v-1.5c-1.7 0-3.5-5-3.5-11H12zm-3.5 4.5c.4 1.8.6 3.8.6 6h1.5c0-2.4-.2-4.6-.7-6.6l-1.4.6zm7.5-.5c.6 2 1 4.3 1 6.5h1.5c0-2.5-.5-5-1.1-7.2l-1.4.7z"/>
+    solid: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" stroke="none">
+  <path d="M12 1C5.9 1 1 5.9 1 12s4.9 11 11 11 11-4.9 11-11S18.1 1 12 1zm0 2c4.4 0 8.1 3.2 8.8 7.4-.7-.2-1.4-.4-2.3-.4-3.5 0-6.5 2.9-6.5 6.5 0 1.2.4 2.4 1 3.4-.3 0-.7.1-1 .1-5 0-9-4-9-9s4-9 9-9zm1 7c-1.7 0-3 1.3-3 3 0 2.5.6 5 1.8 7.2.4-.1.7-.2 1.2-.2 1.1 0 2.2.3 3.1.8C16.6 18.3 17 15.7 17 13c0-1.7-1.3-3-3-3-.3 0-.7 0-1 .1z"/>
 </svg>`,
     duotone: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M12 11c0-2.5-2-4.5-4.5-4.5S3 8.5 3 11c0 1 .3 2 .8 2.8" fill="currentColor" opacity="0.3"/>
-  <path d="M12 11c0-2.5-2-4.5-4.5-4.5S3 8.5 3 11c0 1 .3 2 .8 2.8"/>
-  <path d="M12 11c0 4.5-1.8 8-4 8" fill="currentColor" opacity="0.3"/>
-  <path d="M12 11c0 4.5-1.8 8-4 8"/>
-  <path d="M12 11c0-4.8 3.9-8.7 8.7-8.7.7 0 1.3.1 1.9.3"/>
-  <path d="M12 11c0 6.1 1.9 11 4.2 11"/>
-  <path d="M12 11v8"/>
-  <path d="M8.5 15.5c.3 1.5.5 3.2.5 5"/>
-  <path d="M16 14.5c.5 1.7.8 3.5.8 5.5"/>
+  <path d="M2 12c0-5.5 4.5-10 10-10 1.6 0 3.2.4 4.5 1" opacity="0.3"/>
+  <path d="M22 12c0 5.5-4.5 10-10 10" opacity="0.3"/>
+  <path d="M12 6a6 6 0 0 0-6 6c0 1.5.5 2.8 1.3 3.8" fill="currentColor" opacity="0.3"/>
+  <path d="M2 12c0-5.5 4.5-10 10-10 1.6 0 3.2.4 4.5 1"/>
+  <path d="M22 12c0 5.5-4.5 10-10 10"/>
+  <path d="M12 6a6 6 0 0 0-6 6c0 1.5.5 2.8 1.3 3.8"/>
+  <path d="M15.5 7A6 6 0 0 1 18 12c0 1.5-.5 2.8-1.3 3.8"/>
+  <path d="M12 10a2 2 0 0 0-2 2c0 2.2.5 4.5 1.5 6.5"/>
 </svg>`,
     glitch: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-  <path d="M12 11c0-2.5-2-4.5-4.5-4.5S3 8.5 3 11c0 1 .3 2 .8 2.8" transform="translate(1,-1)" opacity="0.3"/>
-  <path d="M12 11c0-2.5-2-4.5-4.5-4.5S3 8.5 3 11c0 1 .3 2 .8 2.8"/>
-  <path d="M12 11c0 4.5-1.8 8-4 8" transform="translate(1,-1)" opacity="0.3"/>
-  <path d="M12 11c0 4.5-1.8 8-4 8"/>
-  <path d="M12 11c0-4.8 3.9-8.7 8.7-8.7.7 0 1.3.1 1.9.3" transform="translate(1,-1)" opacity="0.3"/>
-  <path d="M12 11c0-4.8 3.9-8.7 8.7-8.7.7 0 1.3.1 1.9.3"/>
-  <path d="M12 11c0 6.1 1.9 11 4.2 11"/>
-  <path d="M12 11v8"/>
-  <path d="M8.5 15.5c.3 1.5.5 3.2.5 5"/>
-  <path d="M16 14.5c.5 1.7.8 3.5.8 5.5"/>
+  <g opacity="0.4" transform="translate(-0.5, 0.5)">
+    <path d="M2 12c0-5.5 4.5-10 10-10 1.6 0 3.2.4 4.5 1"/>
+    <path d="M22 12c0 5.5-4.5 10-10 10"/>
+    <path d="M12 6a6 6 0 0 0-6 6c0 1.5.5 2.8 1.3 3.8"/>
+  </g>
+  <path d="M2 12c0-5.5 4.5-10 10-10 1.6 0 3.2.4 4.5 1"/>
+  <path d="M22 12c0 5.5-4.5 10-10 10"/>
+  <path d="M12 6a6 6 0 0 0-6 6c0 1.5.5 2.8 1.3 3.8"/>
+  <path d="M15.5 7A6 6 0 0 1 18 12c0 1.5-.5 2.8-1.3 3.8"/>
+  <path d="M12 10a2 2 0 0 0-2 2c0 2.2.5 4.5 1.5 6.5"/>
 </svg>`,
   },
 };