[{"data":1,"prerenderedAt":35825},["ShallowReactive",2],{"navigation_docs_en":3,"docs_sidebar_badges_en":684,"-en-components-miscellaneous-marquee":35687,"-en-components-miscellaneous-marquee-surround":35822},[4,22,607,618],{"title":5,"path":6,"stem":7,"children":8},"Getting Started","/en/getting-started","en/1.getting-started/1.index",[9,10,14,18],{"title":5,"path":6,"stem":7},{"title":11,"path":12,"stem":13},"Installation","/en/getting-started/installation","en/1.getting-started/2.installation",{"title":15,"path":16,"stem":17},"How To Contribute","/en/getting-started/contribution","en/1.getting-started/3.contribution",{"title":19,"path":20,"stem":21},"Code of Conduct","/en/getting-started/code-of-conduct","en/1.getting-started/4.code-of-conduct",{"title":23,"path":24,"stem":25,"children":26,"page":136},"Components","/en/components","en/2.components",[27,137,162,199,224,237,266,367,428,445,542],{"title":28,"path":29,"stem":30,"children":31,"page":136},"Backgrounds","/en/components/backgrounds","en/2.components/backgrounds",[32,36,40,44,48,52,56,60,64,68,72,76,80,84,88,92,96,100,104,108,112,116,120,124,128,132],{"title":33,"path":34,"stem":35},"Aurora Background","/en/components/backgrounds/aurora-background","en/2.components/backgrounds/aurora-background",{"title":37,"path":38,"stem":39},"Black Hole Background","/en/components/backgrounds/black-hole-background","en/2.components/backgrounds/black-hole-background",{"title":41,"path":42,"stem":43},"Bubbles Background","/en/components/backgrounds/bubbles-bg","en/2.components/backgrounds/bubbles-bg",{"title":45,"path":46,"stem":47},"Cosmic Portal","/en/components/backgrounds/cosmic-portal","en/2.components/backgrounds/cosmic-portal",{"title":49,"path":50,"stem":51},"Falling Stars Background","/en/components/backgrounds/falling-stars","en/2.components/backgrounds/falling-stars",{"title":53,"path":54,"stem":55},"Flickering Grid","/en/components/backgrounds/flickering-grid","en/2.components/backgrounds/flickering-grid",{"title":57,"path":58,"stem":59},"Interactive Grid Pattern","/en/components/backgrounds/interactive-grid-pattern","en/2.components/backgrounds/interactive-grid-pattern",{"title":61,"path":62,"stem":63},"Lamp Effect","/en/components/backgrounds/lamp-effect","en/2.components/backgrounds/lamp-effect",{"title":65,"path":66,"stem":67},"Liquid Background","/en/components/backgrounds/liquid-background","en/2.components/backgrounds/liquid-background",{"title":69,"path":70,"stem":71},"Neural Background","/en/components/backgrounds/neural-background","en/2.components/backgrounds/neural-background",{"title":73,"path":74,"stem":75},"Particle Whirlpool","/en/components/backgrounds/particle-whirlpool-bg","en/2.components/backgrounds/particle-whirlpool-bg",{"title":77,"path":78,"stem":79},"Particles Background","/en/components/backgrounds/particles-bg","en/2.components/backgrounds/particles-bg",{"title":81,"path":82,"stem":83},"Pattern Background","/en/components/backgrounds/pattern-background","en/2.components/backgrounds/pattern-background",{"title":85,"path":86,"stem":87},"Ripple","/en/components/backgrounds/ripple","en/2.components/backgrounds/ripple",{"title":89,"path":90,"stem":91},"Silk Background","/en/components/backgrounds/silk-background","en/2.components/backgrounds/silk-background",{"title":93,"path":94,"stem":95},"Singularity Background","/en/components/backgrounds/singularity-background","en/2.components/backgrounds/singularity-background",{"title":97,"path":98,"stem":99},"Snowfall Background","/en/components/backgrounds/snowfall-bg","en/2.components/backgrounds/snowfall-bg",{"title":101,"path":102,"stem":103},"Sparkles","/en/components/backgrounds/sparkles","en/2.components/backgrounds/sparkles",{"title":105,"path":106,"stem":107},"Stars Background","/en/components/backgrounds/stars-background","en/2.components/backgrounds/stars-background",{"title":109,"path":110,"stem":111},"Stractium Background","/en/components/backgrounds/stractium-background","en/2.components/backgrounds/stractium-background",{"title":113,"path":114,"stem":115},"Tetris","/en/components/backgrounds/tetris","en/2.components/backgrounds/tetris",{"title":117,"path":118,"stem":119},"Thunderstorm Background","/en/components/backgrounds/thunderstorm-background","en/2.components/backgrounds/thunderstorm-background",{"title":121,"path":122,"stem":123},"Video Text","/en/components/backgrounds/video-text","en/2.components/backgrounds/video-text",{"title":125,"path":126,"stem":127},"Vortex Background","/en/components/backgrounds/vortex","en/2.components/backgrounds/vortex",{"title":129,"path":130,"stem":131},"Warp Background","/en/components/backgrounds/warp-background","en/2.components/backgrounds/warp-background",{"title":133,"path":134,"stem":135},"Wavy Background","/en/components/backgrounds/wavy-background","en/2.components/backgrounds/wavy-background",false,{"title":138,"path":139,"stem":140,"children":141,"page":136},"Buttons","/en/components/buttons","en/2.components/buttons",[142,146,150,154,158],{"title":143,"path":144,"stem":145},"Gradient Button","/en/components/buttons/gradient-button","en/2.components/buttons/gradient-button",{"title":147,"path":148,"stem":149},"Interactive Hover Button","/en/components/buttons/interactive-hover-button","en/2.components/buttons/interactive-hover-button",{"title":151,"path":152,"stem":153},"Rainbow Button","/en/components/buttons/rainbow-button","en/2.components/buttons/rainbow-button",{"title":155,"path":156,"stem":157},"Ripple Button","/en/components/buttons/ripple-button","en/2.components/buttons/ripple-button",{"title":159,"path":160,"stem":161},"Shimmer Button","/en/components/buttons/shimmer-button","en/2.components/buttons/shimmer-button",{"title":163,"path":164,"stem":165,"children":166,"page":136},"Cards","/en/components/cards","en/2.components/cards",[167,171,175,179,183,187,191,195],{"title":168,"path":169,"stem":170},"3D Card Effect","/en/components/cards/3d-card","en/2.components/cards/3d-card",{"title":172,"path":173,"stem":174},"Apple Card Carousel","/en/components/cards/apple-card-carousel","en/2.components/cards/apple-card-carousel",{"title":176,"path":177,"stem":178},"Card Spotlight","/en/components/cards/card-spotlight","en/2.components/cards/card-spotlight",{"title":180,"path":181,"stem":182},"Direction Aware Hover Card","/en/components/cards/direction-aware-hover","en/2.components/cards/direction-aware-hover",{"title":184,"path":185,"stem":186},"Fey Cards","/en/components/cards/fey-cards","en/2.components/cards/fey-cards",{"title":188,"path":189,"stem":190},"Flip Card","/en/components/cards/flip-card","en/2.components/cards/flip-card",{"title":192,"path":193,"stem":194},"Floating Card","/en/components/cards/floating-card","en/2.components/cards/floating-card",{"title":196,"path":197,"stem":198},"Glare Card","/en/components/cards/glare-card","en/2.components/cards/glare-card",{"title":200,"path":201,"stem":202,"children":203,"page":136},"Cursors","/en/components/cursors","en/2.components/cursors",[204,208,212,216,220],{"title":205,"path":206,"stem":207},"Fluid Cursor","/en/components/cursors/fluid-cursor","en/2.components/cursors/fluid-cursor",{"title":209,"path":210,"stem":211},"Image Trail Cursor","/en/components/cursors/image-trail-cursor","en/2.components/cursors/image-trail-cursor",{"title":213,"path":214,"stem":215},"Sleek Line Cursor","/en/components/cursors/sleek-line-cursor","en/2.components/cursors/sleek-line-cursor",{"title":217,"path":218,"stem":219},"Smooth Cursor","/en/components/cursors/smooth-cursor","en/2.components/cursors/smooth-cursor",{"title":221,"path":222,"stem":223},"Tailed Cursor","/en/components/cursors/tailed-cursor","en/2.components/cursors/tailed-cursor",{"title":225,"path":226,"stem":227,"children":228,"page":136},"Device Mocks","/en/components/device-mocks","en/2.components/device-mocks",[229,233],{"title":230,"path":231,"stem":232},"iPhone Mockup","/en/components/device-mocks/iphone-mockup","en/2.components/device-mocks/iphone-mockup",{"title":234,"path":235,"stem":236},"Safari Mockup","/en/components/device-mocks/safari-mockup","en/2.components/device-mocks/safari-mockup",{"title":238,"path":239,"stem":240,"children":241,"page":136},"Input And Forms","/en/components/input-and-forms","en/2.components/input-and-forms",[242,246,250,254,258,262],{"title":243,"path":244,"stem":245},"Balance Slider","/en/components/input-and-forms/balance-slider","en/2.components/input-and-forms/balance-slider",{"title":247,"path":248,"stem":249},"Color Picker","/en/components/input-and-forms/color-picker","en/2.components/input-and-forms/color-picker",{"title":251,"path":252,"stem":253},"File Upload","/en/components/input-and-forms/file-upload","en/2.components/input-and-forms/file-upload",{"title":255,"path":256,"stem":257},"Halo Search","/en/components/input-and-forms/halo-search","en/2.components/input-and-forms/halo-search",{"title":259,"path":260,"stem":261},"Input","/en/components/input-and-forms/input","en/2.components/input-and-forms/input",{"title":263,"path":264,"stem":265},"Placeholders And Vanish Input","/en/components/input-and-forms/placeholders-and-vanish-input","en/2.components/input-and-forms/placeholders-and-vanish-input",{"title":267,"path":268,"stem":269,"children":270,"page":136},"Miscellaneous","/en/components/miscellaneous","en/2.components/miscellaneous",[271,275,279,283,287,291,295,299,303,307,311,315,319,323,327,331,335,339,343,347,351,355,359,363],{"title":272,"path":273,"stem":274},"Animate Grid","/en/components/miscellaneous/animate-grid","en/2.components/miscellaneous/animate-grid",{"title":276,"path":277,"stem":278},"Animated Circular Progress Bar","/en/components/miscellaneous/animated-circular-progressbar","en/2.components/miscellaneous/animated-circular-progressbar",{"title":280,"path":281,"stem":282},"Animated List","/en/components/miscellaneous/animated-list","en/2.components/miscellaneous/animated-list",{"title":284,"path":285,"stem":286},"Animated Modal","/en/components/miscellaneous/animated-modal","en/2.components/miscellaneous/animated-modal",{"title":288,"path":289,"stem":290},"Animated Tabs","/en/components/miscellaneous/animated-tabs","en/2.components/miscellaneous/animated-tabs",{"title":292,"path":293,"stem":294},"Animated Tooltip","/en/components/miscellaneous/animated-tooltip","en/2.components/miscellaneous/animated-tooltip",{"title":296,"path":297,"stem":298},"Bento Grid","/en/components/miscellaneous/bento-grid","en/2.components/miscellaneous/bento-grid",{"title":300,"path":301,"stem":302},"Book","/en/components/miscellaneous/book","en/2.components/miscellaneous/book",{"title":304,"path":305,"stem":306},"Compare","/en/components/miscellaneous/compare","en/2.components/miscellaneous/compare",{"title":308,"path":309,"stem":310},"Container Scroll","/en/components/miscellaneous/container-scroll","en/2.components/miscellaneous/container-scroll",{"title":312,"path":313,"stem":314},"Dock","/en/components/miscellaneous/dock","en/2.components/miscellaneous/dock",{"title":316,"path":317,"stem":318},"Expandable Gallery","/en/components/miscellaneous/expandable-gallery","en/2.components/miscellaneous/expandable-gallery",{"title":320,"path":321,"stem":322},"Images Slider","/en/components/miscellaneous/images-slider","en/2.components/miscellaneous/images-slider",{"title":324,"path":325,"stem":326},"Lens","/en/components/miscellaneous/lens","en/2.components/miscellaneous/lens",{"title":328,"path":329,"stem":330},"Link Preview","/en/components/miscellaneous/link-preview","en/2.components/miscellaneous/link-preview",{"title":332,"path":333,"stem":334},"Marquee","/en/components/miscellaneous/marquee","en/2.components/miscellaneous/marquee",{"title":336,"path":337,"stem":338},"Morphing Tabs","/en/components/miscellaneous/morphing-tabs","en/2.components/miscellaneous/morphing-tabs",{"title":340,"path":341,"stem":342},"Multi Step Loader","/en/components/miscellaneous/multi-step-loader","en/2.components/miscellaneous/multi-step-loader",{"title":344,"path":345,"stem":346},"Photo Gallery","/en/components/miscellaneous/photo-gallery","en/2.components/miscellaneous/photo-gallery",{"title":348,"path":349,"stem":350},"Scroll Island","/en/components/miscellaneous/scroll-island","en/2.components/miscellaneous/scroll-island",{"title":352,"path":353,"stem":354},"Shader Toy Viewer","/en/components/miscellaneous/shader-toy","en/2.components/miscellaneous/shader-toy",{"title":356,"path":357,"stem":358},"SVG Mask","/en/components/miscellaneous/svg-mask","en/2.components/miscellaneous/svg-mask",{"title":360,"path":361,"stem":362},"Timeline","/en/components/miscellaneous/timeline","en/2.components/miscellaneous/timeline",{"title":364,"path":365,"stem":366},"Tracing Beam","/en/components/miscellaneous/tracing-beam","en/2.components/miscellaneous/tracing-beam",{"title":368,"path":369,"stem":370,"children":371,"page":136},"Special Effects","/en/components/special-effects","en/2.components/special-effects",[372,376,380,384,388,392,396,400,404,408,412,416,420,424],{"title":373,"path":374,"stem":375},"Animated Beam","/en/components/special-effects/animated-beam","en/2.components/special-effects/animated-beam",{"title":377,"path":378,"stem":379},"Border Beam","/en/components/special-effects/border-beam","en/2.components/special-effects/border-beam",{"title":381,"path":382,"stem":383},"Confetti","/en/components/special-effects/confetti","en/2.components/special-effects/confetti",{"title":385,"path":386,"stem":387},"Dither Shader","/en/components/special-effects/dither-shader","en/2.components/special-effects/dither-shader",{"title":389,"path":390,"stem":391},"Glow Border","/en/components/special-effects/glow-border","en/2.components/special-effects/glow-border",{"title":393,"path":394,"stem":395},"Glowing Effect","/en/components/special-effects/glowing-effect","en/2.components/special-effects/glowing-effect",{"title":397,"path":398,"stem":399},"Images Badge","/en/components/special-effects/images-badge","en/2.components/special-effects/images-badge",{"title":401,"path":402,"stem":403},"Meteors","/en/components/special-effects/meteors","en/2.components/special-effects/meteors",{"title":405,"path":406,"stem":407},"Neon Border","/en/components/special-effects/neon-border","en/2.components/special-effects/neon-border",{"title":409,"path":410,"stem":411},"Particle Image","/en/components/special-effects/particle-image","en/2.components/special-effects/particle-image",{"title":413,"path":414,"stem":415},"Progressive Blur","/en/components/special-effects/progressive-blur","en/2.components/special-effects/progressive-blur",{"title":417,"path":418,"stem":419},"Scales","/en/components/special-effects/scales","en/2.components/special-effects/scales",{"title":421,"path":422,"stem":423},"Scratch To Reveal","/en/components/special-effects/scratch-to-reveal","en/2.components/special-effects/scratch-to-reveal",{"title":425,"path":426,"stem":427},"Spring Calendar","/en/components/special-effects/spring-calendar","en/2.components/special-effects/spring-calendar",{"title":429,"path":430,"stem":431,"children":432,"page":136},"Testimonials","/en/components/testimonials","en/2.components/testimonials",[433,437,441],{"title":434,"path":435,"stem":436},"Animated Testimonials","/en/components/testimonials/animated-testimonials","en/2.components/testimonials/animated-testimonials",{"title":438,"path":439,"stem":440},"Design Testimonials","/en/components/testimonials/design-testimonials","en/2.components/testimonials/design-testimonials",{"title":442,"path":443,"stem":444},"Testimonial Slider","/en/components/testimonials/testimonial-slider","en/2.components/testimonials/testimonial-slider",{"title":446,"path":447,"stem":448,"children":449,"page":136},"Text Animations","/en/components/text-animations","en/2.components/text-animations",[450,454,458,462,466,470,474,478,482,486,490,494,498,502,506,510,514,518,522,526,530,534,538],{"title":451,"path":452,"stem":453},"3D Text","/en/components/text-animations/3d-text","en/2.components/text-animations/3d-text",{"title":455,"path":456,"stem":457},"Blur Reveal","/en/components/text-animations/blur-reveal","en/2.components/text-animations/blur-reveal",{"title":459,"path":460,"stem":461},"Box Reveal","/en/components/text-animations/box-reveal","en/2.components/text-animations/box-reveal",{"title":463,"path":464,"stem":465},"Colourful Text","/en/components/text-animations/colorful-text","en/2.components/text-animations/colorful-text",{"title":467,"path":468,"stem":469},"Container Text Flip","/en/components/text-animations/container-text-flip","en/2.components/text-animations/container-text-flip",{"title":471,"path":472,"stem":473},"Encrypted Text","/en/components/text-animations/encrypted-text","en/2.components/text-animations/encrypted-text",{"title":475,"path":476,"stem":477},"Flip Words","/en/components/text-animations/flip-words","en/2.components/text-animations/flip-words",{"title":479,"path":480,"stem":481},"Focus","/en/components/text-animations/focus","en/2.components/text-animations/focus",{"title":483,"path":484,"stem":485},"Hyper Text","/en/components/text-animations/hyper-text","en/2.components/text-animations/hyper-text",{"title":487,"path":488,"stem":489},"Letter Pullup","/en/components/text-animations/letter-pullup","en/2.components/text-animations/letter-pullup",{"title":491,"path":492,"stem":493},"Line Shadow Text","/en/components/text-animations/line-shadow-text","en/2.components/text-animations/line-shadow-text",{"title":495,"path":496,"stem":497},"Morphing Text","/en/components/text-animations/morphing-text","en/2.components/text-animations/morphing-text",{"title":499,"path":500,"stem":501},"Number Ticker","/en/components/text-animations/number-ticker","en/2.components/text-animations/number-ticker",{"title":503,"path":504,"stem":505},"Radiant Text","/en/components/text-animations/radiant-text","en/2.components/text-animations/radiant-text",{"title":507,"path":508,"stem":509},"Sparkles Text","/en/components/text-animations/sparkles-text","en/2.components/text-animations/sparkles-text",{"title":511,"path":512,"stem":513},"Spinning Text","/en/components/text-animations/spinning-text","en/2.components/text-animations/spinning-text",{"title":515,"path":516,"stem":517},"Text Generate Effect","/en/components/text-animations/text-generate-effect","en/2.components/text-animations/text-generate-effect",{"title":519,"path":520,"stem":521},"Text Glitch","/en/components/text-animations/text-glitch","en/2.components/text-animations/text-glitch",{"title":523,"path":524,"stem":525},"Text Highlight","/en/components/text-animations/text-highlight","en/2.components/text-animations/text-highlight",{"title":527,"path":528,"stem":529},"Text Hover Effect","/en/components/text-animations/text-hover-effect","en/2.components/text-animations/text-hover-effect",{"title":531,"path":532,"stem":533},"Text Reveal","/en/components/text-animations/text-reveal","en/2.components/text-animations/text-reveal",{"title":535,"path":536,"stem":537},"Text Reveal Card","/en/components/text-animations/text-reveal-card","en/2.components/text-animations/text-reveal-card",{"title":539,"path":540,"stem":541},"Text Scroll Reveal","/en/components/text-animations/text-scroll-reveal","en/2.components/text-animations/text-scroll-reveal",{"title":543,"path":544,"stem":545,"children":546,"page":136},"Visualization","/en/components/visualization","en/2.components/visualization",[547,551,555,559,563,567,571,575,579,583,587,591,595,599,603],{"title":548,"path":549,"stem":550},"Bending Gallery","/en/components/visualization/bending-gallery","en/2.components/visualization/bending-gallery",{"title":552,"path":553,"stem":554},"3D Carousel","/en/components/visualization/carousal-3d","en/2.components/visualization/carousal-3d",{"title":556,"path":557,"stem":558},"File Tree","/en/components/visualization/file-tree","en/2.components/visualization/file-tree",{"title":560,"path":561,"stem":562},"Github Globe","/en/components/visualization/github-globe","en/2.components/visualization/github-globe",{"title":564,"path":565,"stem":566},"Globe","/en/components/visualization/globe","en/2.components/visualization/globe",{"title":568,"path":569,"stem":570},"Icon Cloud","/en/components/visualization/icon-cloud","en/2.components/visualization/icon-cloud",{"title":572,"path":573,"stem":574},"Infinite Grid","/en/components/visualization/infinite-grid","en/2.components/visualization/infinite-grid",{"title":576,"path":577,"stem":578},"Light Speed","/en/components/visualization/light-speed","en/2.components/visualization/light-speed",{"title":580,"path":581,"stem":582},"Liquid Glass Effect","/en/components/visualization/liquid-glass","en/2.components/visualization/liquid-glass",{"title":584,"path":585,"stem":586},"Liquid Logo","/en/components/visualization/liquid-logo","en/2.components/visualization/liquid-logo",{"title":588,"path":589,"stem":590},"Animated Logo Cloud","/en/components/visualization/logo-cloud","en/2.components/visualization/logo-cloud",{"title":592,"path":593,"stem":594},"Logo Origami","/en/components/visualization/logo-origami","en/2.components/visualization/logo-origami",{"title":596,"path":597,"stem":598},"Orbit","/en/components/visualization/orbit","en/2.components/visualization/orbit",{"title":600,"path":601,"stem":602},"Spline","/en/components/visualization/spline","en/2.components/visualization/spline",{"title":604,"path":605,"stem":606},"World Map","/en/components/visualization/world-map","en/2.components/visualization/world-map",{"title":608,"path":609,"stem":610,"children":611,"page":136},"Changelogs","/en/changelogs","en/3.changelogs",[612],{"title":613,"path":614,"stem":615,"children":616},"","/en/changelogs/all","en/3.changelogs/all/index",[617],{"title":613,"path":614,"stem":615},{"title":619,"path":620,"stem":621,"children":622},"Brand Reports","/en/brand-reports","en/4.brand-reports/index",[623,624,628,632,636,640,644,648,652,656,660,664,668,672,676,680],{"title":619,"path":620,"stem":621},{"title":625,"path":626,"stem":627},"Amorepacific","/en/brand-reports/amorepacific-sustainability-report-2025","en/4.brand-reports/amorepacific-sustainability-report-2025",{"title":629,"path":630,"stem":631},"Beiersdorf","/en/brand-reports/beiersdorf-sustainability-report-2025","en/4.brand-reports/beiersdorf-sustainability-report-2025",{"title":633,"path":634,"stem":635},"BIC Lighter","/en/brand-reports/bic-lighter-sustainability-report-2025","en/4.brand-reports/bic-lighter-sustainability-report-2025",{"title":637,"path":638,"stem":639},"e.l.f. Beauty","/en/brand-reports/elf-beauty-sustainability-report-2025","en/4.brand-reports/elf-beauty-sustainability-report-2025",{"title":641,"path":642,"stem":643},"Estee Lauder","/en/brand-reports/estee-lauder-companies-sustainability-report-2025","en/4.brand-reports/estee-lauder-companies-sustainability-report-2025",{"title":645,"path":646,"stem":647},"Kao","/en/brand-reports/kao-sustainability-report-2026","en/4.brand-reports/kao-sustainability-report-2026",{"title":649,"path":650,"stem":651},"L'Occitane","/en/brand-reports/loccitane-group-sustainability-report-2025","en/4.brand-reports/loccitane-group-sustainability-report-2025",{"title":653,"path":654,"stem":655},"L'Oreal","/en/brand-reports/loreal-sustainability-report-2025","en/4.brand-reports/loreal-sustainability-report-2025",{"title":657,"path":658,"stem":659},"Natura","/en/brand-reports/natura-sustainability-report-2025","en/4.brand-reports/natura-sustainability-report-2025",{"title":661,"path":662,"stem":663},"Nike","/en/brand-reports/nike-sustainability-report-2024","en/4.brand-reports/nike-sustainability-report-2024",{"title":665,"path":666,"stem":667},"Oriflame","/en/brand-reports/oriflame-sustainability-report-2025","en/4.brand-reports/oriflame-sustainability-report-2025",{"title":669,"path":670,"stem":671},"Patagonia","/en/brand-reports/patagonia-sustainability-report-2025","en/4.brand-reports/patagonia-sustainability-report-2025",{"title":673,"path":674,"stem":675},"Puma","/en/brand-reports/puma-sustainability-report-2025","en/4.brand-reports/puma-sustainability-report-2025",{"title":677,"path":678,"stem":679},"REIDEA Electronic Lighters","/en/brand-reports/reidea-electronic-lighters-sustainability-report-2026","en/4.brand-reports/reidea-electronic-lighters-sustainability-report-2026",{"title":681,"path":682,"stem":683},"Shiseido","/en/brand-reports/shiseido-sustainability-report-2025","en/4.brand-reports/shiseido-sustainability-report-2025",[685,862,2855,5435,5723,5956,6110,6190,6449,6540,6734,6878,6981,7025,7170,7274,7400,7645,7836,7989,8159,8309,8473,8619,8787,8897,9060,9318,9550,9731,9944,10106,10193,10300,10438,10595,10927,11397,11518,11640,11853,11968,12071,12140,12470,12575,12741,12901,13175,13277,13392,13407,13615,13948,14103,14168,14270,14394,14578,14790,14854,15253,15610,15682,15885,16145,16561,16805,16982,17048,17305,17449,17636,17792,17932,18120,18225,18342,18518,18617,18751,18814,19166,19353,19898,20256,20484,20712,20961,21200,21435,21800,21936,22065,22260,22378,22558,22745,22840,23064,23181,23297,23421,23561,23739,23830,23988,24109,24212,24316,24439,24604,24685,24810,24964,25083,25228,25338,25443,25582,25703,25782,25919,26062,26403,26953,27124,27208,27668,27737,28066,28262,28361,28461,28606,28885,29026,29035,29050,29367,29660,30430,30717,31002,31100,31384,31651,31949,32201,32771,33043,33697,34337,35378],{"id":686,"title":5,"badge":687,"body":688,"category":687,"description":855,"extension":856,"links":687,"meta":857,"navigation":859,"path":6,"seo":860,"stem":7,"tags":687,"__hash__":861},"docs_en/en/1.getting-started/1.index.md",null,{"type":689,"value":690,"toc":846},"minimark",[691,712,727,732,739,743,746,750,783,787,790,820,824,843],[692,693,694,695,705,706,711],"p",{},"Welcome to ",[696,697,701],"a",{"href":698,"rel":699},"https://inspira-ui.com",[700],"nofollow",[702,703,704],"strong",{},"Inspira UI",", a community-driven project for ",[696,707,710],{"href":708,"rel":709},"https://vuejs.org",[700],"Vue","!",[692,713,714,715,720,721,726],{},"This collection offers beautifully designed, reusable components, taking inspiration from the amazing work done on both ",[696,716,719],{"href":717,"rel":718},"https://ui.aceternity.com",[700],"Aceternity UI"," and ",[696,722,725],{"href":723,"rel":724},"https://magicui.design",[700],"Magic UI",". While we're not officially affiliated with these projects, we have received permission from Aceternity UI's creator to adapt those fantastic designs for the Vue ecosystem. Additionally, Inspira UI includes custom components developed by us and contributed by the community.",[728,729,731],"h3",{"id":730},"about-inspira-ui","About Inspira UI",[692,733,734,735,738],{},"Inspira UI is ",[702,736,737],{},"not"," a traditional component library. Instead, it's a curated collection of elegant components you can easily integrate into your applications. Simply pick what you need, copy the code, and customize it to fit your project. The code is yours to use and modify as you like!",[728,740,742],{"id":741},"why-inspira-ui","Why Inspira UI?",[692,744,745],{},"This project began to fill a gap in the Vue community for a similar set of components. Inspira UI brings the beauty and functionality of Aceternity UI, Magic UI, and custom contributions to Vue, making it easier for developers to build stunning applications.",[728,747,749],{"id":748},"key-features","Key Features",[751,752,753,762,770,777,780],"ul",{},[754,755,756,757],"li",{},"Completely ",[696,758,761],{"href":759,"rel":760},"https://github.com/unovue/inspira-ui",[700],"free and open source",[754,763,764,765,769],{},"Highly ",[696,766,768],{"href":767},"/components","configurable"," to meet your design needs",[754,771,772,773,776],{},"A wide range of ",[696,774,775],{"href":767},"components"," to choose from",[754,778,779],{},"Optimized for mobile use",[754,781,782],{},"Fully compatible with Nuxt",[728,784,786],{"id":785},"acknowledgments","Acknowledgments",[692,788,789],{},"Special thanks to:",[751,791,792,798,804,812],{},[754,793,794,797],{},[696,795,719],{"href":717,"rel":796},[700]," for inspiring this Vue adaptation.",[754,799,800,803],{},[696,801,725],{"href":723,"rel":802},[700]," for their design inspiration.",[754,805,806,811],{},[696,807,810],{"href":808,"rel":809},"https://www.shadcn-vue.com/",[700],"shadcn-vue"," for the Vue port of shadcn-ui and contributing some components for docs.",[754,813,814,819],{},[696,815,818],{"href":816,"rel":817},"https://github.com/ZTL-UwU/shadcn-docs-nuxt",[700],"shadcn-docs-nuxt"," for the beautifully crafted Nuxt documentation site.",[728,821,823],{"id":822},"about-me","About Me",[692,825,826,827,832,833,838,839,711],{},"Hi, I'm ",[696,828,831],{"href":829,"rel":830},"https://rahulv.dev",[700],"Rahul Vashishtha",". I started Inspira UI to bring a similar experience to the Vue ecosystem, inspired by Aceternity UI, Magic UI, and community contributions. I'm continuously working on it to make it better. Feel free to check out my work on ",[696,834,837],{"href":835,"rel":836},"https://github.com/rahul-vashishtha",[700],"GitHub"," and join me on this journey ",[696,840,842],{"href":759,"rel":841},[700],"here",[692,844,845],{},"Feel free to explore and enjoy building with Inspira UI!",{"title":613,"searchDepth":847,"depth":847,"links":848},2,[849,851,852,853,854],{"id":730,"depth":850,"text":731},3,{"id":741,"depth":850,"text":742},{"id":748,"depth":850,"text":749},{"id":785,"depth":850,"text":786},{"id":822,"depth":850,"text":823},"Reusable components built with shadcn-vue, motion-v, and TailwindCSS","md",{"icon":858},"lucide:info",true,{"title":5,"description":855},"jQ3k8G87_b6UgEYdI1zdRyRo_8n9-VakZJkGFoM1Vc4",{"id":863,"title":11,"badge":687,"body":864,"category":687,"description":2850,"extension":856,"links":687,"meta":2851,"navigation":859,"path":12,"seo":2853,"stem":13,"tags":687,"__hash__":2854},"docs_en/en/1.getting-started/2.installation.md",{"type":689,"value":865,"toc":2839},[866,869,881,886,2803,2809,2813,2820,2828,2832,2835],[692,867,868],{},"This guide will help you install and set up Inspira UI components in your Vue or Nuxt application.",[870,871,872,873],"warning",{},"If you are using Tailwind CSS v3, ",[702,874,875,880],{},[696,876,879],{"href":877,"rel":878},"https://v1.inspira-ui.com",[700],"Checkout Inspira UI v1 here",".",[882,883,885],"h2",{"id":884},"getting-started-with-inspira-ui","Getting Started with Inspira UI",[887,888,889,897,914,918,921,1018,1030,1038,1044,1050],"steps",{},[728,890,892,893],{"id":891},"set-up-tailwindcss","Set up ",[894,895,896],"code",{},"tailwindcss",[692,898,899,900,902,903,908,909,880],{},"To begin, install ",[894,901,896],{}," using this ",[696,904,907],{"href":905,"rel":906},"https://tailwindcss.com/docs/installation",[700],"Vite install guide for Vue"," or using this ",[696,910,913],{"href":911,"rel":912},"https://tailwindcss.com/docs/installation/framework-guides/nuxt",[700],"framework-specific guide for Nuxt",[728,915,917],{"id":916},"add-dependencies","Add dependencies",[692,919,920],{},"Install following supporting libraries.",[922,923,924,957,977,998],"code-group",{},[925,926,931],"pre",{"className":927,"code":928,"filename":929,"language":930,"meta":613,"style":613},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","npm install @vueuse/core motion-v tw-animate-css @inspira-ui/plugins\n","npm","bash",[894,932,933],{"__ignoreMap":613},[934,935,938,941,945,948,951,954],"span",{"class":936,"line":937},"line",1,[934,939,929],{"class":940},"sBMFI",[934,942,944],{"class":943},"sfazB"," install",[934,946,947],{"class":943}," @vueuse/core",[934,949,950],{"class":943}," motion-v",[934,952,953],{"class":943}," tw-animate-css",[934,955,956],{"class":943}," @inspira-ui/plugins\n",[925,958,961],{"className":927,"code":959,"filename":960,"language":930,"meta":613,"style":613},"pnpm install @vueuse/core motion-v tw-animate-css @inspira-ui/plugins\n","pnpm",[894,962,963],{"__ignoreMap":613},[934,964,965,967,969,971,973,975],{"class":936,"line":937},[934,966,960],{"class":940},[934,968,944],{"class":943},[934,970,947],{"class":943},[934,972,950],{"class":943},[934,974,953],{"class":943},[934,976,956],{"class":943},[925,978,981],{"className":927,"code":979,"filename":980,"language":930,"meta":613,"style":613},"bun add @vueuse/core motion-v tw-animate-css @inspira-ui/plugins\n","bun",[894,982,983],{"__ignoreMap":613},[934,984,985,987,990,992,994,996],{"class":936,"line":937},[934,986,980],{"class":940},[934,988,989],{"class":943}," add",[934,991,947],{"class":943},[934,993,950],{"class":943},[934,995,953],{"class":943},[934,997,956],{"class":943},[925,999,1002],{"className":927,"code":1000,"filename":1001,"language":930,"meta":613,"style":613},"yarn add @vueuse/core motion-v tw-animate-css @inspira-ui/plugins\n","yarn",[894,1003,1004],{"__ignoreMap":613},[934,1005,1006,1008,1010,1012,1014,1016],{"class":936,"line":937},[934,1007,1001],{"class":940},[934,1009,989],{"class":943},[934,1011,947],{"class":943},[934,1013,950],{"class":943},[934,1015,953],{"class":943},[934,1017,956],{"class":943},[692,1019,1020,1021,1024,1025,880],{},"Follow this guide to setup ",[894,1022,1023],{},"motion-v"," on ",[696,1026,1029],{"href":1027,"rel":1028},"https://motion.dev/docs/vue",[700],"Vue or Nuxt",[728,1031,1033,1034,1037],{"id":1032},"update-your-maincss-file","Update your ",[894,1035,1036],{},"main.css"," file",[1039,1040,1041,1042,880],"tip",{},"Skip this step if you are using ",[894,1043,810],{},[692,1045,1046,1047,1049],{},"Add the following code to your ",[894,1048,1036],{}," file, this setup the variable required for the components:",[1051,1052,1055,1682],"tabs",{"className":1053},[1054],"w-full",[1056,1057,1060],"tabs-item",{"icon":1058,"label":1059},"simple-icons:nuxt","Nuxt UI",[1061,1062,1063],"code-collapse",{},[925,1064,1068],{"className":1065,"code":1066,"filename":1036,"language":1067,"meta":613,"style":613},"language-css shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","@import \"tailwindcss\";\n@import \"@nuxt/ui\";\n\n@theme static {\n  --color-background: var(--ui-bg);\n  --color-foreground: var(--ui-text);\n\n  --color-card: var(--ui-bg-elevated);\n  --color-card-foreground: var(--ui-text);\n\n  --color-popover: var(--ui-bg-elevated);\n  --color-popover-foreground: var(--ui-text);\n\n  --color-muted: var(--ui-bg-muted);\n  --color-muted-foreground: var(--ui-text-muted);\n\n  --color-accent: var(--ui-bg-accented);\n  --color-accent-foreground: var(--ui-text);\n\n  --color-border: var(--ui-border);\n  --color-input: var(--ui-border);\n\n  --color-primary: var(--ui-primary);\n  --color-primary-foreground: var(--ui-text-inverted);\n\n  --color-secondary: var(--ui-secondary);\n  --color-secondary-foreground: var(--ui-text-inverted);\n\n  --color-destructive: var(--ui-error);\n  --color-destructive-foreground: var(--ui-text-inverted);\n\n  --color-ring: var(--ui-primary);\n\n  --radius: var(--ui-radius);\n}\n\n:root {\n  --background: var(--ui-bg);\n  --foreground: var(--ui-text);\n\n  --card: var(--ui-bg-elevated);\n  --card-foreground: var(--ui-text);\n\n  --popover: var(--ui-bg-elevated);\n  --popover-foreground: var(--ui-text);\n\n  --muted: var(--ui-bg-muted);\n  --muted-foreground: var(--ui-text-muted);\n\n  --accent: var(--ui-bg-accented);\n  --accent-foreground: var(--ui-text);\n\n  --border: var(--ui-border);\n  --input: var(--ui-border);\n\n  --primary: var(--ui-primary);\n  --primary-foreground: var(--ui-text-inverted);\n\n  --secondary: var(--ui-secondary);\n  --secondary-foreground: var(--ui-text-inverted);\n\n  --destructive: var(--ui-error);\n  --destructive-foreground: var(--ui-text-inverted);\n\n  --ring: var(--ui-primary);\n}\n","css",[894,1069,1070,1088,1101,1106,1119,1125,1131,1136,1142,1148,1153,1159,1165,1170,1176,1182,1187,1193,1199,1204,1210,1216,1221,1227,1233,1238,1244,1250,1255,1261,1267,1272,1278,1283,1289,1295,1300,1313,1334,1351,1356,1373,1389,1394,1410,1426,1431,1448,1465,1470,1487,1503,1508,1525,1541,1546,1563,1580,1585,1602,1618,1623,1640,1656,1661,1677],{"__ignoreMap":613},[934,1071,1072,1076,1080,1082,1085],{"class":936,"line":937},[934,1073,1075],{"class":1074},"s7zQu","@import",[934,1077,1079],{"class":1078},"sMK4o"," \"",[934,1081,896],{"class":943},[934,1083,1084],{"class":1078},"\"",[934,1086,1087],{"class":1078},";\n",[934,1089,1090,1092,1094,1097,1099],{"class":936,"line":847},[934,1091,1075],{"class":1074},[934,1093,1079],{"class":1078},[934,1095,1096],{"class":943},"@nuxt/ui",[934,1098,1084],{"class":1078},[934,1100,1087],{"class":1078},[934,1102,1103],{"class":936,"line":850},[934,1104,1105],{"emptyLinePlaceholder":859},"\n",[934,1107,1109,1112,1116],{"class":936,"line":1108},4,[934,1110,1111],{"class":1074},"@theme",[934,1113,1115],{"class":1114},"sTEyZ"," static ",[934,1117,1118],{"class":1078},"{\n",[934,1120,1122],{"class":936,"line":1121},5,[934,1123,1124],{"class":1114},"  --color-background: var(--ui-bg);\n",[934,1126,1128],{"class":936,"line":1127},6,[934,1129,1130],{"class":1114},"  --color-foreground: var(--ui-text);\n",[934,1132,1134],{"class":936,"line":1133},7,[934,1135,1105],{"emptyLinePlaceholder":859},[934,1137,1139],{"class":936,"line":1138},8,[934,1140,1141],{"class":1114},"  --color-card: var(--ui-bg-elevated);\n",[934,1143,1145],{"class":936,"line":1144},9,[934,1146,1147],{"class":1114},"  --color-card-foreground: var(--ui-text);\n",[934,1149,1151],{"class":936,"line":1150},10,[934,1152,1105],{"emptyLinePlaceholder":859},[934,1154,1156],{"class":936,"line":1155},11,[934,1157,1158],{"class":1114},"  --color-popover: var(--ui-bg-elevated);\n",[934,1160,1162],{"class":936,"line":1161},12,[934,1163,1164],{"class":1114},"  --color-popover-foreground: var(--ui-text);\n",[934,1166,1168],{"class":936,"line":1167},13,[934,1169,1105],{"emptyLinePlaceholder":859},[934,1171,1173],{"class":936,"line":1172},14,[934,1174,1175],{"class":1114},"  --color-muted: var(--ui-bg-muted);\n",[934,1177,1179],{"class":936,"line":1178},15,[934,1180,1181],{"class":1114},"  --color-muted-foreground: var(--ui-text-muted);\n",[934,1183,1185],{"class":936,"line":1184},16,[934,1186,1105],{"emptyLinePlaceholder":859},[934,1188,1190],{"class":936,"line":1189},17,[934,1191,1192],{"class":1114},"  --color-accent: var(--ui-bg-accented);\n",[934,1194,1196],{"class":936,"line":1195},18,[934,1197,1198],{"class":1114},"  --color-accent-foreground: var(--ui-text);\n",[934,1200,1202],{"class":936,"line":1201},19,[934,1203,1105],{"emptyLinePlaceholder":859},[934,1205,1207],{"class":936,"line":1206},20,[934,1208,1209],{"class":1114},"  --color-border: var(--ui-border);\n",[934,1211,1213],{"class":936,"line":1212},21,[934,1214,1215],{"class":1114},"  --color-input: var(--ui-border);\n",[934,1217,1219],{"class":936,"line":1218},22,[934,1220,1105],{"emptyLinePlaceholder":859},[934,1222,1224],{"class":936,"line":1223},23,[934,1225,1226],{"class":1114},"  --color-primary: var(--ui-primary);\n",[934,1228,1230],{"class":936,"line":1229},24,[934,1231,1232],{"class":1114},"  --color-primary-foreground: var(--ui-text-inverted);\n",[934,1234,1236],{"class":936,"line":1235},25,[934,1237,1105],{"emptyLinePlaceholder":859},[934,1239,1241],{"class":936,"line":1240},26,[934,1242,1243],{"class":1114},"  --color-secondary: var(--ui-secondary);\n",[934,1245,1247],{"class":936,"line":1246},27,[934,1248,1249],{"class":1114},"  --color-secondary-foreground: var(--ui-text-inverted);\n",[934,1251,1253],{"class":936,"line":1252},28,[934,1254,1105],{"emptyLinePlaceholder":859},[934,1256,1258],{"class":936,"line":1257},29,[934,1259,1260],{"class":1114},"  --color-destructive: var(--ui-error);\n",[934,1262,1264],{"class":936,"line":1263},30,[934,1265,1266],{"class":1114},"  --color-destructive-foreground: var(--ui-text-inverted);\n",[934,1268,1270],{"class":936,"line":1269},31,[934,1271,1105],{"emptyLinePlaceholder":859},[934,1273,1275],{"class":936,"line":1274},32,[934,1276,1277],{"class":1114},"  --color-ring: var(--ui-primary);\n",[934,1279,1281],{"class":936,"line":1280},33,[934,1282,1105],{"emptyLinePlaceholder":859},[934,1284,1286],{"class":936,"line":1285},34,[934,1287,1288],{"class":1114},"  --radius: var(--ui-radius);\n",[934,1290,1292],{"class":936,"line":1291},35,[934,1293,1294],{"class":1078},"}\n",[934,1296,1298],{"class":936,"line":1297},36,[934,1299,1105],{"emptyLinePlaceholder":859},[934,1301,1303,1306,1310],{"class":936,"line":1302},37,[934,1304,1305],{"class":1078},":",[934,1307,1309],{"class":1308},"spNyl","root",[934,1311,1312],{"class":1078}," {\n",[934,1314,1316,1319,1321,1325,1328,1331],{"class":936,"line":1315},38,[934,1317,1318],{"class":1114},"  --background",[934,1320,1305],{"class":1078},[934,1322,1324],{"class":1323},"s2Zo4"," var",[934,1326,1327],{"class":1078},"(",[934,1329,1330],{"class":1114},"--ui-bg",[934,1332,1333],{"class":1078},");\n",[934,1335,1337,1340,1342,1344,1346,1349],{"class":936,"line":1336},39,[934,1338,1339],{"class":1114},"  --foreground",[934,1341,1305],{"class":1078},[934,1343,1324],{"class":1323},[934,1345,1327],{"class":1078},[934,1347,1348],{"class":1114},"--ui-text",[934,1350,1333],{"class":1078},[934,1352,1354],{"class":936,"line":1353},40,[934,1355,1105],{"emptyLinePlaceholder":859},[934,1357,1359,1362,1364,1366,1368,1371],{"class":936,"line":1358},41,[934,1360,1361],{"class":1114},"  --card",[934,1363,1305],{"class":1078},[934,1365,1324],{"class":1323},[934,1367,1327],{"class":1078},[934,1369,1370],{"class":1114},"--ui-bg-elevated",[934,1372,1333],{"class":1078},[934,1374,1376,1379,1381,1383,1385,1387],{"class":936,"line":1375},42,[934,1377,1378],{"class":1114},"  --card-foreground",[934,1380,1305],{"class":1078},[934,1382,1324],{"class":1323},[934,1384,1327],{"class":1078},[934,1386,1348],{"class":1114},[934,1388,1333],{"class":1078},[934,1390,1392],{"class":936,"line":1391},43,[934,1393,1105],{"emptyLinePlaceholder":859},[934,1395,1397,1400,1402,1404,1406,1408],{"class":936,"line":1396},44,[934,1398,1399],{"class":1114},"  --popover",[934,1401,1305],{"class":1078},[934,1403,1324],{"class":1323},[934,1405,1327],{"class":1078},[934,1407,1370],{"class":1114},[934,1409,1333],{"class":1078},[934,1411,1413,1416,1418,1420,1422,1424],{"class":936,"line":1412},45,[934,1414,1415],{"class":1114},"  --popover-foreground",[934,1417,1305],{"class":1078},[934,1419,1324],{"class":1323},[934,1421,1327],{"class":1078},[934,1423,1348],{"class":1114},[934,1425,1333],{"class":1078},[934,1427,1429],{"class":936,"line":1428},46,[934,1430,1105],{"emptyLinePlaceholder":859},[934,1432,1434,1437,1439,1441,1443,1446],{"class":936,"line":1433},47,[934,1435,1436],{"class":1114},"  --muted",[934,1438,1305],{"class":1078},[934,1440,1324],{"class":1323},[934,1442,1327],{"class":1078},[934,1444,1445],{"class":1114},"--ui-bg-muted",[934,1447,1333],{"class":1078},[934,1449,1451,1454,1456,1458,1460,1463],{"class":936,"line":1450},48,[934,1452,1453],{"class":1114},"  --muted-foreground",[934,1455,1305],{"class":1078},[934,1457,1324],{"class":1323},[934,1459,1327],{"class":1078},[934,1461,1462],{"class":1114},"--ui-text-muted",[934,1464,1333],{"class":1078},[934,1466,1468],{"class":936,"line":1467},49,[934,1469,1105],{"emptyLinePlaceholder":859},[934,1471,1473,1476,1478,1480,1482,1485],{"class":936,"line":1472},50,[934,1474,1475],{"class":1114},"  --accent",[934,1477,1305],{"class":1078},[934,1479,1324],{"class":1323},[934,1481,1327],{"class":1078},[934,1483,1484],{"class":1114},"--ui-bg-accented",[934,1486,1333],{"class":1078},[934,1488,1490,1493,1495,1497,1499,1501],{"class":936,"line":1489},51,[934,1491,1492],{"class":1114},"  --accent-foreground",[934,1494,1305],{"class":1078},[934,1496,1324],{"class":1323},[934,1498,1327],{"class":1078},[934,1500,1348],{"class":1114},[934,1502,1333],{"class":1078},[934,1504,1506],{"class":936,"line":1505},52,[934,1507,1105],{"emptyLinePlaceholder":859},[934,1509,1511,1514,1516,1518,1520,1523],{"class":936,"line":1510},53,[934,1512,1513],{"class":1114},"  --border",[934,1515,1305],{"class":1078},[934,1517,1324],{"class":1323},[934,1519,1327],{"class":1078},[934,1521,1522],{"class":1114},"--ui-border",[934,1524,1333],{"class":1078},[934,1526,1528,1531,1533,1535,1537,1539],{"class":936,"line":1527},54,[934,1529,1530],{"class":1114},"  --input",[934,1532,1305],{"class":1078},[934,1534,1324],{"class":1323},[934,1536,1327],{"class":1078},[934,1538,1522],{"class":1114},[934,1540,1333],{"class":1078},[934,1542,1544],{"class":936,"line":1543},55,[934,1545,1105],{"emptyLinePlaceholder":859},[934,1547,1549,1552,1554,1556,1558,1561],{"class":936,"line":1548},56,[934,1550,1551],{"class":1114},"  --primary",[934,1553,1305],{"class":1078},[934,1555,1324],{"class":1323},[934,1557,1327],{"class":1078},[934,1559,1560],{"class":1114},"--ui-primary",[934,1562,1333],{"class":1078},[934,1564,1566,1569,1571,1573,1575,1578],{"class":936,"line":1565},57,[934,1567,1568],{"class":1114},"  --primary-foreground",[934,1570,1305],{"class":1078},[934,1572,1324],{"class":1323},[934,1574,1327],{"class":1078},[934,1576,1577],{"class":1114},"--ui-text-inverted",[934,1579,1333],{"class":1078},[934,1581,1583],{"class":936,"line":1582},58,[934,1584,1105],{"emptyLinePlaceholder":859},[934,1586,1588,1591,1593,1595,1597,1600],{"class":936,"line":1587},59,[934,1589,1590],{"class":1114},"  --secondary",[934,1592,1305],{"class":1078},[934,1594,1324],{"class":1323},[934,1596,1327],{"class":1078},[934,1598,1599],{"class":1114},"--ui-secondary",[934,1601,1333],{"class":1078},[934,1603,1605,1608,1610,1612,1614,1616],{"class":936,"line":1604},60,[934,1606,1607],{"class":1114},"  --secondary-foreground",[934,1609,1305],{"class":1078},[934,1611,1324],{"class":1323},[934,1613,1327],{"class":1078},[934,1615,1577],{"class":1114},[934,1617,1333],{"class":1078},[934,1619,1621],{"class":936,"line":1620},61,[934,1622,1105],{"emptyLinePlaceholder":859},[934,1624,1626,1629,1631,1633,1635,1638],{"class":936,"line":1625},62,[934,1627,1628],{"class":1114},"  --destructive",[934,1630,1305],{"class":1078},[934,1632,1324],{"class":1323},[934,1634,1327],{"class":1078},[934,1636,1637],{"class":1114},"--ui-error",[934,1639,1333],{"class":1078},[934,1641,1643,1646,1648,1650,1652,1654],{"class":936,"line":1642},63,[934,1644,1645],{"class":1114},"  --destructive-foreground",[934,1647,1305],{"class":1078},[934,1649,1324],{"class":1323},[934,1651,1327],{"class":1078},[934,1653,1577],{"class":1114},[934,1655,1333],{"class":1078},[934,1657,1659],{"class":936,"line":1658},64,[934,1660,1105],{"emptyLinePlaceholder":859},[934,1662,1664,1667,1669,1671,1673,1675],{"class":936,"line":1663},65,[934,1665,1666],{"class":1114},"  --ring",[934,1668,1305],{"class":1078},[934,1670,1324],{"class":1323},[934,1672,1327],{"class":1078},[934,1674,1560],{"class":1114},[934,1676,1333],{"class":1078},[934,1678,1680],{"class":936,"line":1679},66,[934,1681,1294],{"class":1078},[1056,1683,1686],{"icon":1684,"label":1685},"simple-icons:tailwindcss","Other TailwindCSS Kit",[1061,1687,1688],{},[925,1689,1691],{"className":1065,"code":1690,"filename":1036,"language":1067,"meta":613,"style":613},"@import \"tailwindcss\";\n@import \"tw-animate-css\";\n\n@custom-variant dark (&:is(.dark *));\n\n:root {\n  --card: oklch(1 0 0);\n  --card-foreground: oklch(0.141 0.005 285.823);\n  --popover: oklch(1 0 0);\n  --popover-foreground: oklch(0.141 0.005 285.823);\n  --primary: oklch(0.21 0.006 285.885);\n  --primary-foreground: oklch(0.985 0 0);\n  --secondary: oklch(0.967 0.001 286.375);\n  --secondary-foreground: oklch(0.21 0.006 285.885);\n  --muted: oklch(0.967 0.001 286.375);\n  --muted-foreground: oklch(0.552 0.016 285.938);\n  --accent: oklch(0.967 0.001 286.375);\n  --accent-foreground: oklch(0.21 0.006 285.885);\n  --destructive: oklch(0.577 0.245 27.325);\n  --destructive-foreground: oklch(0.577 0.245 27.325);\n  --border: oklch(0.92 0.004 286.32);\n  --input: oklch(0.92 0.004 286.32);\n  --ring: oklch(0.705 0.015 286.067);\n  --radius: 0.625rem;\n  --background: oklch(1 0 0);\n  --foreground: oklch(0.141 0.005 285.823);\n}\n\n.dark {\n  --background: oklch(0.141 0.005 285.823);\n  --foreground: oklch(0.985 0 0);\n  --card: oklch(0.141 0.005 285.823);\n  --card-foreground: oklch(0.985 0 0);\n  --popover: oklch(0.141 0.005 285.823);\n  --popover-foreground: oklch(0.985 0 0);\n  --primary: oklch(0.985 0 0);\n  --primary-foreground: oklch(0.21 0.006 285.885);\n  --secondary: oklch(0.274 0.006 286.033);\n  --secondary-foreground: oklch(0.985 0 0);\n  --muted: oklch(0.274 0.006 286.033);\n  --muted-foreground: oklch(0.705 0.015 286.067);\n  --accent: oklch(0.274 0.006 286.033);\n  --accent-foreground: oklch(0.985 0 0);\n  --destructive: oklch(0.396 0.141 25.723);\n  --destructive-foreground: oklch(0.637 0.237 25.331);\n  --border: oklch(0.274 0.006 286.033);\n  --input: oklch(0.274 0.006 286.033);\n  --ring: oklch(0.442 0.017 285.786);\n}\n\n@theme inline {\n  --color-background: var(--background);\n  --color-foreground: var(--foreground);\n  --color-card: var(--card);\n  --color-card-foreground: var(--card-foreground);\n  --color-popover: var(--popover);\n  --color-popover-foreground: var(--popover-foreground);\n  --color-primary: var(--primary);\n  --color-primary-foreground: var(--primary-foreground);\n  --color-secondary: var(--secondary);\n  --color-secondary-foreground: var(--secondary-foreground);\n  --color-muted: var(--muted);\n  --color-muted-foreground: var(--muted-foreground);\n  --color-accent: var(--accent);\n  --color-accent-foreground: var(--accent-foreground);\n  --color-destructive: var(--destructive);\n  --color-destructive-foreground: var(--destructive-foreground);\n  --color-border: var(--border);\n  --color-input: var(--input);\n  --color-ring: var(--ring);\n\n  --radius-sm: calc(var(--radius) - 4px);\n  --radius-md: calc(var(--radius) - 2px);\n  --radius-lg: var(--radius);\n  --radius-xl: calc(var(--radius) + 4px);\n}\n\n@layer base {\n  * {\n    @apply border-border outline-ring/50;\n  }\n  body {\n    @apply bg-background text-foreground;\n  }\n}\n\nhtml {\n  color-scheme: light dark;\n}\nhtml.dark {\n  color-scheme: dark;\n}\nhtml.light {\n  color-scheme: light;\n}\n",[894,1692,1693,1705,1718,1722,1732,1736,1744,1766,1787,1805,1823,1844,1863,1884,1902,1920,1941,1959,1977,1998,2016,2037,2055,2076,2088,2106,2124,2128,2132,2141,2159,2177,2195,2213,2231,2249,2267,2285,2305,2323,2341,2359,2377,2395,2416,2437,2455,2473,2494,2498,2502,2511,2516,2521,2526,2531,2536,2541,2546,2551,2556,2561,2566,2571,2576,2581,2586,2592,2598,2604,2610,2615,2621,2627,2633,2645,2650,2655,2666,2674,2682,2688,2696,2704,2709,2714,2719,2727,2741,2746,2757,2769,2774,2786,2798],{"__ignoreMap":613},[934,1694,1695,1697,1699,1701,1703],{"class":936,"line":937},[934,1696,1075],{"class":1074},[934,1698,1079],{"class":1078},[934,1700,896],{"class":943},[934,1702,1084],{"class":1078},[934,1704,1087],{"class":1078},[934,1706,1707,1709,1711,1714,1716],{"class":936,"line":847},[934,1708,1075],{"class":1074},[934,1710,1079],{"class":1078},[934,1712,1713],{"class":943},"tw-animate-css",[934,1715,1084],{"class":1078},[934,1717,1087],{"class":1078},[934,1719,1720],{"class":936,"line":850},[934,1721,1105],{"emptyLinePlaceholder":859},[934,1723,1724,1727,1730],{"class":936,"line":1108},[934,1725,1726],{"class":1074},"@custom-variant",[934,1728,1729],{"class":1114}," dark (&:is(.dark *))",[934,1731,1087],{"class":1078},[934,1733,1734],{"class":936,"line":1121},[934,1735,1105],{"emptyLinePlaceholder":859},[934,1737,1738,1740,1742],{"class":936,"line":1127},[934,1739,1305],{"class":1078},[934,1741,1309],{"class":1308},[934,1743,1312],{"class":1078},[934,1745,1746,1748,1750,1753,1755,1759,1762,1764],{"class":936,"line":1133},[934,1747,1361],{"class":1114},[934,1749,1305],{"class":1078},[934,1751,1752],{"class":1323}," oklch",[934,1754,1327],{"class":1078},[934,1756,1758],{"class":1757},"sbssI","1",[934,1760,1761],{"class":1757}," 0",[934,1763,1761],{"class":1757},[934,1765,1333],{"class":1078},[934,1767,1768,1770,1772,1774,1776,1779,1782,1785],{"class":936,"line":1138},[934,1769,1378],{"class":1114},[934,1771,1305],{"class":1078},[934,1773,1752],{"class":1323},[934,1775,1327],{"class":1078},[934,1777,1778],{"class":1757},"0.141",[934,1780,1781],{"class":1757}," 0.005",[934,1783,1784],{"class":1757}," 285.823",[934,1786,1333],{"class":1078},[934,1788,1789,1791,1793,1795,1797,1799,1801,1803],{"class":936,"line":1144},[934,1790,1399],{"class":1114},[934,1792,1305],{"class":1078},[934,1794,1752],{"class":1323},[934,1796,1327],{"class":1078},[934,1798,1758],{"class":1757},[934,1800,1761],{"class":1757},[934,1802,1761],{"class":1757},[934,1804,1333],{"class":1078},[934,1806,1807,1809,1811,1813,1815,1817,1819,1821],{"class":936,"line":1150},[934,1808,1415],{"class":1114},[934,1810,1305],{"class":1078},[934,1812,1752],{"class":1323},[934,1814,1327],{"class":1078},[934,1816,1778],{"class":1757},[934,1818,1781],{"class":1757},[934,1820,1784],{"class":1757},[934,1822,1333],{"class":1078},[934,1824,1825,1827,1829,1831,1833,1836,1839,1842],{"class":936,"line":1155},[934,1826,1551],{"class":1114},[934,1828,1305],{"class":1078},[934,1830,1752],{"class":1323},[934,1832,1327],{"class":1078},[934,1834,1835],{"class":1757},"0.21",[934,1837,1838],{"class":1757}," 0.006",[934,1840,1841],{"class":1757}," 285.885",[934,1843,1333],{"class":1078},[934,1845,1846,1848,1850,1852,1854,1857,1859,1861],{"class":936,"line":1161},[934,1847,1568],{"class":1114},[934,1849,1305],{"class":1078},[934,1851,1752],{"class":1323},[934,1853,1327],{"class":1078},[934,1855,1856],{"class":1757},"0.985",[934,1858,1761],{"class":1757},[934,1860,1761],{"class":1757},[934,1862,1333],{"class":1078},[934,1864,1865,1867,1869,1871,1873,1876,1879,1882],{"class":936,"line":1167},[934,1866,1590],{"class":1114},[934,1868,1305],{"class":1078},[934,1870,1752],{"class":1323},[934,1872,1327],{"class":1078},[934,1874,1875],{"class":1757},"0.967",[934,1877,1878],{"class":1757}," 0.001",[934,1880,1881],{"class":1757}," 286.375",[934,1883,1333],{"class":1078},[934,1885,1886,1888,1890,1892,1894,1896,1898,1900],{"class":936,"line":1172},[934,1887,1607],{"class":1114},[934,1889,1305],{"class":1078},[934,1891,1752],{"class":1323},[934,1893,1327],{"class":1078},[934,1895,1835],{"class":1757},[934,1897,1838],{"class":1757},[934,1899,1841],{"class":1757},[934,1901,1333],{"class":1078},[934,1903,1904,1906,1908,1910,1912,1914,1916,1918],{"class":936,"line":1178},[934,1905,1436],{"class":1114},[934,1907,1305],{"class":1078},[934,1909,1752],{"class":1323},[934,1911,1327],{"class":1078},[934,1913,1875],{"class":1757},[934,1915,1878],{"class":1757},[934,1917,1881],{"class":1757},[934,1919,1333],{"class":1078},[934,1921,1922,1924,1926,1928,1930,1933,1936,1939],{"class":936,"line":1184},[934,1923,1453],{"class":1114},[934,1925,1305],{"class":1078},[934,1927,1752],{"class":1323},[934,1929,1327],{"class":1078},[934,1931,1932],{"class":1757},"0.552",[934,1934,1935],{"class":1757}," 0.016",[934,1937,1938],{"class":1757}," 285.938",[934,1940,1333],{"class":1078},[934,1942,1943,1945,1947,1949,1951,1953,1955,1957],{"class":936,"line":1189},[934,1944,1475],{"class":1114},[934,1946,1305],{"class":1078},[934,1948,1752],{"class":1323},[934,1950,1327],{"class":1078},[934,1952,1875],{"class":1757},[934,1954,1878],{"class":1757},[934,1956,1881],{"class":1757},[934,1958,1333],{"class":1078},[934,1960,1961,1963,1965,1967,1969,1971,1973,1975],{"class":936,"line":1195},[934,1962,1492],{"class":1114},[934,1964,1305],{"class":1078},[934,1966,1752],{"class":1323},[934,1968,1327],{"class":1078},[934,1970,1835],{"class":1757},[934,1972,1838],{"class":1757},[934,1974,1841],{"class":1757},[934,1976,1333],{"class":1078},[934,1978,1979,1981,1983,1985,1987,1990,1993,1996],{"class":936,"line":1201},[934,1980,1628],{"class":1114},[934,1982,1305],{"class":1078},[934,1984,1752],{"class":1323},[934,1986,1327],{"class":1078},[934,1988,1989],{"class":1757},"0.577",[934,1991,1992],{"class":1757}," 0.245",[934,1994,1995],{"class":1757}," 27.325",[934,1997,1333],{"class":1078},[934,1999,2000,2002,2004,2006,2008,2010,2012,2014],{"class":936,"line":1206},[934,2001,1645],{"class":1114},[934,2003,1305],{"class":1078},[934,2005,1752],{"class":1323},[934,2007,1327],{"class":1078},[934,2009,1989],{"class":1757},[934,2011,1992],{"class":1757},[934,2013,1995],{"class":1757},[934,2015,1333],{"class":1078},[934,2017,2018,2020,2022,2024,2026,2029,2032,2035],{"class":936,"line":1212},[934,2019,1513],{"class":1114},[934,2021,1305],{"class":1078},[934,2023,1752],{"class":1323},[934,2025,1327],{"class":1078},[934,2027,2028],{"class":1757},"0.92",[934,2030,2031],{"class":1757}," 0.004",[934,2033,2034],{"class":1757}," 286.32",[934,2036,1333],{"class":1078},[934,2038,2039,2041,2043,2045,2047,2049,2051,2053],{"class":936,"line":1218},[934,2040,1530],{"class":1114},[934,2042,1305],{"class":1078},[934,2044,1752],{"class":1323},[934,2046,1327],{"class":1078},[934,2048,2028],{"class":1757},[934,2050,2031],{"class":1757},[934,2052,2034],{"class":1757},[934,2054,1333],{"class":1078},[934,2056,2057,2059,2061,2063,2065,2068,2071,2074],{"class":936,"line":1223},[934,2058,1666],{"class":1114},[934,2060,1305],{"class":1078},[934,2062,1752],{"class":1323},[934,2064,1327],{"class":1078},[934,2066,2067],{"class":1757},"0.705",[934,2069,2070],{"class":1757}," 0.015",[934,2072,2073],{"class":1757}," 286.067",[934,2075,1333],{"class":1078},[934,2077,2078,2081,2083,2086],{"class":936,"line":1229},[934,2079,2080],{"class":1114},"  --radius",[934,2082,1305],{"class":1078},[934,2084,2085],{"class":1757}," 0.625rem",[934,2087,1087],{"class":1078},[934,2089,2090,2092,2094,2096,2098,2100,2102,2104],{"class":936,"line":1235},[934,2091,1318],{"class":1114},[934,2093,1305],{"class":1078},[934,2095,1752],{"class":1323},[934,2097,1327],{"class":1078},[934,2099,1758],{"class":1757},[934,2101,1761],{"class":1757},[934,2103,1761],{"class":1757},[934,2105,1333],{"class":1078},[934,2107,2108,2110,2112,2114,2116,2118,2120,2122],{"class":936,"line":1240},[934,2109,1339],{"class":1114},[934,2111,1305],{"class":1078},[934,2113,1752],{"class":1323},[934,2115,1327],{"class":1078},[934,2117,1778],{"class":1757},[934,2119,1781],{"class":1757},[934,2121,1784],{"class":1757},[934,2123,1333],{"class":1078},[934,2125,2126],{"class":936,"line":1246},[934,2127,1294],{"class":1078},[934,2129,2130],{"class":936,"line":1252},[934,2131,1105],{"emptyLinePlaceholder":859},[934,2133,2134,2136,2139],{"class":936,"line":1257},[934,2135,880],{"class":1078},[934,2137,2138],{"class":940},"dark",[934,2140,1312],{"class":1078},[934,2142,2143,2145,2147,2149,2151,2153,2155,2157],{"class":936,"line":1263},[934,2144,1318],{"class":1114},[934,2146,1305],{"class":1078},[934,2148,1752],{"class":1323},[934,2150,1327],{"class":1078},[934,2152,1778],{"class":1757},[934,2154,1781],{"class":1757},[934,2156,1784],{"class":1757},[934,2158,1333],{"class":1078},[934,2160,2161,2163,2165,2167,2169,2171,2173,2175],{"class":936,"line":1269},[934,2162,1339],{"class":1114},[934,2164,1305],{"class":1078},[934,2166,1752],{"class":1323},[934,2168,1327],{"class":1078},[934,2170,1856],{"class":1757},[934,2172,1761],{"class":1757},[934,2174,1761],{"class":1757},[934,2176,1333],{"class":1078},[934,2178,2179,2181,2183,2185,2187,2189,2191,2193],{"class":936,"line":1274},[934,2180,1361],{"class":1114},[934,2182,1305],{"class":1078},[934,2184,1752],{"class":1323},[934,2186,1327],{"class":1078},[934,2188,1778],{"class":1757},[934,2190,1781],{"class":1757},[934,2192,1784],{"class":1757},[934,2194,1333],{"class":1078},[934,2196,2197,2199,2201,2203,2205,2207,2209,2211],{"class":936,"line":1280},[934,2198,1378],{"class":1114},[934,2200,1305],{"class":1078},[934,2202,1752],{"class":1323},[934,2204,1327],{"class":1078},[934,2206,1856],{"class":1757},[934,2208,1761],{"class":1757},[934,2210,1761],{"class":1757},[934,2212,1333],{"class":1078},[934,2214,2215,2217,2219,2221,2223,2225,2227,2229],{"class":936,"line":1285},[934,2216,1399],{"class":1114},[934,2218,1305],{"class":1078},[934,2220,1752],{"class":1323},[934,2222,1327],{"class":1078},[934,2224,1778],{"class":1757},[934,2226,1781],{"class":1757},[934,2228,1784],{"class":1757},[934,2230,1333],{"class":1078},[934,2232,2233,2235,2237,2239,2241,2243,2245,2247],{"class":936,"line":1291},[934,2234,1415],{"class":1114},[934,2236,1305],{"class":1078},[934,2238,1752],{"class":1323},[934,2240,1327],{"class":1078},[934,2242,1856],{"class":1757},[934,2244,1761],{"class":1757},[934,2246,1761],{"class":1757},[934,2248,1333],{"class":1078},[934,2250,2251,2253,2255,2257,2259,2261,2263,2265],{"class":936,"line":1297},[934,2252,1551],{"class":1114},[934,2254,1305],{"class":1078},[934,2256,1752],{"class":1323},[934,2258,1327],{"class":1078},[934,2260,1856],{"class":1757},[934,2262,1761],{"class":1757},[934,2264,1761],{"class":1757},[934,2266,1333],{"class":1078},[934,2268,2269,2271,2273,2275,2277,2279,2281,2283],{"class":936,"line":1302},[934,2270,1568],{"class":1114},[934,2272,1305],{"class":1078},[934,2274,1752],{"class":1323},[934,2276,1327],{"class":1078},[934,2278,1835],{"class":1757},[934,2280,1838],{"class":1757},[934,2282,1841],{"class":1757},[934,2284,1333],{"class":1078},[934,2286,2287,2289,2291,2293,2295,2298,2300,2303],{"class":936,"line":1315},[934,2288,1590],{"class":1114},[934,2290,1305],{"class":1078},[934,2292,1752],{"class":1323},[934,2294,1327],{"class":1078},[934,2296,2297],{"class":1757},"0.274",[934,2299,1838],{"class":1757},[934,2301,2302],{"class":1757}," 286.033",[934,2304,1333],{"class":1078},[934,2306,2307,2309,2311,2313,2315,2317,2319,2321],{"class":936,"line":1336},[934,2308,1607],{"class":1114},[934,2310,1305],{"class":1078},[934,2312,1752],{"class":1323},[934,2314,1327],{"class":1078},[934,2316,1856],{"class":1757},[934,2318,1761],{"class":1757},[934,2320,1761],{"class":1757},[934,2322,1333],{"class":1078},[934,2324,2325,2327,2329,2331,2333,2335,2337,2339],{"class":936,"line":1353},[934,2326,1436],{"class":1114},[934,2328,1305],{"class":1078},[934,2330,1752],{"class":1323},[934,2332,1327],{"class":1078},[934,2334,2297],{"class":1757},[934,2336,1838],{"class":1757},[934,2338,2302],{"class":1757},[934,2340,1333],{"class":1078},[934,2342,2343,2345,2347,2349,2351,2353,2355,2357],{"class":936,"line":1358},[934,2344,1453],{"class":1114},[934,2346,1305],{"class":1078},[934,2348,1752],{"class":1323},[934,2350,1327],{"class":1078},[934,2352,2067],{"class":1757},[934,2354,2070],{"class":1757},[934,2356,2073],{"class":1757},[934,2358,1333],{"class":1078},[934,2360,2361,2363,2365,2367,2369,2371,2373,2375],{"class":936,"line":1375},[934,2362,1475],{"class":1114},[934,2364,1305],{"class":1078},[934,2366,1752],{"class":1323},[934,2368,1327],{"class":1078},[934,2370,2297],{"class":1757},[934,2372,1838],{"class":1757},[934,2374,2302],{"class":1757},[934,2376,1333],{"class":1078},[934,2378,2379,2381,2383,2385,2387,2389,2391,2393],{"class":936,"line":1391},[934,2380,1492],{"class":1114},[934,2382,1305],{"class":1078},[934,2384,1752],{"class":1323},[934,2386,1327],{"class":1078},[934,2388,1856],{"class":1757},[934,2390,1761],{"class":1757},[934,2392,1761],{"class":1757},[934,2394,1333],{"class":1078},[934,2396,2397,2399,2401,2403,2405,2408,2411,2414],{"class":936,"line":1396},[934,2398,1628],{"class":1114},[934,2400,1305],{"class":1078},[934,2402,1752],{"class":1323},[934,2404,1327],{"class":1078},[934,2406,2407],{"class":1757},"0.396",[934,2409,2410],{"class":1757}," 0.141",[934,2412,2413],{"class":1757}," 25.723",[934,2415,1333],{"class":1078},[934,2417,2418,2420,2422,2424,2426,2429,2432,2435],{"class":936,"line":1412},[934,2419,1645],{"class":1114},[934,2421,1305],{"class":1078},[934,2423,1752],{"class":1323},[934,2425,1327],{"class":1078},[934,2427,2428],{"class":1757},"0.637",[934,2430,2431],{"class":1757}," 0.237",[934,2433,2434],{"class":1757}," 25.331",[934,2436,1333],{"class":1078},[934,2438,2439,2441,2443,2445,2447,2449,2451,2453],{"class":936,"line":1428},[934,2440,1513],{"class":1114},[934,2442,1305],{"class":1078},[934,2444,1752],{"class":1323},[934,2446,1327],{"class":1078},[934,2448,2297],{"class":1757},[934,2450,1838],{"class":1757},[934,2452,2302],{"class":1757},[934,2454,1333],{"class":1078},[934,2456,2457,2459,2461,2463,2465,2467,2469,2471],{"class":936,"line":1433},[934,2458,1530],{"class":1114},[934,2460,1305],{"class":1078},[934,2462,1752],{"class":1323},[934,2464,1327],{"class":1078},[934,2466,2297],{"class":1757},[934,2468,1838],{"class":1757},[934,2470,2302],{"class":1757},[934,2472,1333],{"class":1078},[934,2474,2475,2477,2479,2481,2483,2486,2489,2492],{"class":936,"line":1450},[934,2476,1666],{"class":1114},[934,2478,1305],{"class":1078},[934,2480,1752],{"class":1323},[934,2482,1327],{"class":1078},[934,2484,2485],{"class":1757},"0.442",[934,2487,2488],{"class":1757}," 0.017",[934,2490,2491],{"class":1757}," 285.786",[934,2493,1333],{"class":1078},[934,2495,2496],{"class":936,"line":1467},[934,2497,1294],{"class":1078},[934,2499,2500],{"class":936,"line":1472},[934,2501,1105],{"emptyLinePlaceholder":859},[934,2503,2504,2506,2509],{"class":936,"line":1489},[934,2505,1111],{"class":1074},[934,2507,2508],{"class":1114}," inline ",[934,2510,1118],{"class":1078},[934,2512,2513],{"class":936,"line":1505},[934,2514,2515],{"class":1114},"  --color-background: var(--background);\n",[934,2517,2518],{"class":936,"line":1510},[934,2519,2520],{"class":1114},"  --color-foreground: var(--foreground);\n",[934,2522,2523],{"class":936,"line":1527},[934,2524,2525],{"class":1114},"  --color-card: var(--card);\n",[934,2527,2528],{"class":936,"line":1543},[934,2529,2530],{"class":1114},"  --color-card-foreground: var(--card-foreground);\n",[934,2532,2533],{"class":936,"line":1548},[934,2534,2535],{"class":1114},"  --color-popover: var(--popover);\n",[934,2537,2538],{"class":936,"line":1565},[934,2539,2540],{"class":1114},"  --color-popover-foreground: var(--popover-foreground);\n",[934,2542,2543],{"class":936,"line":1582},[934,2544,2545],{"class":1114},"  --color-primary: var(--primary);\n",[934,2547,2548],{"class":936,"line":1587},[934,2549,2550],{"class":1114},"  --color-primary-foreground: var(--primary-foreground);\n",[934,2552,2553],{"class":936,"line":1604},[934,2554,2555],{"class":1114},"  --color-secondary: var(--secondary);\n",[934,2557,2558],{"class":936,"line":1620},[934,2559,2560],{"class":1114},"  --color-secondary-foreground: var(--secondary-foreground);\n",[934,2562,2563],{"class":936,"line":1625},[934,2564,2565],{"class":1114},"  --color-muted: var(--muted);\n",[934,2567,2568],{"class":936,"line":1642},[934,2569,2570],{"class":1114},"  --color-muted-foreground: var(--muted-foreground);\n",[934,2572,2573],{"class":936,"line":1658},[934,2574,2575],{"class":1114},"  --color-accent: var(--accent);\n",[934,2577,2578],{"class":936,"line":1663},[934,2579,2580],{"class":1114},"  --color-accent-foreground: var(--accent-foreground);\n",[934,2582,2583],{"class":936,"line":1679},[934,2584,2585],{"class":1114},"  --color-destructive: var(--destructive);\n",[934,2587,2589],{"class":936,"line":2588},67,[934,2590,2591],{"class":1114},"  --color-destructive-foreground: var(--destructive-foreground);\n",[934,2593,2595],{"class":936,"line":2594},68,[934,2596,2597],{"class":1114},"  --color-border: var(--border);\n",[934,2599,2601],{"class":936,"line":2600},69,[934,2602,2603],{"class":1114},"  --color-input: var(--input);\n",[934,2605,2607],{"class":936,"line":2606},70,[934,2608,2609],{"class":1114},"  --color-ring: var(--ring);\n",[934,2611,2613],{"class":936,"line":2612},71,[934,2614,1105],{"emptyLinePlaceholder":859},[934,2616,2618],{"class":936,"line":2617},72,[934,2619,2620],{"class":1114},"  --radius-sm: calc(var(--radius) - 4px);\n",[934,2622,2624],{"class":936,"line":2623},73,[934,2625,2626],{"class":1114},"  --radius-md: calc(var(--radius) - 2px);\n",[934,2628,2630],{"class":936,"line":2629},74,[934,2631,2632],{"class":1114},"  --radius-lg: var(--radius);\n",[934,2634,2636,2639,2642],{"class":936,"line":2635},75,[934,2637,2638],{"class":1114},"  --radius-xl: calc(var(--radius) ",[934,2640,2641],{"class":1078},"+",[934,2643,2644],{"class":1114}," 4px);\n",[934,2646,2648],{"class":936,"line":2647},76,[934,2649,1294],{"class":1078},[934,2651,2653],{"class":936,"line":2652},77,[934,2654,1105],{"emptyLinePlaceholder":859},[934,2656,2658,2661,2664],{"class":936,"line":2657},78,[934,2659,2660],{"class":1074},"@layer",[934,2662,2663],{"class":1114}," base ",[934,2665,1118],{"class":1078},[934,2667,2669,2672],{"class":936,"line":2668},79,[934,2670,2671],{"class":940},"  *",[934,2673,1312],{"class":1078},[934,2675,2677,2680],{"class":936,"line":2676},80,[934,2678,2679],{"class":1114},"    @apply border-border outline-ring/50",[934,2681,1087],{"class":1078},[934,2683,2685],{"class":936,"line":2684},81,[934,2686,2687],{"class":1078},"  }\n",[934,2689,2691,2694],{"class":936,"line":2690},82,[934,2692,2693],{"class":940},"  body",[934,2695,1312],{"class":1078},[934,2697,2699,2702],{"class":936,"line":2698},83,[934,2700,2701],{"class":1114},"    @apply bg-background text-foreground",[934,2703,1087],{"class":1078},[934,2705,2707],{"class":936,"line":2706},84,[934,2708,2687],{"class":1078},[934,2710,2712],{"class":936,"line":2711},85,[934,2713,1294],{"class":1078},[934,2715,2717],{"class":936,"line":2716},86,[934,2718,1105],{"emptyLinePlaceholder":859},[934,2720,2722,2725],{"class":936,"line":2721},87,[934,2723,2724],{"class":940},"html",[934,2726,1312],{"class":1078},[934,2728,2730,2734,2736,2739],{"class":936,"line":2729},88,[934,2731,2733],{"class":2732},"sqsOY","  color-scheme",[934,2735,1305],{"class":1078},[934,2737,2738],{"class":1114}," light dark",[934,2740,1087],{"class":1078},[934,2742,2744],{"class":936,"line":2743},89,[934,2745,1294],{"class":1078},[934,2747,2749,2751,2753,2755],{"class":936,"line":2748},90,[934,2750,2724],{"class":940},[934,2752,880],{"class":1078},[934,2754,2138],{"class":940},[934,2756,1312],{"class":1078},[934,2758,2760,2762,2764,2767],{"class":936,"line":2759},91,[934,2761,2733],{"class":2732},[934,2763,1305],{"class":1078},[934,2765,2766],{"class":1114}," dark",[934,2768,1087],{"class":1078},[934,2770,2772],{"class":936,"line":2771},92,[934,2773,1294],{"class":1078},[934,2775,2777,2779,2781,2784],{"class":936,"line":2776},93,[934,2778,2724],{"class":940},[934,2780,880],{"class":1078},[934,2782,2783],{"class":940},"light",[934,2785,1312],{"class":1078},[934,2787,2789,2791,2793,2796],{"class":936,"line":2788},94,[934,2790,2733],{"class":2732},[934,2792,1305],{"class":1078},[934,2794,2795],{"class":1114}," light",[934,2797,1087],{"class":1078},[934,2799,2801],{"class":936,"line":2800},95,[934,2802,1294],{"class":1078},[1039,2804,2808],{"className":2805,"icon":2807},[2806],"mt-12","tabler:check","Great job! Your project is now configured to use Inspira UI.",[728,2810,2812],{"id":2811},"optional-add-icon-support","Optional: Add Icon Support",[692,2814,2815,2816,2819],{},"A variety of Inspira UI components and demos utilize the ",[894,2817,2818],{},"\u003CIcon>"," component with Iconify icons. Although optional, we recommend installing it for an optimal experience.",[692,2821,2822,2823,880],{},"To add icon support to your Vue.js or Nuxt.js project, please follow the ",[696,2824,2827],{"href":2825,"rel":2826},"https://iconify.design/docs/icon-components/vue/",[700],"Iconify Vue guide",[728,2829,2831],{"id":2830},"start-using-inspira-ui","Start Using Inspira UI 🚀",[692,2833,2834],{},"Now, you can start using Inspira UI components in your project. Choose the components you need, copy the code, and integrate them into your application.",[2836,2837,2838],"style",{},"html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html pre.shiki code .sqsOY, html code.shiki .sqsOY{--shiki-light:#8796B0;--shiki-default:#B2CCD6;--shiki-dark:#B2CCD6}",{"title":613,"searchDepth":847,"depth":847,"links":2840},[2841],{"id":884,"depth":847,"text":885,"children":2842},[2843,2845,2846,2848,2849],{"id":891,"depth":850,"text":2844},"Set up tailwindcss",{"id":916,"depth":850,"text":917},{"id":1032,"depth":850,"text":2847},"Update your main.css file",{"id":2811,"depth":850,"text":2812},{"id":2830,"depth":850,"text":2831},"How to install Inspira UI in your app.",{"icon":2852},"lucide:play",{"title":11,"description":2850},"oRgPplEYKEGnDuBhHp8-RlIDnJxykQDE6ZzOyxMek1Q",{"id":2856,"title":15,"badge":687,"body":2857,"category":687,"description":5430,"extension":856,"links":687,"meta":5431,"navigation":859,"path":16,"seo":5433,"stem":17,"tags":687,"__hash__":5434},"docs_en/en/1.getting-started/3.contribution.md",{"type":689,"value":2858,"toc":5406},[2859,2865,2869,2972,2975,2978,3012,3015,3022,3025,3028,3038,3052,3055,3061,3071,3074,3077,3096,3101,3395,3398,3401,3448,3451,3454,3485,3488,3491,3598,3603,3610,3947,3952,3958,3973,4215,4226,4231,4250,4253,4284,4287,4290,4294,4360,4363,4370,4612,4617,4762,4781,4784,4787,5004,5008,5282,5285,5330,5334,5392,5395,5403],[692,2860,2861,2862,2864],{},"Thank you for your interest in contributing to the ",[702,2863,704],{}," project! Your contributions help make this project better for everyone. Please take a moment to read through these guidelines to ensure a smooth collaboration.",[882,2866,2868],{"id":2867},"table-of-contents","Table of Contents",[2870,2871,2872,2877,2882,2908,2914,2940,2960,2966],"ol",{},[754,2873,2874],{},[696,2875,5],{"href":2876},"#getting-started",[754,2878,2879],{},[696,2880,19],{"href":2881},"#code-of-conduct",[754,2883,2884,2888],{},[696,2885,2887],{"href":2886},"#how-to-contribute","How to Contribute",[751,2889,2890,2896,2902],{},[754,2891,2892],{},[696,2893,2895],{"href":2894},"#reporting-bugs","Reporting Bugs",[754,2897,2898],{},[696,2899,2901],{"href":2900},"#suggesting-enhancements","Suggesting Enhancements",[754,2903,2904],{},[696,2905,2907],{"href":2906},"#adding-new-components","Adding New Components",[754,2909,2910],{},[696,2911,2913],{"href":2912},"#project-structure","Project Structure",[754,2915,2916,2920],{},[696,2917,2919],{"href":2918},"#style-guidelines","Style Guidelines",[751,2921,2922,2928,2934],{},[754,2923,2924],{},[696,2925,2927],{"href":2926},"#coding-standards","Coding Standards",[754,2929,2930],{},[696,2931,2933],{"href":2932},"#component-format","Component Format",[754,2935,2936],{},[696,2937,2939],{"href":2938},"#commit-messages","Commit Messages",[754,2941,2942,2946],{},[696,2943,2945],{"href":2944},"#documentation-guidelines","Documentation Guidelines",[751,2947,2948,2954],{},[754,2949,2950],{},[696,2951,2953],{"href":2952},"#single-file-components","Single-File Components",[754,2955,2956],{},[696,2957,2959],{"href":2958},"#multi-file-components","Multi-File Components",[754,2961,2962],{},[696,2963,2965],{"href":2964},"#testing","Testing",[754,2967,2968],{},[696,2969,2971],{"href":2970},"#license","License",[2973,2974],"hr",{},[882,2976,5],{"id":2977},"getting-started",[751,2979,2980,2986,2992,3002],{},[754,2981,2982,2985],{},[702,2983,2984],{},"Fork the Repository",": Create a personal fork of the project on GitHub.",[754,2987,2988,2991],{},[702,2989,2990],{},"Clone Your Fork",": Clone your forked repository to your local machine.",[754,2993,2994,2997,2998,3001],{},[702,2995,2996],{},"Create a Branch",": Create a new branch for your contribution (",[894,2999,3000],{},"git checkout -b feature/YourFeatureName",").",[754,3003,3004,3007,3008,3011],{},[702,3005,3006],{},"Install Dependencies",": Run ",[894,3009,3010],{},"pnpm install"," to install all necessary dependencies.",[882,3013,19],{"id":3014},"code-of-conduct",[692,3016,3017,3018,3021],{},"By participating in this project, you agree to abide by the ",[696,3019,19],{"href":3020},"./code-of-conduct",", which aims to foster an open and welcoming environment.",[882,3023,2887],{"id":3024},"how-to-contribute",[728,3026,2895],{"id":3027},"reporting-bugs",[692,3029,3030,3031,3037],{},"If you find a bug, please open an ",[696,3032,3036],{"href":3033,"rel":3034,":target":3035},"https://github.com/unovue/inspira-ui/issues",[700],"\\_blank","issue"," and include:",[751,3039,3040,3043,3046,3049],{},[754,3041,3042],{},"A clear and descriptive title.",[754,3044,3045],{},"Steps to reproduce the issue.",[754,3047,3048],{},"Expected and actual results.",[754,3050,3051],{},"Screenshots or code snippets, if applicable.",[728,3053,2901],{"id":3054},"suggesting-enhancements",[692,3056,3057,3058,3037],{},"We welcome suggestions for new features or improvements. Please open an ",[696,3059,3036],{"href":3033,"rel":3060,":target":3035},[700],[751,3062,3063,3065,3068],{},[754,3064,3042],{},[754,3066,3067],{},"A detailed description of the enhancement.",[754,3069,3070],{},"Any relevant examples or mockups.",[728,3072,2907],{"id":3073},"adding-new-components",[692,3075,3076],{},"We appreciate contributions that add new components to the library. Please ensure that:",[751,3078,3079,3082,3090,3093],{},[754,3080,3081],{},"The component is generally useful and aligns with the project's goals.",[754,3083,3084,3085,720,3088,880],{},"The component is compatible with both ",[702,3086,3087],{},"Nuxt",[702,3089,710],{},[754,3091,3092],{},"You follow the coding and documentation guidelines outlined below.",[754,3094,3095],{},"You include unit tests for your component.",[3097,3098,3100],"h4",{"id":3099},"components-guidelines","Components guidelines",[2870,3102,3103,3245,3259,3272,3282,3386],{},[754,3104,3105,3111,3114,3115,3118,3119,3121,3122],{},[702,3106,3107,3108],{},"Create or Update ",[894,3109,3110],{},"index.ts",[3112,3113],"br",{},"\nEach folder under ",[894,3116,3117],{},"components/content/inspira/ui/\u003Ccomponent-folder-name>/"," should have an ",[894,3120,3110],{}," that exports all Vue files. For example:",[925,3123,3127],{"className":3124,"code":3125,"language":3126,"meta":613,"style":613},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","// index.ts\nexport { default as Book } from \"./Book.vue\";\nexport { default as BookDescription } from \"./BookDescription.vue\";\nexport { default as BookHeader } from \"./BookHeader.vue\";\nexport { default as BookTitle } from \"./BookTitle.vue\";\n","ts",[894,3128,3129,3135,3167,3193,3219],{"__ignoreMap":613},[934,3130,3131],{"class":936,"line":937},[934,3132,3134],{"class":3133},"sHwdD","// index.ts\n",[934,3136,3137,3140,3143,3146,3149,3152,3155,3158,3160,3163,3165],{"class":936,"line":847},[934,3138,3139],{"class":1074},"export",[934,3141,3142],{"class":1078}," {",[934,3144,3145],{"class":1074}," default",[934,3147,3148],{"class":1074}," as",[934,3150,3151],{"class":1114}," Book",[934,3153,3154],{"class":1078}," }",[934,3156,3157],{"class":1074}," from",[934,3159,1079],{"class":1078},[934,3161,3162],{"class":943},"./Book.vue",[934,3164,1084],{"class":1078},[934,3166,1087],{"class":1078},[934,3168,3169,3171,3173,3175,3177,3180,3182,3184,3186,3189,3191],{"class":936,"line":850},[934,3170,3139],{"class":1074},[934,3172,3142],{"class":1078},[934,3174,3145],{"class":1074},[934,3176,3148],{"class":1074},[934,3178,3179],{"class":1114}," BookDescription",[934,3181,3154],{"class":1078},[934,3183,3157],{"class":1074},[934,3185,1079],{"class":1078},[934,3187,3188],{"class":943},"./BookDescription.vue",[934,3190,1084],{"class":1078},[934,3192,1087],{"class":1078},[934,3194,3195,3197,3199,3201,3203,3206,3208,3210,3212,3215,3217],{"class":936,"line":1108},[934,3196,3139],{"class":1074},[934,3198,3142],{"class":1078},[934,3200,3145],{"class":1074},[934,3202,3148],{"class":1074},[934,3204,3205],{"class":1114}," BookHeader",[934,3207,3154],{"class":1078},[934,3209,3157],{"class":1074},[934,3211,1079],{"class":1078},[934,3213,3214],{"class":943},"./BookHeader.vue",[934,3216,1084],{"class":1078},[934,3218,1087],{"class":1078},[934,3220,3221,3223,3225,3227,3229,3232,3234,3236,3238,3241,3243],{"class":936,"line":1121},[934,3222,3139],{"class":1074},[934,3224,3142],{"class":1078},[934,3226,3145],{"class":1074},[934,3228,3148],{"class":1074},[934,3230,3231],{"class":1114}," BookTitle",[934,3233,3154],{"class":1078},[934,3235,3157],{"class":1074},[934,3237,1079],{"class":1078},[934,3239,3240],{"class":943},"./BookTitle.vue",[934,3242,1084],{"class":1078},[934,3244,1087],{"class":1078},[754,3246,3247,3250,3251,3254,3255,3258],{},[702,3248,3249],{},"Registry Dependencies:","\nIf your new component depends on (or uses) other Inspira UI components, you must update the ",[894,3252,3253],{},"COMPONENT_DEPENDENCIES"," map in ",[894,3256,3257],{},"~/scripts/crawl-content.ts"," to reflect those relationships. This helps the library understand which components should be installed together when a user adds them via the CLI.",[754,3260,3261,3264,3265,3268,3269,3271],{},[702,3262,3263],{},"Nuxt-Only Features:","\nIf your new component or its example uses Nuxt-only features such as ",[894,3266,3267],{},"\u003CClientOnly>",", please mention this in the documentation. This ensures users know there may be limitations or additional steps when using the component outside of Nuxt.",[3112,3270],{},"This ensures that users can install the component through the CLI and that all dependencies are properly declared.",[754,3273,3274,3277,3278,3281],{},[702,3275,3276],{},"Avoid External Components:","\nWhen creating components, avoid using external UI components (like ",[894,3279,3280],{},"\u003CUiButton>"," or similar) that are not part of the core Vue.js ecosystem.",[754,3283,3284,3287,3288],{},[702,3285,3286],{},"Explicit Imports:","\nEven if you're using Nuxt's auto-imports feature during development, always include explicit imports in your component code. This ensures compatibility with Vue.js users who don't have auto-imports. For example:",[925,3289,3293],{"className":3290,"code":3291,"language":3292,"meta":613,"style":613},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport { useWindowSize } from \"@vueuse/core\";\nimport { onMounted, ref } from \"vue\";\n// Include all imports explicitly\n\u003C/script>\n","vue",[894,3294,3295,3322,3345,3372,3377],{"__ignoreMap":613},[934,3296,3297,3300,3304,3307,3310,3313,3315,3317,3319],{"class":936,"line":937},[934,3298,3299],{"class":1078},"\u003C",[934,3301,3303],{"class":3302},"swJcz","script",[934,3305,3306],{"class":1308}," setup",[934,3308,3309],{"class":1308}," lang",[934,3311,3312],{"class":1078},"=",[934,3314,1084],{"class":1078},[934,3316,3126],{"class":943},[934,3318,1084],{"class":1078},[934,3320,3321],{"class":1078},">\n",[934,3323,3324,3327,3329,3332,3334,3336,3338,3341,3343],{"class":936,"line":847},[934,3325,3326],{"class":1074},"import",[934,3328,3142],{"class":1078},[934,3330,3331],{"class":1114}," useWindowSize",[934,3333,3154],{"class":1078},[934,3335,3157],{"class":1074},[934,3337,1079],{"class":1078},[934,3339,3340],{"class":943},"@vueuse/core",[934,3342,1084],{"class":1078},[934,3344,1087],{"class":1078},[934,3346,3347,3349,3351,3354,3357,3360,3362,3364,3366,3368,3370],{"class":936,"line":850},[934,3348,3326],{"class":1074},[934,3350,3142],{"class":1078},[934,3352,3353],{"class":1114}," onMounted",[934,3355,3356],{"class":1078},",",[934,3358,3359],{"class":1114}," ref",[934,3361,3154],{"class":1078},[934,3363,3157],{"class":1074},[934,3365,1079],{"class":1078},[934,3367,3292],{"class":943},[934,3369,1084],{"class":1078},[934,3371,1087],{"class":1078},[934,3373,3374],{"class":936,"line":1108},[934,3375,3376],{"class":3133},"// Include all imports explicitly\n",[934,3378,3379,3382,3384],{"class":936,"line":1121},[934,3380,3381],{"class":1078},"\u003C/",[934,3383,3303],{"class":3302},[934,3385,3321],{"class":1078},[754,3387,3388,3391,3392,3394],{},[702,3389,3390],{},"Icon Usage:","\nIf you need icons in your demos or components, use the built-in ",[894,3393,2818],{}," component rather than pasting raw SVGs into your templates.",[882,3396,2913],{"id":3397},"project-structure",[692,3399,3400],{},"Understanding the project structure is crucial for effective contribution:",[751,3402,3403,3431],{},[754,3404,3405,3408,3409],{},[702,3406,3407],{},"Components Directory",":\n",[751,3410,3411,3425],{},[754,3412,3413,3414,3416,3417],{},"Main components should be placed in ",[894,3415,3117],{},".\n",[751,3418,3419],{},[754,3420,3421,3422,3424],{},"Include an ",[894,3423,3110],{}," file to export each component within that folder.",[754,3426,3427,3428,880],{},"Example components should be placed in ",[894,3429,3430],{},"components/content/inspira/examples/\u003Ccomponent-folder-name>/",[754,3432,3433,3408,3436],{},[702,3434,3435],{},"Documentation",[751,3437,3438,3445],{},[754,3439,3440,3441,3444],{},"Documentation files are located in the ",[894,3442,3443],{},"content/2.components/\u003Ccategory>/"," directory.",[754,3446,3447],{},"After adding a component, write its documentation in this directory.",[882,3449,2919],{"id":3450},"style-guidelines",[728,3452,2927],{"id":3453},"coding-standards",[751,3455,3456,3466,3476],{},[754,3457,3458,3461,3462,3465],{},[702,3459,3460],{},"Language",": All components should be written in ",[702,3463,3464],{},"Vue.js"," with TypeScript support.",[754,3467,3468,3471,3472,3475],{},[702,3469,3470],{},"Styling",": Use ",[702,3473,3474],{},"Tailwind CSS"," classes for styling whenever possible.",[754,3477,3478,3471,3481,3484],{},[702,3479,3480],{},"Naming Conventions",[894,3482,3483],{},"PascalCase"," for component names and filenames.",[728,3486,2933],{"id":3487},"component-format",[692,3489,3490],{},"Your Vue components should adhere to the following structure:",[925,3492,3494],{"className":3290,"code":3493,"language":3292,"meta":613,"style":613},"\u003C!-- Template -->\n\u003Cscript lang=\"ts\" setup>\n// Your script code goes here\n\u003C/script>\n\n\u003C!-- Script (if required) -->\n\u003Ctemplate>\n  \u003C!-- Your template code goes here -->\n\u003C/template>\n\n\u003C!-- Styles (if required) -->\n\u003Cstyle scoped>\n/* Your styles go here */\n\u003C/style>\n",[894,3495,3496,3501,3521,3526,3534,3538,3543,3552,3557,3565,3569,3574,3585,3590],{"__ignoreMap":613},[934,3497,3498],{"class":936,"line":937},[934,3499,3500],{"class":3133},"\u003C!-- Template -->\n",[934,3502,3503,3505,3507,3509,3511,3513,3515,3517,3519],{"class":936,"line":847},[934,3504,3299],{"class":1078},[934,3506,3303],{"class":3302},[934,3508,3309],{"class":1308},[934,3510,3312],{"class":1078},[934,3512,1084],{"class":1078},[934,3514,3126],{"class":943},[934,3516,1084],{"class":1078},[934,3518,3306],{"class":1308},[934,3520,3321],{"class":1078},[934,3522,3523],{"class":936,"line":850},[934,3524,3525],{"class":3133},"// Your script code goes here\n",[934,3527,3528,3530,3532],{"class":936,"line":1108},[934,3529,3381],{"class":1078},[934,3531,3303],{"class":3302},[934,3533,3321],{"class":1078},[934,3535,3536],{"class":936,"line":1121},[934,3537,1105],{"emptyLinePlaceholder":859},[934,3539,3540],{"class":936,"line":1127},[934,3541,3542],{"class":3133},"\u003C!-- Script (if required) -->\n",[934,3544,3545,3547,3550],{"class":936,"line":1133},[934,3546,3299],{"class":1078},[934,3548,3549],{"class":3302},"template",[934,3551,3321],{"class":1078},[934,3553,3554],{"class":936,"line":1138},[934,3555,3556],{"class":3133},"  \u003C!-- Your template code goes here -->\n",[934,3558,3559,3561,3563],{"class":936,"line":1144},[934,3560,3381],{"class":1078},[934,3562,3549],{"class":3302},[934,3564,3321],{"class":1078},[934,3566,3567],{"class":936,"line":1150},[934,3568,1105],{"emptyLinePlaceholder":859},[934,3570,3571],{"class":936,"line":1155},[934,3572,3573],{"class":3133},"\u003C!-- Styles (if required) -->\n",[934,3575,3576,3578,3580,3583],{"class":936,"line":1161},[934,3577,3299],{"class":1078},[934,3579,2836],{"class":3302},[934,3581,3582],{"class":1308}," scoped",[934,3584,3321],{"class":1078},[934,3586,3587],{"class":936,"line":1167},[934,3588,3589],{"class":3133},"/* Your styles go here */\n",[934,3591,3592,3594,3596],{"class":936,"line":1172},[934,3593,3381],{"class":1078},[934,3595,2836],{"class":3302},[934,3597,3321],{"class":1078},[692,3599,3600],{},[702,3601,3602],{},"Props typing and code style",[692,3604,3605,3606],{},"Refer to this Vue.js documentation page -> ",[696,3607,3608],{"href":3608,"rel":3609},"https://vuejs.org/api/sfc-script-setup#type-only-props-emit-declarations",[700],[925,3611,3613],{"className":3290,"code":3612,"language":3292,"meta":613,"style":613},"\u003Cscript lang=\"ts\" setup>\nconst { msg = \"hello\", labels = [\"one\", \"two\"] } = defineProps\u003CProps>();\n\n// DON'T ⛔️\nconst props = defineProps({\n  whatever: { type: String, required: true },\n  optional: { type: String, default: \"default\" },\n});\n\nconst props = withDefaults(defineProps\u003CProps>(), { optional: \"default\" });\n\n// DO ✅\ninterface Props {\n  whatever: string;\n  optional?: string;\n}\n\n// Or DO ✅ Props destructure (v3.5+)\ninterface Props {\n  msg?: string;\n  labels?: string[];\n}\n\u003C/script>\n",[894,3614,3615,3635,3705,3709,3714,3729,3760,3790,3799,3803,3848,3852,3857,3867,3878,3889,3893,3897,3902,3910,3921,3935,3939],{"__ignoreMap":613},[934,3616,3617,3619,3621,3623,3625,3627,3629,3631,3633],{"class":936,"line":937},[934,3618,3299],{"class":1078},[934,3620,3303],{"class":3302},[934,3622,3309],{"class":1308},[934,3624,3312],{"class":1078},[934,3626,1084],{"class":1078},[934,3628,3126],{"class":943},[934,3630,1084],{"class":1078},[934,3632,3306],{"class":1308},[934,3634,3321],{"class":1078},[934,3636,3637,3640,3642,3645,3647,3649,3652,3654,3656,3659,3661,3664,3666,3669,3671,3673,3675,3678,3680,3683,3686,3689,3692,3694,3697,3700,3703],{"class":936,"line":847},[934,3638,3639],{"class":1308},"const",[934,3641,3142],{"class":1078},[934,3643,3644],{"class":1114}," msg ",[934,3646,3312],{"class":1078},[934,3648,1079],{"class":1078},[934,3650,3651],{"class":943},"hello",[934,3653,1084],{"class":1078},[934,3655,3356],{"class":1078},[934,3657,3658],{"class":1114}," labels ",[934,3660,3312],{"class":1078},[934,3662,3663],{"class":1114}," [",[934,3665,1084],{"class":1078},[934,3667,3668],{"class":943},"one",[934,3670,1084],{"class":1078},[934,3672,3356],{"class":1078},[934,3674,1079],{"class":1078},[934,3676,3677],{"class":943},"two",[934,3679,1084],{"class":1078},[934,3681,3682],{"class":1114},"] ",[934,3684,3685],{"class":1078},"}",[934,3687,3688],{"class":1078}," =",[934,3690,3691],{"class":1323}," defineProps",[934,3693,3299],{"class":1078},[934,3695,3696],{"class":940},"Props",[934,3698,3699],{"class":1078},">",[934,3701,3702],{"class":1114},"()",[934,3704,1087],{"class":1078},[934,3706,3707],{"class":936,"line":850},[934,3708,1105],{"emptyLinePlaceholder":859},[934,3710,3711],{"class":936,"line":1108},[934,3712,3713],{"class":3133},"// DON'T ⛔️\n",[934,3715,3716,3718,3721,3723,3725,3727],{"class":936,"line":1121},[934,3717,3639],{"class":1308},[934,3719,3720],{"class":1114}," props ",[934,3722,3312],{"class":1078},[934,3724,3691],{"class":1323},[934,3726,1327],{"class":1114},[934,3728,1118],{"class":1078},[934,3730,3731,3734,3736,3738,3741,3743,3746,3748,3751,3753,3757],{"class":936,"line":1127},[934,3732,3733],{"class":3302},"  whatever",[934,3735,1305],{"class":1078},[934,3737,3142],{"class":1078},[934,3739,3740],{"class":3302}," type",[934,3742,1305],{"class":1078},[934,3744,3745],{"class":1114}," String",[934,3747,3356],{"class":1078},[934,3749,3750],{"class":3302}," required",[934,3752,1305],{"class":1078},[934,3754,3756],{"class":3755},"sfNiH"," true",[934,3758,3759],{"class":1078}," },\n",[934,3761,3762,3765,3767,3769,3771,3773,3775,3777,3779,3781,3783,3786,3788],{"class":936,"line":1133},[934,3763,3764],{"class":3302},"  optional",[934,3766,1305],{"class":1078},[934,3768,3142],{"class":1078},[934,3770,3740],{"class":3302},[934,3772,1305],{"class":1078},[934,3774,3745],{"class":1114},[934,3776,3356],{"class":1078},[934,3778,3145],{"class":3302},[934,3780,1305],{"class":1078},[934,3782,1079],{"class":1078},[934,3784,3785],{"class":943},"default",[934,3787,1084],{"class":1078},[934,3789,3759],{"class":1078},[934,3791,3792,3794,3797],{"class":936,"line":1138},[934,3793,3685],{"class":1078},[934,3795,3796],{"class":1114},")",[934,3798,1087],{"class":1078},[934,3800,3801],{"class":936,"line":1144},[934,3802,1105],{"emptyLinePlaceholder":859},[934,3804,3805,3807,3809,3811,3814,3816,3819,3821,3823,3825,3827,3829,3831,3834,3836,3838,3840,3842,3844,3846],{"class":936,"line":1150},[934,3806,3639],{"class":1308},[934,3808,3720],{"class":1114},[934,3810,3312],{"class":1078},[934,3812,3813],{"class":1323}," withDefaults",[934,3815,1327],{"class":1114},[934,3817,3818],{"class":1323},"defineProps",[934,3820,3299],{"class":1078},[934,3822,3696],{"class":940},[934,3824,3699],{"class":1078},[934,3826,3702],{"class":1114},[934,3828,3356],{"class":1078},[934,3830,3142],{"class":1078},[934,3832,3833],{"class":3302}," optional",[934,3835,1305],{"class":1078},[934,3837,1079],{"class":1078},[934,3839,3785],{"class":943},[934,3841,1084],{"class":1078},[934,3843,3154],{"class":1078},[934,3845,3796],{"class":1114},[934,3847,1087],{"class":1078},[934,3849,3850],{"class":936,"line":1155},[934,3851,1105],{"emptyLinePlaceholder":859},[934,3853,3854],{"class":936,"line":1161},[934,3855,3856],{"class":3133},"// DO ✅\n",[934,3858,3859,3862,3865],{"class":936,"line":1167},[934,3860,3861],{"class":1308},"interface",[934,3863,3864],{"class":940}," Props",[934,3866,1312],{"class":1078},[934,3868,3869,3871,3873,3876],{"class":936,"line":1172},[934,3870,3733],{"class":3302},[934,3872,1305],{"class":1078},[934,3874,3875],{"class":940}," string",[934,3877,1087],{"class":1078},[934,3879,3880,3882,3885,3887],{"class":936,"line":1178},[934,3881,3764],{"class":3302},[934,3883,3884],{"class":1078},"?:",[934,3886,3875],{"class":940},[934,3888,1087],{"class":1078},[934,3890,3891],{"class":936,"line":1184},[934,3892,1294],{"class":1078},[934,3894,3895],{"class":936,"line":1189},[934,3896,1105],{"emptyLinePlaceholder":859},[934,3898,3899],{"class":936,"line":1195},[934,3900,3901],{"class":3133},"// Or DO ✅ Props destructure (v3.5+)\n",[934,3903,3904,3906,3908],{"class":936,"line":1201},[934,3905,3861],{"class":1308},[934,3907,3864],{"class":940},[934,3909,1312],{"class":1078},[934,3911,3912,3915,3917,3919],{"class":936,"line":1206},[934,3913,3914],{"class":3302},"  msg",[934,3916,3884],{"class":1078},[934,3918,3875],{"class":940},[934,3920,1087],{"class":1078},[934,3922,3923,3926,3928,3930,3933],{"class":936,"line":1212},[934,3924,3925],{"class":3302},"  labels",[934,3927,3884],{"class":1078},[934,3929,3875],{"class":940},[934,3931,3932],{"class":1114},"[]",[934,3934,1087],{"class":1078},[934,3936,3937],{"class":936,"line":1218},[934,3938,1294],{"class":1078},[934,3940,3941,3943,3945],{"class":936,"line":1223},[934,3942,3381],{"class":1078},[934,3944,3303],{"class":3302},[934,3946,3321],{"class":1078},[692,3948,3949],{},[702,3950,3951],{},"Constants, interfaces, types and variants",[692,3953,3954,3955,3957],{},"For reusability purposes, you can also add an ",[894,3956,3110],{}," file at the root of the component folder to export interfaces, constants, and other useful code elements. Keep in mind that developers will copy and paste the component code into their projects, so it should be very easy to customize according to their standards.",[692,3959,3960,3961,3964,3965,3968,3969,3972],{},"Contants have to be ",[894,3962,3963],{},"CAPS_CAMEL_CASE"," in order to identify them clearly inside the code. And ",[894,3966,3967],{},"prefix"," them.\nPlease never use Enums; use ",[894,3970,3971],{},"{} as const"," instead. 😘",[925,3974,3978],{"className":3975,"code":3976,"language":3977,"meta":613,"style":613},"language-typescript shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","// DON'T ⛔️\nconst Direction = { Top: 'top'} as const\nconst ComponentNameDirection = { Top: 'top'} as const\n\n// DON'T ⛔️\nenum COMPONENT_NAME_DIRECTION_WRONG = { Top = 'top'};\n\n// DO ✅\nimport type { ObjectValues } from \"@/lib/utils\";\nexport const COMPONENT_NAME_DIRECTION = { Top: 'top', Bottom: 'bottom'} as const\n\n//Types and Interfaces should use CamelCase to differentiate them from constants and variables.\nexport type ComponentNameDirection = ObjectValues\u003Ctypeof COMPONENT_NAME_DIRECTION>;\n\ninterface {\n   direction: ComponentNameDirection; //Enforce correct value : 'top' or 'bottom'\n}\n","typescript",[894,3979,3980,3984,4016,4043,4047,4051,4079,4083,4087,4111,4155,4159,4164,4186,4190,4196,4211],{"__ignoreMap":613},[934,3981,3982],{"class":936,"line":937},[934,3983,3713],{"class":3133},[934,3985,3986,3988,3991,3993,3995,3998,4000,4003,4006,4009,4011,4013],{"class":936,"line":847},[934,3987,3639],{"class":1308},[934,3989,3990],{"class":1114}," Direction ",[934,3992,3312],{"class":1078},[934,3994,3142],{"class":1078},[934,3996,3997],{"class":3302}," Top",[934,3999,1305],{"class":1078},[934,4001,4002],{"class":1078}," '",[934,4004,4005],{"class":943},"top",[934,4007,4008],{"class":1078},"'",[934,4010,3685],{"class":1078},[934,4012,3148],{"class":1074},[934,4014,4015],{"class":1308}," const\n",[934,4017,4018,4020,4023,4025,4027,4029,4031,4033,4035,4037,4039,4041],{"class":936,"line":850},[934,4019,3639],{"class":1308},[934,4021,4022],{"class":1114}," ComponentNameDirection ",[934,4024,3312],{"class":1078},[934,4026,3142],{"class":1078},[934,4028,3997],{"class":3302},[934,4030,1305],{"class":1078},[934,4032,4002],{"class":1078},[934,4034,4005],{"class":943},[934,4036,4008],{"class":1078},[934,4038,3685],{"class":1078},[934,4040,3148],{"class":1074},[934,4042,4015],{"class":1308},[934,4044,4045],{"class":936,"line":1108},[934,4046,1105],{"emptyLinePlaceholder":859},[934,4048,4049],{"class":936,"line":1121},[934,4050,3713],{"class":3133},[934,4052,4053,4056,4059,4062,4065,4068,4070,4072,4074,4076],{"class":936,"line":1127},[934,4054,4055],{"class":1308},"enum",[934,4057,4058],{"class":940}," COMPONENT_NAME_DIRECTION_WRONG",[934,4060,4061],{"class":1114}," = ",[934,4063,4064],{"class":1078},"{",[934,4066,4067],{"class":1114}," Top ",[934,4069,3312],{"class":1078},[934,4071,4002],{"class":1078},[934,4073,4005],{"class":943},[934,4075,4008],{"class":1078},[934,4077,4078],{"class":1078},"};\n",[934,4080,4081],{"class":936,"line":1133},[934,4082,1105],{"emptyLinePlaceholder":859},[934,4084,4085],{"class":936,"line":1138},[934,4086,3856],{"class":3133},[934,4088,4089,4091,4093,4095,4098,4100,4102,4104,4107,4109],{"class":936,"line":1144},[934,4090,3326],{"class":1074},[934,4092,3740],{"class":1074},[934,4094,3142],{"class":1078},[934,4096,4097],{"class":1114}," ObjectValues",[934,4099,3154],{"class":1078},[934,4101,3157],{"class":1074},[934,4103,1079],{"class":1078},[934,4105,4106],{"class":943},"@/lib/utils",[934,4108,1084],{"class":1078},[934,4110,1087],{"class":1078},[934,4112,4113,4115,4118,4121,4123,4125,4127,4129,4131,4133,4135,4137,4140,4142,4144,4147,4149,4151,4153],{"class":936,"line":1150},[934,4114,3139],{"class":1074},[934,4116,4117],{"class":1308}," const",[934,4119,4120],{"class":1114}," COMPONENT_NAME_DIRECTION ",[934,4122,3312],{"class":1078},[934,4124,3142],{"class":1078},[934,4126,3997],{"class":3302},[934,4128,1305],{"class":1078},[934,4130,4002],{"class":1078},[934,4132,4005],{"class":943},[934,4134,4008],{"class":1078},[934,4136,3356],{"class":1078},[934,4138,4139],{"class":3302}," Bottom",[934,4141,1305],{"class":1078},[934,4143,4002],{"class":1078},[934,4145,4146],{"class":943},"bottom",[934,4148,4008],{"class":1078},[934,4150,3685],{"class":1078},[934,4152,3148],{"class":1074},[934,4154,4015],{"class":1308},[934,4156,4157],{"class":936,"line":1155},[934,4158,1105],{"emptyLinePlaceholder":859},[934,4160,4161],{"class":936,"line":1161},[934,4162,4163],{"class":3133},"//Types and Interfaces should use CamelCase to differentiate them from constants and variables.\n",[934,4165,4166,4168,4170,4173,4175,4177,4180,4183],{"class":936,"line":1167},[934,4167,3139],{"class":1074},[934,4169,3740],{"class":1308},[934,4171,4172],{"class":940}," ComponentNameDirection",[934,4174,3688],{"class":1078},[934,4176,4097],{"class":940},[934,4178,4179],{"class":1078},"\u003Ctypeof",[934,4181,4182],{"class":1114}," COMPONENT_NAME_DIRECTION",[934,4184,4185],{"class":1078},">;\n",[934,4187,4188],{"class":936,"line":1172},[934,4189,1105],{"emptyLinePlaceholder":859},[934,4191,4192,4194],{"class":936,"line":1178},[934,4193,3861],{"class":1308},[934,4195,1312],{"class":1078},[934,4197,4198,4201,4203,4205,4208],{"class":936,"line":1184},[934,4199,4200],{"class":3302},"   direction",[934,4202,1305],{"class":1078},[934,4204,4172],{"class":940},[934,4206,4207],{"class":1078},";",[934,4209,4210],{"class":3133}," //Enforce correct value : 'top' or 'bottom'\n",[934,4212,4213],{"class":936,"line":1189},[934,4214,1294],{"class":1078},[692,4216,4217,4218,4221,4222,4225],{},"You can check the ",[894,4219,4220],{},"PatternBackground"," component files ",[894,4223,4224],{},"components/content/inspira/ui/pattern-background"," for a complete example.",[692,4227,4228],{},[702,4229,4230],{},"Notes:",[751,4232,4233,4240,4243],{},[754,4234,4235,4236,4239],{},"Use ",[894,4237,4238],{},"\u003Cscript lang=\"ts\" setup>"," for TypeScript and the Composition API.",[754,4241,4242],{},"Keep styles scoped to prevent conflicts.",[754,4244,4245,4246,720,4248,880],{},"Ensure compatibility with both ",[702,4247,3087],{},[702,4249,710],{},[728,4251,2939],{"id":4252},"commit-messages",[751,4254,4255,4264,4278],{},[754,4256,4257,4258,4263],{},"Use the ",[696,4259,4262],{"href":4260,"rel":4261},"https://www.conventionalcommits.org/",[700],"Conventional Commits"," format.",[754,4265,4266,4267,4270,4271,4270,4274,4277],{},"Begin with a type (",[894,4268,4269],{},"feat",", ",[894,4272,4273],{},"fix",[894,4275,4276],{},"docs",", etc.) followed by a short description.",[754,4279,4280,4281],{},"Example: ",[894,4282,4283],{},"feat: add TextHoverEffect component",[882,4285,2945],{"id":4286},"documentation-guidelines",[692,4288,4289],{},"Proper documentation is crucial for users to understand and effectively use the components. Follow these guidelines when adding documentation for new components.",[728,4291,4293],{"id":4292},"steps-to-add-a-new-component","Steps to Add a New Component",[2870,4295,4296,4319,4345],{},[754,4297,4298,4301],{},[702,4299,4300],{},"Create the Component",[751,4302,4303,4308,4314],{},[754,4304,4305,4306,880],{},"Place the main component in ",[894,4307,3117],{},[754,4309,4310,4311,4313],{},"Follow the ",[696,4312,2933],{"href":2932}," specified above.",[754,4315,4316,4317,880],{},"If the component requires examples or demos, add demo components to ",[894,4318,3430],{},[754,4320,4321,4324],{},[702,4322,4323],{},"Write Documentation",[751,4325,4326,4332,4335,4338],{},[754,4327,4328,4329,4331],{},"Add a new Markdown file in ",[894,4330,3443],{}," for your component's documentation.",[754,4333,4334],{},"Use the appropriate template based on whether your component is single-file or multi-file (see below).",[754,4336,4337],{},"Add utility classes section if applicable to your component.",[754,4339,4340,4341,4344],{},"Mention the ",[702,4342,4343],{},"Credits"," and source if the component is ported from any other UI library or taken inspiration from any other source.",[754,4346,4347,4350],{},[702,4348,4349],{},"Ensure Compatibility",[751,4351,4352],{},[754,4353,4354,4355,720,4357,4359],{},"Test your component in both ",[702,4356,3087],{},[702,4358,710],{}," environments.",[728,4361,2953],{"id":4362},"single-file-components",[692,4364,4365,4366,4369],{},"For components that are contained within a single ",[894,4367,4368],{},".vue"," file, use the following template:",[2870,4371,4372,4420,4459,4504,4565],{},[754,4373,4374,4377,4379,4380,720,4383,1305,4386],{},[702,4375,4376],{},"Front Matter",[3112,4378],{},"Begin with YAML front matter that includes the ",[894,4381,4382],{},"title",[894,4384,4385],{},"description",[925,4387,4391],{"className":4388,"code":4389,"language":4390,"meta":613,"style":613},"language-yaml shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","---\ntitle: Your Component Title\ndescription: A brief description of what your component does.\n---\n","yaml",[894,4392,4393,4398,4407,4416],{"__ignoreMap":613},[934,4394,4395],{"class":936,"line":937},[934,4396,4397],{"class":940},"---\n",[934,4399,4400,4402,4404],{"class":936,"line":847},[934,4401,4382],{"class":3302},[934,4403,1305],{"class":1078},[934,4405,4406],{"class":943}," Your Component Title\n",[934,4408,4409,4411,4413],{"class":936,"line":850},[934,4410,4385],{"class":3302},[934,4412,1305],{"class":1078},[934,4414,4415],{"class":943}," A brief description of what your component does.\n",[934,4417,4418],{"class":936,"line":1108},[934,4419,4397],{"class":940},[754,4421,4422,4425,4257,4427,4430,4431,4434,4435,4438,4439,4441,4442],{},[702,4423,4424],{},"Preview Section",[3112,4426],{},[894,4428,4429],{},"ComponentLoader"," to display a live preview of the component. The ",[894,4432,4433],{},"id"," should be set to the folder name of your component in ",[894,4436,4437],{},"components/content/inspira/examples/",". In case, there is no folder, then ",[894,4440,4433],{}," is not required.",[925,4443,4447],{"className":4444,"code":4445,"language":4446,"meta":613,"style":613},"language-markdown shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","::ComponentLoader{label=\"Preview\" componentName=\"YourComponentDemo\" type=\"examples\" id=\"your-component-folder-name\"}\n::\n","markdown",[894,4448,4449,4454],{"__ignoreMap":613},[934,4450,4451],{"class":936,"line":937},[934,4452,4453],{},"::ComponentLoader{label=\"Preview\" componentName=\"YourComponentDemo\" type=\"examples\" id=\"your-component-folder-name\"}\n",[934,4455,4456],{"class":936,"line":847},[934,4457,4458],{},"::\n",[754,4460,4461,4464,4466,4467],{},[702,4462,4463],{},"Alerts",[3112,4465],{},"If your component has special requirements or dependencies, add an alert section before the installation instructions:",[925,4468,4470],{"className":4444,"code":4469,"language":4446,"meta":613,"style":613},"::alert{type=\"info\"}\n**Note:** This component requires `package-name` as a dependency.\n::\n\n::alert{type=\"warning\"}\n**Note:** This component uses the `nuxt-only` syntax with the `\u003CClientOnly>`. If you are not using Nuxt, you can simply remove it.\n::\n",[894,4471,4472,4477,4482,4486,4490,4495,4500],{"__ignoreMap":613},[934,4473,4474],{"class":936,"line":937},[934,4475,4476],{},"::alert{type=\"info\"}\n",[934,4478,4479],{"class":936,"line":847},[934,4480,4481],{},"**Note:** This component requires `package-name` as a dependency.\n",[934,4483,4484],{"class":936,"line":850},[934,4485,4458],{},[934,4487,4488],{"class":936,"line":1108},[934,4489,1105],{"emptyLinePlaceholder":859},[934,4491,4492],{"class":936,"line":1121},[934,4493,4494],{},"::alert{type=\"warning\"}\n",[934,4496,4497],{"class":936,"line":1127},[934,4498,4499],{},"**Note:** This component uses the `nuxt-only` syntax with the `\u003CClientOnly>`. If you are not using Nuxt, you can simply remove it.\n",[934,4501,4502],{"class":936,"line":1133},[934,4503,4458],{},[754,4505,4506,4508,4510,4511],{},[702,4507,11],{},[3112,4509],{},"Include both CLI and manual installation instructions. If additional setup is required (e.g., dependencies, Tailwind config updates), use a stepper to list all needed steps.",[925,4512,4514],{"className":4444,"code":4513,"language":4446,"meta":613,"style":613},"## Install using CLI\n\n::InstallationCli{componentId=\"your-component-folder-name\"}\n::\n\n## Install Manually\n\nCopy and paste the following code\n\n::CodeViewer{filename=\"YourComponent.vue\" language=\"vue\" componentName=\"YourComponent\" type=\"ui\" id=\"your-component-folder-name\"}\n::\n",[894,4515,4516,4521,4525,4530,4534,4538,4543,4547,4552,4556,4561],{"__ignoreMap":613},[934,4517,4518],{"class":936,"line":937},[934,4519,4520],{},"## Install using CLI\n",[934,4522,4523],{"class":936,"line":847},[934,4524,1105],{"emptyLinePlaceholder":859},[934,4526,4527],{"class":936,"line":850},[934,4528,4529],{},"::InstallationCli{componentId=\"your-component-folder-name\"}\n",[934,4531,4532],{"class":936,"line":1108},[934,4533,4458],{},[934,4535,4536],{"class":936,"line":1121},[934,4537,1105],{"emptyLinePlaceholder":859},[934,4539,4540],{"class":936,"line":1127},[934,4541,4542],{},"## Install Manually\n",[934,4544,4545],{"class":936,"line":1133},[934,4546,1105],{"emptyLinePlaceholder":859},[934,4548,4549],{"class":936,"line":1138},[934,4550,4551],{},"Copy and paste the following code\n",[934,4553,4554],{"class":936,"line":1144},[934,4555,1105],{"emptyLinePlaceholder":859},[934,4557,4558],{"class":936,"line":1150},[934,4559,4560],{},"::CodeViewer{filename=\"YourComponent.vue\" language=\"vue\" componentName=\"YourComponent\" type=\"ui\" id=\"your-component-folder-name\"}\n",[934,4562,4563],{"class":936,"line":1155},[934,4564,4458],{},[754,4566,4567,4570,4572,4573],{},[702,4568,4569],{},"API Documentation",[3112,4571],{},"Provide a table listing all props:",[925,4574,4576],{"className":4444,"code":4575,"language":4446,"meta":613,"style":613},"## API\n\n| Prop Name | Type      | Default | Description                    |\n| --------- | --------- | ------- | ------------------------------ |\n| `prop1`   | `string`  | `''`    | Description of prop1.          |\n| `prop2`   | `number`  | `0`     | Description of prop2.          |\n| `prop2`   | `?number` | `0`     | Description of prop2 optional. |\n",[894,4577,4578,4583,4587,4592,4597,4602,4607],{"__ignoreMap":613},[934,4579,4580],{"class":936,"line":937},[934,4581,4582],{},"## API\n",[934,4584,4585],{"class":936,"line":847},[934,4586,1105],{"emptyLinePlaceholder":859},[934,4588,4589],{"class":936,"line":850},[934,4590,4591],{},"| Prop Name | Type      | Default | Description                    |\n",[934,4593,4594],{"class":936,"line":1108},[934,4595,4596],{},"| --------- | --------- | ------- | ------------------------------ |\n",[934,4598,4599],{"class":936,"line":1121},[934,4600,4601],{},"| `prop1`   | `string`  | `''`    | Description of prop1.          |\n",[934,4603,4604],{"class":936,"line":1127},[934,4605,4606],{},"| `prop2`   | `number`  | `0`     | Description of prop2.          |\n",[934,4608,4609],{"class":936,"line":1133},[934,4610,4611],{},"| `prop2`   | `?number` | `0`     | Description of prop2 optional. |\n",[692,4613,4614],{},[702,4615,4616],{},"Example:",[925,4618,4620],{"className":4444,"code":4619,"language":4446,"meta":613,"style":613},"---\ntitle: Text Hover Effect\ndescription: A text hover effect that animates and outlines gradient on hover, as seen on x.ai\n---\n\n::ComponentLoader{label=\"Preview\" componentName=\"TextHoverEffectDemo\" type=\"examples\"}\n::\n\n::alert{type=\"warning\"}\nThis component uses the `nuxt-only` syntax with the `\u003CClientOnly>`. If you are not using Nuxt, you can simply remove it.\n::\n\n## Install using CLI\n\n::InstallationCli{componentId=\"text-hover-effect\"}\n::\n\n## Install Manually\n\nCopy and paste the following code\n\n::CodeViewer{filename=\"TextHoverEffect.vue\" language=\"vue\" componentName=\"TextHoverEffect\" type=\"ui\" id=\"text-hover-effect\"}\n::\n\n## API\n\n| Prop Name     | Type     | Default  | Description                                               |\n| ------------- | -------- | -------- | --------------------------------------------------------- |\n| `text`        | `string` | Required | The text to be displayed with the hover effect.           |\n| `duration`    | `number` | `200`    | The duration of the mask transition animation in seconds. |\n| `strokeWidth` | `number` | `0.75`   | The width of the text stroke.                             |\n| `opacity`     | `number` | `null`   | The opacity of the text.                                  |\n",[894,4621,4622,4626,4631,4636,4640,4644,4649,4653,4657,4661,4666,4670,4674,4678,4682,4687,4691,4695,4699,4703,4707,4711,4716,4720,4724,4728,4732,4737,4742,4747,4752,4757],{"__ignoreMap":613},[934,4623,4624],{"class":936,"line":937},[934,4625,4397],{},[934,4627,4628],{"class":936,"line":847},[934,4629,4630],{},"title: Text Hover Effect\n",[934,4632,4633],{"class":936,"line":850},[934,4634,4635],{},"description: A text hover effect that animates and outlines gradient on hover, as seen on x.ai\n",[934,4637,4638],{"class":936,"line":1108},[934,4639,4397],{},[934,4641,4642],{"class":936,"line":1121},[934,4643,1105],{"emptyLinePlaceholder":859},[934,4645,4646],{"class":936,"line":1127},[934,4647,4648],{},"::ComponentLoader{label=\"Preview\" componentName=\"TextHoverEffectDemo\" type=\"examples\"}\n",[934,4650,4651],{"class":936,"line":1133},[934,4652,4458],{},[934,4654,4655],{"class":936,"line":1138},[934,4656,1105],{"emptyLinePlaceholder":859},[934,4658,4659],{"class":936,"line":1144},[934,4660,4494],{},[934,4662,4663],{"class":936,"line":1150},[934,4664,4665],{},"This component uses the `nuxt-only` syntax with the `\u003CClientOnly>`. If you are not using Nuxt, you can simply remove it.\n",[934,4667,4668],{"class":936,"line":1155},[934,4669,4458],{},[934,4671,4672],{"class":936,"line":1161},[934,4673,1105],{"emptyLinePlaceholder":859},[934,4675,4676],{"class":936,"line":1167},[934,4677,4520],{},[934,4679,4680],{"class":936,"line":1172},[934,4681,1105],{"emptyLinePlaceholder":859},[934,4683,4684],{"class":936,"line":1178},[934,4685,4686],{},"::InstallationCli{componentId=\"text-hover-effect\"}\n",[934,4688,4689],{"class":936,"line":1184},[934,4690,4458],{},[934,4692,4693],{"class":936,"line":1189},[934,4694,1105],{"emptyLinePlaceholder":859},[934,4696,4697],{"class":936,"line":1195},[934,4698,4542],{},[934,4700,4701],{"class":936,"line":1201},[934,4702,1105],{"emptyLinePlaceholder":859},[934,4704,4705],{"class":936,"line":1206},[934,4706,4551],{},[934,4708,4709],{"class":936,"line":1212},[934,4710,1105],{"emptyLinePlaceholder":859},[934,4712,4713],{"class":936,"line":1218},[934,4714,4715],{},"::CodeViewer{filename=\"TextHoverEffect.vue\" language=\"vue\" componentName=\"TextHoverEffect\" type=\"ui\" id=\"text-hover-effect\"}\n",[934,4717,4718],{"class":936,"line":1223},[934,4719,4458],{},[934,4721,4722],{"class":936,"line":1229},[934,4723,1105],{"emptyLinePlaceholder":859},[934,4725,4726],{"class":936,"line":1235},[934,4727,4582],{},[934,4729,4730],{"class":936,"line":1240},[934,4731,1105],{"emptyLinePlaceholder":859},[934,4733,4734],{"class":936,"line":1246},[934,4735,4736],{},"| Prop Name     | Type     | Default  | Description                                               |\n",[934,4738,4739],{"class":936,"line":1252},[934,4740,4741],{},"| ------------- | -------- | -------- | --------------------------------------------------------- |\n",[934,4743,4744],{"class":936,"line":1257},[934,4745,4746],{},"| `text`        | `string` | Required | The text to be displayed with the hover effect.           |\n",[934,4748,4749],{"class":936,"line":1263},[934,4750,4751],{},"| `duration`    | `number` | `200`    | The duration of the mask transition animation in seconds. |\n",[934,4753,4754],{"class":936,"line":1269},[934,4755,4756],{},"| `strokeWidth` | `number` | `0.75`   | The width of the text stroke.                             |\n",[934,4758,4759],{"class":936,"line":1274},[934,4760,4761],{},"| `opacity`     | `number` | `null`   | The opacity of the text.                                  |\n",[692,4763,4764,4765,4767,4768,4270,4770,720,4773,4776,4777,4780],{},"In this example, the ",[894,4766,4433],{}," used in both ",[894,4769,4429],{},[894,4771,4772],{},"CodeViewer",[894,4774,4775],{},"InstallationCli"," is ",[894,4778,4779],{},"text-hover-effect",", which matches the folder name where the component and its demo are stored.",[728,4782,2959],{"id":4783},"multi-file-components",[692,4785,4786],{},"For components that consist of multiple files, such as a main component and several sub-components or variants, use the following template:",[2870,4788,4789,4827,4856,4894,4969],{},[754,4790,4791,4793,4795,4796],{},[702,4792,4376],{},[3112,4794],{},"Begin with YAML front matter:",[925,4797,4799],{"className":4388,"code":4798,"language":4390,"meta":613,"style":613},"---\ntitle: Your Components Group Title\ndescription: A brief description of what this group of components does.\n---\n",[894,4800,4801,4805,4814,4823],{"__ignoreMap":613},[934,4802,4803],{"class":936,"line":937},[934,4804,4397],{"class":940},[934,4806,4807,4809,4811],{"class":936,"line":847},[934,4808,4382],{"class":3302},[934,4810,1305],{"class":1078},[934,4812,4813],{"class":943}," Your Components Group Title\n",[934,4815,4816,4818,4820],{"class":936,"line":850},[934,4817,4385],{"class":3302},[934,4819,1305],{"class":1078},[934,4821,4822],{"class":943}," A brief description of what this group of components does.\n",[934,4824,4825],{"class":936,"line":1108},[934,4826,4397],{"class":940},[754,4828,4829,4832,4834,4835,4837,4838,4434,4840,880,4842],{},[702,4830,4831],{},"Preview Sections",[3112,4833],{},"Include multiple ",[894,4836,4429],{}," sections for each example or variant. The ",[894,4839,4433],{},[894,4841,4437],{},[925,4843,4845],{"className":4444,"code":4844,"language":4446,"meta":613,"style":613},"::ComponentLoader{label=\"Preview\" componentName=\"ComponentVariantDemo\" type=\"examples\" id=\"your-component-folder-name\"}\n::\n",[894,4846,4847,4852],{"__ignoreMap":613},[934,4848,4849],{"class":936,"line":937},[934,4850,4851],{},"::ComponentLoader{label=\"Preview\" componentName=\"ComponentVariantDemo\" type=\"examples\" id=\"your-component-folder-name\"}\n",[934,4853,4854],{"class":936,"line":847},[934,4855,4458],{},[754,4857,4858,4860,4466,4862],{},[702,4859,4463],{},[3112,4861],{},[925,4863,4864],{"className":4444,"code":4469,"language":4446,"meta":613,"style":613},[894,4865,4866,4870,4874,4878,4882,4886,4890],{"__ignoreMap":613},[934,4867,4868],{"class":936,"line":937},[934,4869,4476],{},[934,4871,4872],{"class":936,"line":847},[934,4873,4481],{},[934,4875,4876],{"class":936,"line":850},[934,4877,4458],{},[934,4879,4880],{"class":936,"line":1108},[934,4881,1105],{"emptyLinePlaceholder":859},[934,4883,4884],{"class":936,"line":1121},[934,4885,4494],{},[934,4887,4888],{"class":936,"line":1127},[934,4889,4499],{},[934,4891,4892],{"class":936,"line":1133},[934,4893,4458],{},[754,4895,4896,4898,4510,4900],{},[702,4897,11],{},[3112,4899],{},[925,4901,4903],{"className":4444,"code":4902,"language":4446,"meta":613,"style":613},"## Install using CLI\n\n::InstallationCli{componentId=\"your-component-folder-name\"}\n::\n\n## Install Manually\n\nCopy and paste the following code in the same folder\n\n::code-group\n\n:CodeViewerTab{label=\"YourComponent.vue\" language=\"vue\" componentName=\"YourComponent\" type=\"ui\" id=\"your-component-folder-name\"}\n:CodeViewerTab{filename=\"YourComponent2.vue\" language=\"vue\" componentName=\"YourComponent2\" type=\"ui\" id=\"your-component-folder-name\"}\n\n::\n",[894,4904,4905,4909,4913,4917,4921,4925,4929,4933,4938,4942,4947,4951,4956,4961,4965],{"__ignoreMap":613},[934,4906,4907],{"class":936,"line":937},[934,4908,4520],{},[934,4910,4911],{"class":936,"line":847},[934,4912,1105],{"emptyLinePlaceholder":859},[934,4914,4915],{"class":936,"line":850},[934,4916,4529],{},[934,4918,4919],{"class":936,"line":1108},[934,4920,4458],{},[934,4922,4923],{"class":936,"line":1121},[934,4924,1105],{"emptyLinePlaceholder":859},[934,4926,4927],{"class":936,"line":1127},[934,4928,4542],{},[934,4930,4931],{"class":936,"line":1133},[934,4932,1105],{"emptyLinePlaceholder":859},[934,4934,4935],{"class":936,"line":1138},[934,4936,4937],{},"Copy and paste the following code in the same folder\n",[934,4939,4940],{"class":936,"line":1144},[934,4941,1105],{"emptyLinePlaceholder":859},[934,4943,4944],{"class":936,"line":1150},[934,4945,4946],{},"::code-group\n",[934,4948,4949],{"class":936,"line":1155},[934,4950,1105],{"emptyLinePlaceholder":859},[934,4952,4953],{"class":936,"line":1161},[934,4954,4955],{},":CodeViewerTab{label=\"YourComponent.vue\" language=\"vue\" componentName=\"YourComponent\" type=\"ui\" id=\"your-component-folder-name\"}\n",[934,4957,4958],{"class":936,"line":1167},[934,4959,4960],{},":CodeViewerTab{filename=\"YourComponent2.vue\" language=\"vue\" componentName=\"YourComponent2\" type=\"ui\" id=\"your-component-folder-name\"}\n",[934,4962,4963],{"class":936,"line":1172},[934,4964,1105],{"emptyLinePlaceholder":859},[934,4966,4967],{"class":936,"line":1178},[934,4968,4458],{},[754,4970,4971,4973,4975,4976],{},[702,4972,4569],{},[3112,4974],{},"Provide comprehensive API documentation covering all components:",[925,4977,4979],{"className":4444,"code":4978,"language":4446,"meta":613,"style":613},"## API\n\n| Prop Name | Type     | Default | Description                             |\n| --------- | -------- | ------- | --------------------------------------- |\n| `prop1`   | `string` | `''`    | Description applicable to all variants. |\n",[894,4980,4981,4985,4989,4994,4999],{"__ignoreMap":613},[934,4982,4983],{"class":936,"line":937},[934,4984,4582],{},[934,4986,4987],{"class":936,"line":847},[934,4988,1105],{"emptyLinePlaceholder":859},[934,4990,4991],{"class":936,"line":850},[934,4992,4993],{},"| Prop Name | Type     | Default | Description                             |\n",[934,4995,4996],{"class":936,"line":1108},[934,4997,4998],{},"| --------- | -------- | ------- | --------------------------------------- |\n",[934,5000,5001],{"class":936,"line":1121},[934,5002,5003],{},"| `prop1`   | `string` | `''`    | Description applicable to all variants. |\n",[692,5005,5006],{},[702,5007,4616],{},[925,5009,5011],{"className":4444,"code":5010,"language":4446,"meta":613,"style":613},"---\ntitle: Pattern Background\ndescription: Simple animated pattern background to make your sections stand out.\n---\n\nGrid background with dot\n::ComponentLoader{label=\"Preview\" componentName=\"PatternBackgroundDotDemo\" type=\"examples\" id=\"pattern-background\"}\n::\n\n## Install using CLI\n\n::InstallationCli{componentId=\"pattern-background\"}\n::\n\n## Install Manually\n\nCopy and paste the following code in the same folder\n\n::code-group\n\n:CodeViewerTab{label=\"PatternBackground.vue\" language=\"vue\" componentName=\"PatternBackground\" type=\"ui\" id=\"pattern-background\"}\n:CodeViewerTab{filename=\"index.ts\" language=\"typescript\" componentName=\"index\" type=\"ui\" id=\"pattern-background\" extension=\"ts\"}\n\n::\n\n## Examples\n\nGrid background with big dot and ellipse on top\n::ComponentLoader{label=\"Preview\" componentName=\"PatternBackgroundBigDotDemo\" type=\"examples\" id=\"pattern-background\"}\n::\n\nGrid background without animation\n::ComponentLoader{label=\"Preview\" componentName=\"PatternBackgroundGridDemo\" type=\"examples\" id=\"pattern-background\"}\n::\n\nSmall grid background with animation\n::ComponentLoader{label=\"Preview\" componentName=\"PatternBackgroundGridSmallDemo\" type=\"examples\" id=\"pattern-background\"}\n::\n\n## API\n\n| Prop Name   | Type                                                                                                   | Default   | Description                                                                                                                                                    |\n| ----------- | ------------------------------------------------------------------------------------------------------ | --------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n| `animate`   | `boolean`                                                                                              | `false`   | Set `true` if you want to animate the background.                                                                                                              |\n| `direction` | `top` \\| `bottom` \\| `left` \\| `right` \\| `top-left` \\| `top-right` \\| `bottom-left` \\| `bottom-right` | `top`     | Direction of the animation movement. You can use the const `PATTERN_BACKGROUND_DIRECTION.`                                                                     |\n| `direction` | `grid` \\| `dot`                                                                                        | `grid`    | Type of pattern. You can use the const `PATTERN_BACKGROUND_VARIANT.`                                                                                           |\n| `size`      | `xs` \\| `sm` \\| `md` \\| `lg`                                                                           | `md`      | Size of the background pattern.                                                                                                                                |\n| `mask`      | `ellipse` \\| `ellipse-top`                                                                             | `ellipse` | Add a mask over the background pattern. You can use the const `PATTERN_BACKGROUND_MASK.`                                                                       |\n| `speed`     | `number`                                                                                               | `10000`   | Duration of the animation in `ms`, the bigger it is, the slower the animation. (`20000` slower than `5000`). You can use the const `PATTERN_BACKGROUND_SPEED.` |\n\n### Custom variants, values and constants\n\nYou can customize your needs directly within the `index.ts` file. See code below.\n\n## Credits\n\n- Inspired by [Magic UI's Dot Pattern](https://magicui.design/docs/components/dot-pattern) component.\n- Inspired by [Magic UI's Grid Pattern](https://magicui.design/docs/components/grid-pattern) component.\n- Inspired by [Magic UI's Animated Grid Pattern](https://magicui.design/docs/components/animated-grid-pattern) component.\n- Credits to [Nathan De Pachtere](https://nathandepachtere.com/) for porting this component.\n",[894,5012,5013,5017,5022,5027,5031,5035,5040,5045,5049,5053,5057,5061,5066,5070,5074,5078,5082,5086,5090,5094,5098,5103,5108,5112,5116,5120,5125,5129,5134,5139,5143,5147,5152,5157,5161,5165,5170,5175,5179,5183,5187,5191,5196,5201,5206,5211,5216,5221,5226,5231,5235,5240,5244,5249,5253,5258,5262,5267,5272,5277],{"__ignoreMap":613},[934,5014,5015],{"class":936,"line":937},[934,5016,4397],{},[934,5018,5019],{"class":936,"line":847},[934,5020,5021],{},"title: Pattern Background\n",[934,5023,5024],{"class":936,"line":850},[934,5025,5026],{},"description: Simple animated pattern background to make your sections stand out.\n",[934,5028,5029],{"class":936,"line":1108},[934,5030,4397],{},[934,5032,5033],{"class":936,"line":1121},[934,5034,1105],{"emptyLinePlaceholder":859},[934,5036,5037],{"class":936,"line":1127},[934,5038,5039],{},"Grid background with dot\n",[934,5041,5042],{"class":936,"line":1133},[934,5043,5044],{},"::ComponentLoader{label=\"Preview\" componentName=\"PatternBackgroundDotDemo\" type=\"examples\" id=\"pattern-background\"}\n",[934,5046,5047],{"class":936,"line":1138},[934,5048,4458],{},[934,5050,5051],{"class":936,"line":1144},[934,5052,1105],{"emptyLinePlaceholder":859},[934,5054,5055],{"class":936,"line":1150},[934,5056,4520],{},[934,5058,5059],{"class":936,"line":1155},[934,5060,1105],{"emptyLinePlaceholder":859},[934,5062,5063],{"class":936,"line":1161},[934,5064,5065],{},"::InstallationCli{componentId=\"pattern-background\"}\n",[934,5067,5068],{"class":936,"line":1167},[934,5069,4458],{},[934,5071,5072],{"class":936,"line":1172},[934,5073,1105],{"emptyLinePlaceholder":859},[934,5075,5076],{"class":936,"line":1178},[934,5077,4542],{},[934,5079,5080],{"class":936,"line":1184},[934,5081,1105],{"emptyLinePlaceholder":859},[934,5083,5084],{"class":936,"line":1189},[934,5085,4937],{},[934,5087,5088],{"class":936,"line":1195},[934,5089,1105],{"emptyLinePlaceholder":859},[934,5091,5092],{"class":936,"line":1201},[934,5093,4946],{},[934,5095,5096],{"class":936,"line":1206},[934,5097,1105],{"emptyLinePlaceholder":859},[934,5099,5100],{"class":936,"line":1212},[934,5101,5102],{},":CodeViewerTab{label=\"PatternBackground.vue\" language=\"vue\" componentName=\"PatternBackground\" type=\"ui\" id=\"pattern-background\"}\n",[934,5104,5105],{"class":936,"line":1218},[934,5106,5107],{},":CodeViewerTab{filename=\"index.ts\" language=\"typescript\" componentName=\"index\" type=\"ui\" id=\"pattern-background\" extension=\"ts\"}\n",[934,5109,5110],{"class":936,"line":1223},[934,5111,1105],{"emptyLinePlaceholder":859},[934,5113,5114],{"class":936,"line":1229},[934,5115,4458],{},[934,5117,5118],{"class":936,"line":1235},[934,5119,1105],{"emptyLinePlaceholder":859},[934,5121,5122],{"class":936,"line":1240},[934,5123,5124],{},"## Examples\n",[934,5126,5127],{"class":936,"line":1246},[934,5128,1105],{"emptyLinePlaceholder":859},[934,5130,5131],{"class":936,"line":1252},[934,5132,5133],{},"Grid background with big dot and ellipse on top\n",[934,5135,5136],{"class":936,"line":1257},[934,5137,5138],{},"::ComponentLoader{label=\"Preview\" componentName=\"PatternBackgroundBigDotDemo\" type=\"examples\" id=\"pattern-background\"}\n",[934,5140,5141],{"class":936,"line":1263},[934,5142,4458],{},[934,5144,5145],{"class":936,"line":1269},[934,5146,1105],{"emptyLinePlaceholder":859},[934,5148,5149],{"class":936,"line":1274},[934,5150,5151],{},"Grid background without animation\n",[934,5153,5154],{"class":936,"line":1280},[934,5155,5156],{},"::ComponentLoader{label=\"Preview\" componentName=\"PatternBackgroundGridDemo\" type=\"examples\" id=\"pattern-background\"}\n",[934,5158,5159],{"class":936,"line":1285},[934,5160,4458],{},[934,5162,5163],{"class":936,"line":1291},[934,5164,1105],{"emptyLinePlaceholder":859},[934,5166,5167],{"class":936,"line":1297},[934,5168,5169],{},"Small grid background with animation\n",[934,5171,5172],{"class":936,"line":1302},[934,5173,5174],{},"::ComponentLoader{label=\"Preview\" componentName=\"PatternBackgroundGridSmallDemo\" type=\"examples\" id=\"pattern-background\"}\n",[934,5176,5177],{"class":936,"line":1315},[934,5178,4458],{},[934,5180,5181],{"class":936,"line":1336},[934,5182,1105],{"emptyLinePlaceholder":859},[934,5184,5185],{"class":936,"line":1353},[934,5186,4582],{},[934,5188,5189],{"class":936,"line":1358},[934,5190,1105],{"emptyLinePlaceholder":859},[934,5192,5193],{"class":936,"line":1375},[934,5194,5195],{},"| Prop Name   | Type                                                                                                   | Default   | Description                                                                                                                                                    |\n",[934,5197,5198],{"class":936,"line":1391},[934,5199,5200],{},"| ----------- | ------------------------------------------------------------------------------------------------------ | --------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n",[934,5202,5203],{"class":936,"line":1396},[934,5204,5205],{},"| `animate`   | `boolean`                                                                                              | `false`   | Set `true` if you want to animate the background.                                                                                                              |\n",[934,5207,5208],{"class":936,"line":1412},[934,5209,5210],{},"| `direction` | `top` \\| `bottom` \\| `left` \\| `right` \\| `top-left` \\| `top-right` \\| `bottom-left` \\| `bottom-right` | `top`     | Direction of the animation movement. You can use the const `PATTERN_BACKGROUND_DIRECTION.`                                                                     |\n",[934,5212,5213],{"class":936,"line":1428},[934,5214,5215],{},"| `direction` | `grid` \\| `dot`                                                                                        | `grid`    | Type of pattern. You can use the const `PATTERN_BACKGROUND_VARIANT.`                                                                                           |\n",[934,5217,5218],{"class":936,"line":1433},[934,5219,5220],{},"| `size`      | `xs` \\| `sm` \\| `md` \\| `lg`                                                                           | `md`      | Size of the background pattern.                                                                                                                                |\n",[934,5222,5223],{"class":936,"line":1450},[934,5224,5225],{},"| `mask`      | `ellipse` \\| `ellipse-top`                                                                             | `ellipse` | Add a mask over the background pattern. You can use the const `PATTERN_BACKGROUND_MASK.`                                                                       |\n",[934,5227,5228],{"class":936,"line":1467},[934,5229,5230],{},"| `speed`     | `number`                                                                                               | `10000`   | Duration of the animation in `ms`, the bigger it is, the slower the animation. (`20000` slower than `5000`). You can use the const `PATTERN_BACKGROUND_SPEED.` |\n",[934,5232,5233],{"class":936,"line":1472},[934,5234,1105],{"emptyLinePlaceholder":859},[934,5236,5237],{"class":936,"line":1489},[934,5238,5239],{},"### Custom variants, values and constants\n",[934,5241,5242],{"class":936,"line":1505},[934,5243,1105],{"emptyLinePlaceholder":859},[934,5245,5246],{"class":936,"line":1510},[934,5247,5248],{},"You can customize your needs directly within the `index.ts` file. See code below.\n",[934,5250,5251],{"class":936,"line":1527},[934,5252,1105],{"emptyLinePlaceholder":859},[934,5254,5255],{"class":936,"line":1543},[934,5256,5257],{},"## Credits\n",[934,5259,5260],{"class":936,"line":1548},[934,5261,1105],{"emptyLinePlaceholder":859},[934,5263,5264],{"class":936,"line":1565},[934,5265,5266],{},"- Inspired by [Magic UI's Dot Pattern](https://magicui.design/docs/components/dot-pattern) component.\n",[934,5268,5269],{"class":936,"line":1582},[934,5270,5271],{},"- Inspired by [Magic UI's Grid Pattern](https://magicui.design/docs/components/grid-pattern) component.\n",[934,5273,5274],{"class":936,"line":1587},[934,5275,5276],{},"- Inspired by [Magic UI's Animated Grid Pattern](https://magicui.design/docs/components/animated-grid-pattern) component.\n",[934,5278,5279],{"class":936,"line":1604},[934,5280,5281],{},"- Credits to [Nathan De Pachtere](https://nathandepachtere.com/) for porting this component.\n",[882,5283,2965],{"id":5284},"testing",[751,5286,5287,5293,5303,5309],{},[754,5288,5289,5292],{},[702,5290,5291],{},"Unit Tests",": Write unit tests for your component if applicable.",[754,5294,5295,5298,5299,720,5301,4359],{},[702,5296,5297],{},"Cross-Environment Testing",": Ensure that your component works correctly in both ",[702,5300,3087],{},[702,5302,710],{},[754,5304,5305,5308],{},[702,5306,5307],{},"Visual Testing",": Check the component visually to ensure it renders correctly.",[754,5310,5311,5314,5315,5318,5319],{},[702,5312,5313],{},"CLI Installation Testing",": After updating the registry with ",[894,5316,5317],{},"pnpm build:registry",", test the component installation in a separate project by referencing the local registry URL. For example:\n",[925,5320,5324],{"className":5321,"code":5322,"language":5323,"meta":613,"style":613},"language-sh shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","npx shadcn-vue@latest add \"https://localhost:3000/r/\u003Ccomponent-name>\"\n","sh",[894,5325,5326],{"__ignoreMap":613},[934,5327,5328],{"class":936,"line":937},[934,5329,5322],{},[882,5331,5333],{"id":5332},"additional-notes","Additional Notes",[751,5335,5336,5344,5371,5386],{},[754,5337,5338,3471,5341,5343],{},[702,5339,5340],{},"Component Names",[894,5342,3483],{}," for component filenames and names.",[754,5345,5346,5349,5350,4270,5352,5355,5356,5358,5359,5361,5362,5365,5366,720,5368,5370],{},[702,5347,5348],{},"IDs",": In ",[894,5351,4772],{},[894,5353,5354],{},"CodeViewerTab",", and ",[894,5357,4429],{},", the ",[894,5360,4433],{}," parameter should be set to the ",[702,5363,5364],{},"folder name"," where the component is stored in ",[894,5367,3117],{},[894,5369,3430],{},". This helps in correctly linking the code and examples in the documentation.",[754,5372,5373,5376,5377,5380,5381,5383,5384,880],{},[702,5374,5375],{},"Demo Components",": For each component, create a corresponding ",[894,5378,5379],{},"Demo"," component used in the ",[894,5382,4429],{}," for previews, and place it in ",[894,5385,3430],{},[754,5387,5388,5391],{},[702,5389,5390],{},"Localization",": If your component supports multiple languages, include details in the documentation.",[882,5393,2971],{"id":5394},"license",[692,5396,5397,5398,880],{},"By contributing, you agree that your contributions will be licensed under the ",[696,5399,5402],{"href":5400,"rel":5401,":target":3035},"https://github.com/unovue/inspira-ui/blob/main/LICENSE",[700],"MIT License",[2836,5404,5405],{},"html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}",{"title":613,"searchDepth":847,"depth":847,"links":5407},[5408,5409,5410,5411,5416,5417,5422,5427,5428,5429],{"id":2867,"depth":847,"text":2868},{"id":2977,"depth":847,"text":5},{"id":3014,"depth":847,"text":19},{"id":3024,"depth":847,"text":2887,"children":5412},[5413,5414,5415],{"id":3027,"depth":850,"text":2895},{"id":3054,"depth":850,"text":2901},{"id":3073,"depth":850,"text":2907},{"id":3397,"depth":847,"text":2913},{"id":3450,"depth":847,"text":2919,"children":5418},[5419,5420,5421],{"id":3453,"depth":850,"text":2927},{"id":3487,"depth":850,"text":2933},{"id":4252,"depth":850,"text":2939},{"id":4286,"depth":847,"text":2945,"children":5423},[5424,5425,5426],{"id":4292,"depth":850,"text":4293},{"id":4362,"depth":850,"text":2953},{"id":4783,"depth":850,"text":2959},{"id":5284,"depth":847,"text":2965},{"id":5332,"depth":847,"text":5333},{"id":5394,"depth":847,"text":2971},"Follow the following guidelines to ensure the smooth collaboration",{"icon":5432},"lucide:scroll-text",{"title":15,"description":5430},"7vU_0QxrGzxahp89xuS21tnloczvLlfRqWB18LLyW80",{"id":5436,"title":19,"badge":687,"body":5437,"category":687,"description":5718,"extension":856,"links":687,"meta":5719,"navigation":859,"path":20,"seo":5721,"stem":21,"tags":687,"__hash__":5722},"docs_en/en/1.getting-started/4.code-of-conduct.md",{"type":689,"value":5438,"toc":5705},[5439,5443,5449,5453,5456,5491,5495,5498,5530,5534,5537,5569,5573,5579,5586,5589,5615,5618,5622,5625,5636,5640,5643,5666,5669,5673,5679,5683,5686,5688,5691,5695,5700],[882,5440,5442],{"id":5441},"introduction","Introduction",[692,5444,5445,5446,5448],{},"We are committed to providing a friendly, safe, and welcoming environment for everyone involved in the ",[702,5447,704],{}," project. This Code of Conduct outlines our expectations for participant behavior as well as the consequences for unacceptable conduct.",[882,5450,5452],{"id":5451},"our-pledge","Our Pledge",[692,5454,5455],{},"In the interest of fostering an open and inclusive community, we pledge to make participation in our project and community a harassment-free experience for everyone, regardless of:",[751,5457,5458,5461,5464,5467,5470,5473,5476,5479,5482,5485,5488],{},[754,5459,5460],{},"Age",[754,5462,5463],{},"Body size",[754,5465,5466],{},"Disability",[754,5468,5469],{},"Ethnicity",[754,5471,5472],{},"Gender identity and expression",[754,5474,5475],{},"Level of experience",[754,5477,5478],{},"Nationality",[754,5480,5481],{},"Personal appearance",[754,5483,5484],{},"Race",[754,5486,5487],{},"Religion",[754,5489,5490],{},"Sexual identity and orientation",[882,5492,5494],{"id":5493},"expected-behavior","Expected Behavior",[692,5496,5497],{},"All participants in our community are expected to:",[751,5499,5500,5506,5512,5518,5524],{},[754,5501,5502,5505],{},[702,5503,5504],{},"Be Respectful",": Show empathy and kindness towards others.",[754,5507,5508,5511],{},[702,5509,5510],{},"Be Considerate",": Remember that your actions and words affect others.",[754,5513,5514,5517],{},[702,5515,5516],{},"Be Collaborative",": Work together to achieve common goals.",[754,5519,5520,5523],{},[702,5521,5522],{},"Communicate Effectively",": Use clear and constructive language.",[754,5525,5526,5529],{},[702,5527,5528],{},"Demonstrate Professionalism",": Act professionally and take responsibility for your actions.",[882,5531,5533],{"id":5532},"unacceptable-behavior","Unacceptable Behavior",[692,5535,5536],{},"The following behaviors are considered unacceptable within our community:",[751,5538,5539,5545,5551,5557,5563],{},[754,5540,5541,5544],{},[702,5542,5543],{},"Harassment and Discrimination",": Including derogatory comments, slurs, or unwanted sexual attention.",[754,5546,5547,5550],{},[702,5548,5549],{},"Abuse and Threats",": Any form of verbal or written abuse, intimidation, or threats.",[754,5552,5553,5556],{},[702,5554,5555],{},"Trolling and Insults",": Provocative or insulting remarks intended to disrupt conversations.",[754,5558,5559,5562],{},[702,5560,5561],{},"Disrespectful Communication",": Including excessive profanity, shouting (using all caps), or interrupting others.",[754,5564,5565,5568],{},[702,5566,5567],{},"Personal Attacks",": Targeting an individual with the intent to harass or belittle.",[882,5570,5572],{"id":5571},"reporting-guidelines","Reporting Guidelines",[692,5574,5575,5576,1305],{},"If you experience or witness unacceptable behavior, or have any other concerns, please report it as soon as possible by contacting the project maintainers on our ",[702,5577,5578],{},"Discord channel",[692,5580,5581],{},[696,5582,5585],{"href":5583,"rel":5584},"https://discord.gg/Xbh5DwJRc9",[700],"Inspira UI Discord Channel",[692,5587,5588],{},"When reporting an incident, please include:",[751,5590,5591,5597,5603,5609],{},[754,5592,5593,5596],{},[702,5594,5595],{},"Your Contact Information",": Your Discord username or any preferred method of contact.",[754,5598,5599,5602],{},[702,5600,5601],{},"Names of Those Involved",": Real names or usernames of the individuals involved.",[754,5604,5605,5608],{},[702,5606,5607],{},"Description of the Incident",": A clear and concise account of what happened.",[754,5610,5611,5614],{},[702,5612,5613],{},"Supporting Evidence",": Any relevant messages, screenshots, or context that can help us understand the situation.",[692,5616,5617],{},"All reports will be handled confidentially.",[882,5619,5621],{"id":5620},"enforcement","Enforcement",[692,5623,5624],{},"Project maintainers are responsible for ensuring compliance with this Code of Conduct and will take appropriate action in response to any behavior that is deemed unacceptable. Actions may include:",[751,5626,5627,5630,5633],{},[754,5628,5629],{},"A private warning to the offender.",[754,5631,5632],{},"Temporary or permanent ban from participation in the project and Discord channel.",[754,5634,5635],{},"Removal of contributions that violate the Code of Conduct.",[882,5637,5639],{"id":5638},"scope","Scope",[692,5641,5642],{},"This Code of Conduct applies to all project spaces, including but not limited to:",[751,5644,5645,5648,5651,5654,5657,5660],{},[754,5646,5647],{},"GitHub repositories",[754,5649,5650],{},"Issue trackers",[754,5652,5653],{},"Pull requests",[754,5655,5656],{},"Project-related forums and chat channels",[754,5658,5659],{},"Social media interactions pertaining to the project",[754,5661,5662,5663],{},"The official ",[702,5664,5665],{},"Inspira UI Discord channel",[692,5667,5668],{},"It also applies when an individual is representing the project or its community in public spaces.",[882,5670,5672],{"id":5671},"appeal-process","Appeal Process",[692,5674,5675,5676,5678],{},"Any individual who is subjected to disciplinary action has the right to appeal the decision by contacting the project maintainers through the ",[702,5677,5578],{}," within one week of the action. The appeal will be reviewed, and a final decision will be communicated.",[882,5680,5682],{"id":5681},"privacy","Privacy",[692,5684,5685],{},"All reports of unacceptable behavior will be handled with discretion. We will respect the privacy of the reporter and the accused.",[882,5687,786],{"id":785},[692,5689,5690],{},"We thank all contributors and community members for helping to create a positive environment. This Code of Conduct is adapted from best practices and guidelines used in open-source communities.",[882,5692,5694],{"id":5693},"contact-information","Contact Information",[692,5696,5697,5698,1305],{},"For questions or concerns about this Code of Conduct, please contact the project maintainers on our ",[702,5699,5578],{},[692,5701,5702],{},[696,5703,5585],{"href":5583,"rel":5704},[700],{"title":613,"searchDepth":847,"depth":847,"links":5706},[5707,5708,5709,5710,5711,5712,5713,5714,5715,5716,5717],{"id":5441,"depth":847,"text":5442},{"id":5451,"depth":847,"text":5452},{"id":5493,"depth":847,"text":5494},{"id":5532,"depth":847,"text":5533},{"id":5571,"depth":847,"text":5572},{"id":5620,"depth":847,"text":5621},{"id":5638,"depth":847,"text":5639},{"id":5671,"depth":847,"text":5672},{"id":5681,"depth":847,"text":5682},{"id":785,"depth":847,"text":786},{"id":5693,"depth":847,"text":5694},"Code of Conduct outlines our expectation for participant behavior as well as consequences for unacceptable conduct.",{"icon":5720},"lucide:award",{"title":19,"description":5718},"DZbxxCsbVkG4X6zCuJrTxjbzbLsmSyNAVXXkOVZIBrM",{"id":5724,"title":33,"badge":687,"body":5725,"category":5947,"description":5948,"extension":856,"links":687,"meta":5949,"navigation":859,"path":34,"seo":5950,"stem":35,"tags":5951,"__hash__":5955},"docs_en/en/2.components/backgrounds/aurora-background.md",{"type":689,"value":5726,"toc":5945},[5727,5942],[5728,5729,5734,5851,5923],"component-viewer",{":component-files":5730,"component-id":5731,"config":5732,"demo-file":5733},"[\"AuroraBackground.vue\"]","aurora-background","AuroraBackgroundConfig","AuroraBackgroundDemo.vue",[3549,5735,5736,5742],{"v-slot:instructions":613},[692,5737,5738,5739,5741],{},"Add following entry to inline theme in your ",[894,5740,1036],{}," file.",[925,5743,5745],{"className":1065,"code":5744,"language":1067,"meta":613,"style":613},"@theme inline {\n  --animate-aurora: aurora 60s linear infinite;\n  @keyframes aurora {\n    from {\n      background-position:\n        50% 50%,\n        50% 50%;\n    }\n    to {\n      background-position:\n        350% 50%,\n        350% 50%;\n    }\n  }\n}\n",[894,5746,5747,5755,5760,5771,5778,5785,5796,5804,5809,5816,5822,5831,5839,5843,5847],{"__ignoreMap":613},[934,5748,5749,5751,5753],{"class":936,"line":937},[934,5750,1111],{"class":1074},[934,5752,2508],{"class":1114},[934,5754,1118],{"class":1078},[934,5756,5757],{"class":936,"line":847},[934,5758,5759],{"class":1114},"  --animate-aurora: aurora 60s linear infinite;\n",[934,5761,5762,5765,5769],{"class":936,"line":850},[934,5763,5764],{"class":1074},"  @keyframes",[934,5766,5768],{"class":5767},"sHdIc"," aurora",[934,5770,1312],{"class":1078},[934,5772,5773,5776],{"class":936,"line":1108},[934,5774,5775],{"class":940},"    from",[934,5777,1312],{"class":1078},[934,5779,5780,5783],{"class":936,"line":1121},[934,5781,5782],{"class":2732},"      background-position",[934,5784,3408],{"class":1078},[934,5786,5787,5790,5793],{"class":936,"line":1127},[934,5788,5789],{"class":1757},"        50%",[934,5791,5792],{"class":1757}," 50%",[934,5794,5795],{"class":1078},",\n",[934,5797,5798,5800,5802],{"class":936,"line":1133},[934,5799,5789],{"class":1757},[934,5801,5792],{"class":1757},[934,5803,1087],{"class":1078},[934,5805,5806],{"class":936,"line":1138},[934,5807,5808],{"class":1078},"    }\n",[934,5810,5811,5814],{"class":936,"line":1144},[934,5812,5813],{"class":940},"    to",[934,5815,1312],{"class":1078},[934,5817,5818,5820],{"class":936,"line":1150},[934,5819,5782],{"class":2732},[934,5821,3408],{"class":1078},[934,5823,5824,5827,5829],{"class":936,"line":1155},[934,5825,5826],{"class":1757},"        350%",[934,5828,5792],{"class":1757},[934,5830,5795],{"class":1078},[934,5832,5833,5835,5837],{"class":936,"line":1161},[934,5834,5826],{"class":1757},[934,5836,5792],{"class":1757},[934,5838,1087],{"class":1078},[934,5840,5841],{"class":936,"line":1167},[934,5842,5808],{"class":1078},[934,5844,5845],{"class":936,"line":1172},[934,5846,2687],{"class":1078},[934,5848,5849],{"class":936,"line":1178},[934,5850,1294],{"class":1078},[3549,5852,5853,5857],{"v-slot:api":613},[882,5854,5856],{"id":5855},"api","API",[5858,5859,5860,5879],"table",{},[5861,5862,5863],"thead",{},[5864,5865,5866,5870,5873,5876],"tr",{},[5867,5868,5869],"th",{},"Prop Name",[5867,5871,5872],{},"Type",[5867,5874,5875],{},"Default",[5867,5877,5878],{},"Description",[5880,5881,5882,5903],"tbody",{},[5864,5883,5884,5890,5895,5900],{},[5885,5886,5887],"td",{},[894,5888,5889],{},"class",[5885,5891,5892],{},[894,5893,5894],{},"string",[5885,5896,5897],{},[894,5898,5899],{},"-",[5885,5901,5902],{},"Additional CSS classes to apply to the component for styling.",[5864,5904,5905,5910,5915,5920],{},[5885,5906,5907],{},[894,5908,5909],{},"radialGradient",[5885,5911,5912],{},[894,5913,5914],{},"boolean",[5885,5916,5917],{},[894,5918,5919],{},"true",[5885,5921,5922],{},"Determines whether a radial gradient effect is applied to the background.",[3549,5924,5925],{"v-slot:credits":613},[751,5926,5927,5934],{},[754,5928,5929,5930,880],{},"Credits to ",[696,5931,719],{"href":5932,"rel":5933},"https://ui.aceternity.com/components/aurora-background",[700],[754,5935,5929,5936,5941],{},[696,5937,5940],{"href":5938,"rel":5939},"https://github.com/sivareddyuppathi",[700],"SivaReddy Uppathi"," for porting this component.",[2836,5943,5944],{},"html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sqsOY, html code.shiki .sqsOY{--shiki-light:#8796B0;--shiki-default:#B2CCD6;--shiki-dark:#B2CCD6}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":613,"searchDepth":847,"depth":847,"links":5946},[],"Background","A subtle Aurora or Southern Lights background for your website.",{},{"title":33,"description":5948},[1067,5952,5953,5954],"tailwind","background","aceternity-ui","Y4cZRW948hRljI_iFpkkAwZF8gPXfFk-siqAHJ_fkzA",{"id":5957,"title":37,"badge":687,"body":5958,"category":5947,"description":6104,"extension":856,"links":687,"meta":6105,"navigation":859,"path":38,"seo":6106,"stem":39,"tags":6107,"__hash__":6109},"docs_en/en/2.components/backgrounds/black-hole-background.md",{"type":689,"value":5959,"toc":6102},[5960],[5728,5961,5966,6081],{":component-files":5962,"component-id":5963,"config":5964,"demo-file":5965},"[\"BlackHoleBackground.vue\"]","bg-black-hole","BlackHoleBackgroundConfig","BlackHoleBackgroundDemo.vue",[3549,5967,5968,5970],{"v-slot:api":613},[882,5969,5856],{"id":5855},[5858,5971,5972,5984],{},[5861,5973,5974],{},[5864,5975,5976,5978,5980,5982],{},[5867,5977,5869],{},[5867,5979,5872],{},[5867,5981,5875],{},[5867,5983,5878],{},[5880,5985,5986,6005,6025,6043,6063],{},[5864,5987,5988,5993,5997,6002],{},[5885,5989,5990],{},[894,5991,5992],{},"strokeColor",[5885,5994,5995],{},[894,5996,5894],{},[5885,5998,5999],{},[894,6000,6001],{},"\"#737373\"",[5885,6003,6004],{},"Stroke colour for the concentric discs and radial lines.",[5864,6006,6007,6012,6017,6022],{},[5885,6008,6009],{},[894,6010,6011],{},"numberOfLines",[5885,6013,6014],{},[894,6015,6016],{},"number",[5885,6018,6019],{},[894,6020,6021],{},"50",[5885,6023,6024],{},"Total radial lines emanating from the centre.",[5864,6026,6027,6032,6036,6040],{},[5885,6028,6029],{},[894,6030,6031],{},"numberOfDiscs",[5885,6033,6034],{},[894,6035,6016],{},[5885,6037,6038],{},[894,6039,6021],{},[5885,6041,6042],{},"Total concentric ellipses that form the tunnel.",[5864,6044,6045,6050,6055,6060],{},[5885,6046,6047],{},[894,6048,6049],{},"particleRGBColor",[5885,6051,6052],{},[894,6053,6054],{},"[number, number, number]",[5885,6056,6057],{},[894,6058,6059],{},"[255,255,255]",[5885,6061,6062],{},"RGB colour used for the tiny particles flowing into the hole.",[5864,6064,6065,6069,6073,6078],{},[5885,6066,6067],{},[894,6068,5889],{},[5885,6070,6071],{},[894,6072,5894],{},[5885,6074,6075],{},[894,6076,6077],{},"\"\"",[5885,6079,6080],{},"Extra utility classes merged onto the root wrapper.",[3549,6082,6083],{"v-slot:credits":613},[751,6084,6085,6088,6095],{},[754,6086,6087],{},"Custom generative art logic inspired by tunnel / warp animations.",[754,6089,6090,6091,6094],{},"Utilises ",[702,6092,6093],{},"Motion-V"," for gradient drift and Vue 3 Composition API for lifecycle control.",[754,6096,6097,6098,6101],{},"Developed with accessibility in mind—background effect remains purely decorative via ",[894,6099,6100],{},"aria-hidden"," canvas.",{"title":613,"searchDepth":847,"depth":847,"links":6103},[],"A mesmerizing, canvas-driven background effect that simulates a warped “black-hole” tunnel with animated discs, radial lines, and particles.",{},{"title":37,"description":6104},[1067,5952,5953,1023,6108],"canvas","fTmoM9bgu16wffJtDR6DznGuCYlZdQFLLT5vmquDaHM",{"id":6111,"title":41,"badge":687,"body":6112,"category":5947,"description":6184,"extension":856,"links":687,"meta":6185,"navigation":859,"path":42,"seo":6186,"stem":43,"tags":6187,"__hash__":6189},"docs_en/en/2.components/backgrounds/bubbles-bg.md",{"type":689,"value":6113,"toc":6182},[6114],[5728,6115,6122,6161],{":component-files":6116,"component-id":6117,"config":6118,"demo-file":6119,"dependencies":6120,"dev-dependencies":6121},"[\"BubblesBg.vue\"]","bg-bubbles","BubblesBgConfig","BubblesBgDemo.vue","three","@types/three",[3549,6123,6124,6126],{"v-slot:api":613},[882,6125,5856],{"id":5855},[5858,6127,6128,6140],{},[5861,6129,6130],{},[5864,6131,6132,6134,6136,6138],{},[5867,6133,5869],{},[5867,6135,5872],{},[5867,6137,5875],{},[5867,6139,5878],{},[5880,6141,6142],{},[5864,6143,6144,6149,6153,6158],{},[5885,6145,6146],{},[894,6147,6148],{},"blur",[5885,6150,6151],{},[894,6152,6016],{},[5885,6154,6155],{},[894,6156,6157],{},"0",[5885,6159,6160],{},"Amount of blur to apply to the background, specified in pixels.",[3549,6162,6163],{"v-slot:credits":613},[751,6164,6165,6174],{},[754,6166,6167,6168,6173],{},"Built with the ",[696,6169,6172],{"href":6170,"rel":6171},"https://threejs.org/",[700],"Three.js"," library for 3D rendering and animations.",[754,6175,6176,6177,880],{},"Inspired from ",[696,6178,6181],{"href":6179,"rel":6180},"https://lab.tresjs.org/experiments/overlay",[700],"Tresjs Experiment",{"title":613,"searchDepth":847,"depth":847,"links":6183},[],"An animated background with floating bubbles.",{},{"title":41,"description":6184},[1067,5952,5953,6188],"threejs","WcZXUxv93bPVKrBA_X3CKE5IDqnSszEsqjJqM_tkRBE",{"id":6191,"title":45,"badge":687,"body":6192,"category":5947,"description":6443,"extension":856,"links":687,"meta":6444,"navigation":859,"path":46,"seo":6445,"stem":47,"tags":6446,"__hash__":6448},"docs_en/en/2.components/backgrounds/cosmic-portal.md",{"type":689,"value":6193,"toc":6441},[6194],[5728,6195,6201,6429],{":component-files":6196,"component-id":6197,"config":6198,"demo-file":6199,"dependencies":6200,"dev-dependencies":6121},"[\"CosmicPortal.vue\"]","cosmic-portal","CosmicPortalConfig","CosmicPortalDemo.vue","three postprocessing",[3549,6202,6203,6205],{"v-slot:api":613},[882,6204,5856],{"id":5855},[5858,6206,6207,6219],{},[5861,6208,6209],{},[5864,6210,6211,6213,6215,6217],{},[5867,6212,5869],{},[5867,6214,5872],{},[5867,6216,5875],{},[5867,6218,5878],{},[5880,6220,6221,6240,6259,6278,6297,6316,6335,6354,6373,6392,6411],{},[5864,6222,6223,6228,6232,6237],{},[5885,6224,6225],{},[894,6226,6227],{},"portalComplexity",[5885,6229,6230],{},[894,6231,6016],{},[5885,6233,6234],{},[894,6235,6236],{},"4",[5885,6238,6239],{},"Controls the complexity of the portal effects and geometry.",[5864,6241,6242,6247,6251,6256],{},[5885,6243,6244],{},[894,6245,6246],{},"crystalCount",[5885,6248,6249],{},[894,6250,6016],{},[5885,6252,6253],{},[894,6254,6255],{},"12",[5885,6257,6258],{},"Number of floating crystals in the scene.",[5864,6260,6261,6266,6270,6275],{},[5885,6262,6263],{},[894,6264,6265],{},"primaryColor",[5885,6267,6268],{},[894,6269,5894],{},[5885,6271,6272],{},[894,6273,6274],{},"#9b59b6",[5885,6276,6277],{},"Main color for portal and background glow.",[5864,6279,6280,6285,6289,6294],{},[5885,6281,6282],{},[894,6283,6284],{},"secondaryColor",[5885,6286,6287],{},[894,6288,5894],{},[5885,6290,6291],{},[894,6292,6293],{},"#3498db",[5885,6295,6296],{},"Secondary color for blending and glow.",[5864,6298,6299,6304,6308,6313],{},[5885,6300,6301],{},[894,6302,6303],{},"accentColor",[5885,6305,6306],{},[894,6307,5894],{},[5885,6309,6310],{},[894,6311,6312],{},"#e74c3c",[5885,6314,6315],{},"Color used for portal energy and highlight.",[5864,6317,6318,6323,6327,6332],{},[5885,6319,6320],{},[894,6321,6322],{},"vortexColor",[5885,6324,6325],{},[894,6326,5894],{},[5885,6328,6329],{},[894,6330,6331],{},"#2ecc71",[5885,6333,6334],{},"Color used for swirling vortex and dimensional streams.",[5864,6336,6337,6342,6346,6351],{},[5885,6338,6339],{},[894,6340,6341],{},"rotationSpeed",[5885,6343,6344],{},[894,6345,6016],{},[5885,6347,6348],{},[894,6349,6350],{},"0.3",[5885,6352,6353],{},"Speed at which objects rotate.",[5864,6355,6356,6361,6365,6370],{},[5885,6357,6358],{},[894,6359,6360],{},"bloomStrength",[5885,6362,6363],{},[894,6364,6016],{},[5885,6366,6367],{},[894,6368,6369],{},"1.2",[5885,6371,6372],{},"Intensity of bloom postprocessing.",[5864,6374,6375,6380,6384,6389],{},[5885,6376,6377],{},[894,6378,6379],{},"bloomRadius",[5885,6381,6382],{},[894,6383,6016],{},[5885,6385,6386],{},[894,6387,6388],{},"0.7",[5885,6390,6391],{},"Radius of the bloom effect.",[5864,6393,6394,6399,6403,6408],{},[5885,6395,6396],{},[894,6397,6398],{},"bloomThreshold",[5885,6400,6401],{},[894,6402,6016],{},[5885,6404,6405],{},[894,6406,6407],{},"0.2",[5885,6409,6410],{},"Threshold for bloom visibility.",[5864,6412,6413,6418,6422,6426],{},[5885,6414,6415],{},[894,6416,6417],{},"dimensionShift",[5885,6419,6420],{},[894,6421,6016],{},[5885,6423,6424],{},[894,6425,6236],{},[5885,6427,6428],{},"Level of dimension distortion for shader animation.",[3549,6430,6431],{"v-slot:credits":613},[751,6432,6433],{},[754,6434,6435,6436,880],{},"Inspired and ported from ",[696,6437,6440],{"href":6438,"rel":6439},"https://x.com/techartist_",[700],"Dimensional Portal by Techartist",{"title":613,"searchDepth":847,"depth":847,"links":6442},[],"A breathtaking, animated 3D portal built with Three.js that features glowing rings, floating crystals, space distortion, and interdimensional streams.",{},{"title":45,"description":6443},[1067,5952,5953,6188,6447],"postprocessing","zibPQyvZnbwxH7lVoh0Hm4AwEKYWVkywo8YdsIJquRY",{"id":6450,"title":49,"badge":687,"body":6451,"category":5947,"description":6535,"extension":856,"links":687,"meta":6536,"navigation":859,"path":50,"seo":6537,"stem":51,"tags":6538,"__hash__":6539},"docs_en/en/2.components/backgrounds/falling-stars.md",{"type":689,"value":6452,"toc":6533},[6453],[5728,6454,6459,6517],{":component-files":6455,"component-id":6456,"config":6457,"demo-file":6458},"[\"FallingStarsBg.vue\"]","bg-falling-stars","FallingStarsBgConfig","FallingStarsBgDemo.vue",[3549,6460,6461,6463],{"v-slot:api":613},[882,6462,5856],{"id":5855},[5858,6464,6465,6477],{},[5861,6466,6467],{},[5864,6468,6469,6471,6473,6475],{},[5867,6470,5869],{},[5867,6472,5872],{},[5867,6474,5875],{},[5867,6476,5878],{},[5880,6478,6479,6498],{},[5864,6480,6481,6486,6490,6495],{},[5885,6482,6483],{},[894,6484,6485],{},"color",[5885,6487,6488],{},[894,6489,5894],{},[5885,6491,6492],{},[894,6493,6494],{},"\"#FFF\"",[5885,6496,6497],{},"Color of the stars in the starfield.",[5864,6499,6500,6505,6509,6514],{},[5885,6501,6502],{},[894,6503,6504],{},"count",[5885,6506,6507],{},[894,6508,6016],{},[5885,6510,6511],{},[894,6512,6513],{},"200",[5885,6515,6516],{},"Number of stars displayed in the animation.",[3549,6518,6519],{"v-slot:credits":613},[751,6520,6521,6524],{},[754,6522,6523],{},"Inspired by 3D starfield simulations and trail effects in modern canvas animations.",[754,6525,6526,6527,6532],{},"Credit to ",[696,6528,6531],{"href":6529,"rel":6530},"https://github.com/prpanto",[700],"Prodromos Pantos"," for porting the original component to Vue & Nuxt.",{"title":613,"searchDepth":847,"depth":847,"links":6534},[],"A stunning animated starfield background with glowing and sharp trail effects.",{},{"title":49,"description":6535},[1067,5952,5953,6108],"u_aK9ZhIK15rwmyMDwNROHZ3ovltl-XitDR0e1tdGd8",{"id":6541,"title":53,"badge":687,"body":6542,"category":5947,"description":6728,"extension":856,"links":687,"meta":6729,"navigation":859,"path":54,"seo":6730,"stem":55,"tags":6731,"__hash__":6733},"docs_en/en/2.components/backgrounds/flickering-grid.md",{"type":689,"value":6543,"toc":6726},[6544],[5728,6545,6550,6714],{":component-files":6546,"component-id":6547,"config":6548,"demo-file":6549},"[\"FlickeringGrid.vue\"]","flickering-grid","FlickeringGridConfig","FlickeringGridDemo.vue",[3549,6551,6552,6554],{"v-slot:api":613},[882,6553,5856],{"id":5855},[5858,6555,6556,6568],{},[5861,6557,6558],{},[5864,6559,6560,6562,6564,6566],{},[5867,6561,5869],{},[5867,6563,5872],{},[5867,6565,5875],{},[5867,6567,5878],{},[5880,6569,6570,6588,6607,6625,6643,6661,6679,6696],{},[5864,6571,6572,6577,6581,6585],{},[5885,6573,6574],{},[894,6575,6576],{},"squareSize",[5885,6578,6579],{},[894,6580,6016],{},[5885,6582,6583],{},[894,6584,6236],{},[5885,6586,6587],{},"Size of each square in the grid.",[5864,6589,6590,6595,6599,6604],{},[5885,6591,6592],{},[894,6593,6594],{},"gridGap",[5885,6596,6597],{},[894,6598,6016],{},[5885,6600,6601],{},[894,6602,6603],{},"6",[5885,6605,6606],{},"Gap between squares in the grid.",[5864,6608,6609,6614,6618,6622],{},[5885,6610,6611],{},[894,6612,6613],{},"flickerChance",[5885,6615,6616],{},[894,6617,6016],{},[5885,6619,6620],{},[894,6621,6350],{},[5885,6623,6624],{},"Probability of a square flickering.",[5864,6626,6627,6631,6635,6640],{},[5885,6628,6629],{},[894,6630,6485],{},[5885,6632,6633],{},[894,6634,5894],{},[5885,6636,6637],{},[894,6638,6639],{},"rgb(0, 0, 0)",[5885,6641,6642],{},"Color of the squares.",[5864,6644,6645,6650,6654,6658],{},[5885,6646,6647],{},[894,6648,6649],{},"width",[5885,6651,6652],{},[894,6653,6016],{},[5885,6655,6656],{},[894,6657,5899],{},[5885,6659,6660],{},"Width of the canvas.",[5864,6662,6663,6668,6672,6676],{},[5885,6664,6665],{},[894,6666,6667],{},"height",[5885,6669,6670],{},[894,6671,6016],{},[5885,6673,6674],{},[894,6675,5899],{},[5885,6677,6678],{},"Height of the canvas.",[5864,6680,6681,6685,6689,6693],{},[5885,6682,6683],{},[894,6684,5889],{},[5885,6686,6687],{},[894,6688,5894],{},[5885,6690,6691],{},[894,6692,5899],{},[5885,6694,6695],{},"Additional CSS classes for the canvas.",[5864,6697,6698,6703,6707,6711],{},[5885,6699,6700],{},[894,6701,6702],{},"maxOpacity",[5885,6704,6705],{},[894,6706,6016],{},[5885,6708,6709],{},[894,6710,6407],{},[5885,6712,6713],{},"Maximum opacity of the squares.",[3549,6715,6716],{"v-slot:credits":613},[751,6717,6718],{},[754,6719,5929,6720,6725],{},[696,6721,6724],{"href":6722,"rel":6723},"https://magicui.design/docs/components/flickering-grid",[700],"magicui flickering-grid"," for this component.",{"title":613,"searchDepth":847,"depth":847,"links":6727},[],"A flickering grid background made with Canvas, fully customizable using Tailwind CSS.",{},{"title":53,"description":6728},[1067,5952,5953,6108,6732],"magic-ui","uk_GH15g0vLg5pt6MwXsEzGjEKUBxjnKfcp63RjcozI",{"id":6735,"title":57,"badge":687,"body":6736,"category":5947,"description":6872,"extension":856,"links":687,"meta":6873,"navigation":859,"path":58,"seo":6874,"stem":59,"tags":6875,"__hash__":6877},"docs_en/en/2.components/backgrounds/interactive-grid-pattern.md",{"type":689,"value":6737,"toc":6870},[6738],[5728,6739,6744,6851],{":component-files":6740,"component-id":6741,"config":6742,"demo-file":6743},"[\"InteractiveGridPattern.vue\"]","interactive-grid-pattern","InteractiveGridPatternConfig","InteractiveGridPatternDemo.vue",[3549,6745,6746,6748],{"v-slot:api":613},[882,6747,5856],{"id":5855},[5858,6749,6750,6762],{},[5861,6751,6752],{},[5864,6753,6754,6756,6758,6760],{},[5867,6755,5869],{},[5867,6757,5872],{},[5867,6759,5875],{},[5867,6761,5878],{},[5880,6763,6764,6780,6796,6814,6831],{},[5864,6765,6766,6771,6775,6777],{},[5885,6767,6768],{},[894,6769,6770],{},"className",[5885,6772,6773],{},[894,6774,5894],{},[5885,6776,5899],{},[5885,6778,6779],{},"Additional classes for styling the component.",[5864,6781,6782,6787,6791,6793],{},[5885,6783,6784],{},[894,6785,6786],{},"squaresClassName",[5885,6788,6789],{},[894,6790,5894],{},[5885,6792,5899],{},[5885,6794,6795],{},"Additional classes for styling the squares.",[5864,6797,6798,6802,6806,6811],{},[5885,6799,6800],{},[894,6801,6649],{},[5885,6803,6804],{},[894,6805,6016],{},[5885,6807,6808],{},[894,6809,6810],{},"40",[5885,6812,6813],{},"Width of the square in pixels.",[5864,6815,6816,6820,6824,6828],{},[5885,6817,6818],{},[894,6819,6667],{},[5885,6821,6822],{},[894,6823,6016],{},[5885,6825,6826],{},[894,6827,6810],{},[5885,6829,6830],{},"Height of the square in pixels.",[5864,6832,6833,6838,6843,6848],{},[5885,6834,6835],{},[894,6836,6837],{},"squares",[5885,6839,6840],{},[894,6841,6842],{},"[number, number]",[5885,6844,6845],{},[894,6846,6847],{},"[24, 24]",[5885,6849,6850],{},"Number of squares in the grid pattern.",[3549,6852,6853],{"v-slot:credits":613},[751,6854,6855,6863],{},[754,6856,6857,6858,880],{},"Inspired by ",[696,6859,6862],{"href":6860,"rel":6861},"https://magicui.design/docs/components/interactive-grid-pattern",[700],"MagicUI",[754,6864,5929,6865,5941],{},[696,6866,6869],{"href":6867,"rel":6868},"https://github.com/kalix127",[700],"kalix127",{"title":613,"searchDepth":847,"depth":847,"links":6871},[],"A interactive background grid pattern made with SVGs, fully customizable.",{},{"title":57,"description":6872},[1067,5952,5953,6876,6732],"svg","cfSoHBQ6xpnqjQPL7sX9qLmSEo1CNddkhtgr6fPHVcU",{"id":6879,"title":61,"badge":687,"body":6880,"category":5947,"description":6976,"extension":856,"links":687,"meta":6977,"navigation":859,"path":62,"seo":6978,"stem":63,"tags":6979,"__hash__":6980},"docs_en/en/2.components/backgrounds/lamp-effect.md",{"type":689,"value":6881,"toc":6974},[6882],[5728,6883,6888,6963],{":component-files":6884,"component-id":6885,"config":6886,"demo-file":6887},"[\"LampEffect.vue\"]","lamp-effect","LampEffectConfig","LampEffectDemo.vue",[3549,6889,6890,6892],{"v-slot:api":613},[882,6891,5856],{"id":5855},[5858,6893,6894,6906],{},[5861,6895,6896],{},[5864,6897,6898,6900,6902,6904],{},[5867,6899,5869],{},[5867,6901,5872],{},[5867,6903,5875],{},[5867,6905,5878],{},[5880,6907,6908,6927,6946],{},[5864,6909,6910,6915,6919,6924],{},[5885,6911,6912],{},[894,6913,6914],{},"delay",[5885,6916,6917],{},[894,6918,6016],{},[5885,6920,6921],{},[894,6922,6923],{},"0.5",[5885,6925,6926],{},"Delay before the animation starts, in seconds.",[5864,6928,6929,6934,6938,6943],{},[5885,6930,6931],{},[894,6932,6933],{},"duration",[5885,6935,6936],{},[894,6937,6016],{},[5885,6939,6940],{},[894,6941,6942],{},"0.8",[5885,6944,6945],{},"Duration of the animation, in seconds.",[5864,6947,6948,6952,6956,6960],{},[5885,6949,6950],{},[894,6951,5889],{},[5885,6953,6954],{},[894,6955,5894],{},[5885,6957,6958],{},[894,6959,6077],{},[5885,6961,6962],{},"Additional CSS classes for custom styling.",[3549,6964,6965],{"v-slot:credits":613},[751,6966,6967],{},[754,6968,6969,6970],{},"Ported from ",[696,6971,719],{"href":6972,"rel":6973},"https://ui.aceternity.com/components/lamp-effect",[700],{"title":613,"searchDepth":847,"depth":847,"links":6975},[],"A captivating lamp lighting effect with conic gradients, spotlights, and glowing lines for an immersive visual experience.",{},{"title":61,"description":6976},[1067,5952,5953,5954],"6_NE_QwqRpgFrGwvXm_LqMRHuwraoq1WaE5p_uYVLaA",{"id":6982,"title":65,"badge":687,"body":6983,"category":5947,"description":7019,"extension":856,"links":687,"meta":7020,"navigation":859,"path":66,"seo":7021,"stem":67,"tags":7022,"__hash__":7024},"docs_en/en/2.components/backgrounds/liquid-background.md",{"type":689,"value":6984,"toc":7017},[6985],[5728,6986,6992,6999],{":component-files":6987,"component-id":6988,"config":6989,"demo-file":6990,"dependencies":6991},"[\"LiquidBackground.vue\"]","liquid-background","LiquidBackgroundConfig","LiquidBackgroundDemo.vue","ogl",[3549,6993,6994,6996],{"v-slot:api":613},[882,6995,5856],{"id":5855},[692,6997,6998],{},"This component does not require external props to function, as it dynamically renders the liquid background effect on mount.",[3549,7000,7001],{"v-slot:credits":613},[751,7002,7003,7011,7014],{},[754,7004,6167,7005,7010],{},[696,7006,7009],{"href":7007,"rel":7008},"https://github.com/oframe/ogl",[700],"OGL"," library for 3D rendering.",[754,7012,7013],{},"Inspired by generative art patterns.",[754,7015,7016],{},"Uses Vue's Composition API for lifecycle and state management.",{"title":613,"searchDepth":847,"depth":847,"links":7018},[],"A reactive and dynamic background effect using OGL for WebGL-based visuals.",{},{"title":65,"description":7019},[1067,5952,5953,6991,7023],"webgl","1rPDHZMAQAbD4FCdhocD1GGHB3dvqAquH5A-pw-ougI",{"id":7026,"title":69,"badge":687,"body":7027,"category":5947,"description":7164,"extension":856,"links":687,"meta":7165,"navigation":859,"path":70,"seo":7166,"stem":71,"tags":7167,"__hash__":7169},"docs_en/en/2.components/backgrounds/neural-background.md",{"type":689,"value":7028,"toc":7162},[7029],[5728,7030,7035,7141],{":component-files":7031,"component-id":7032,"config":7033,"demo-file":7034},"[\"NeuralBg.vue\"]","bg-neural","NeuralBgConfig","NeuralBgDemo.vue",[3549,7036,7037,7039,7128],{"v-slot:api":613},[882,7038,5856],{"id":5855},[5858,7040,7041,7053],{},[5861,7042,7043],{},[5864,7044,7045,7047,7049,7051],{},[5867,7046,5869],{},[5867,7048,5872],{},[5867,7050,5875],{},[5867,7052,5878],{},[5880,7054,7055,7073,7091,7110],{},[5864,7056,7057,7062,7066,7070],{},[5885,7058,7059],{},[894,7060,7061],{},"hue",[5885,7063,7064],{},[894,7065,6016],{},[5885,7067,7068],{},[894,7069,6513],{},[5885,7071,7072],{},"Base hue for background colors (in degrees, 0–360).",[5864,7074,7075,7080,7084,7088],{},[5885,7076,7077],{},[894,7078,7079],{},"saturation",[5885,7081,7082],{},[894,7083,6016],{},[5885,7085,7086],{},[894,7087,6942],{},[5885,7089,7090],{},"Saturation of the background color (0–1).",[5864,7092,7093,7098,7102,7107],{},[5885,7094,7095],{},[894,7096,7097],{},"chroma",[5885,7099,7100],{},[894,7101,6016],{},[5885,7103,7104],{},[894,7105,7106],{},"0.6",[5885,7108,7109],{},"Chroma/lightness factor of the HSL color (0-1).",[5864,7111,7112,7116,7120,7125],{},[5885,7113,7114],{},[894,7115,5889],{},[5885,7117,7118],{},[894,7119,5894],{},[5885,7121,7122],{},[894,7123,7124],{},"—",[5885,7126,7127],{},"Optional additional CSS classes for the canvas element.",[7129,7130,7131],"blockquote",{},[692,7132,7133,7134,7137,7138,7140],{},"💡 This component defaults to a full-screen fixed background with ",[894,7135,7136],{},"pointer-events-none",". You can override styles via the ",[894,7139,5889],{}," prop if needed.",[3549,7142,7143],{"v-slot:credits":613},[751,7144,7145,7152,7155],{},[754,7146,7147,7148,7151],{},"Built using ",[696,7149,7009],{"href":7007,"rel":7150},[700]," — a minimal WebGL framework.",[754,7153,7154],{},"Math and pattern logic based on recursive trigonometric layering.",[754,7156,6969,7157,880],{},[696,7158,7161],{"href":7159,"rel":7160},"https://cursify.vercel.app/components/neural-glow",[700],"Neural Glow Cursor by Cursify",{"title":613,"searchDepth":847,"depth":847,"links":7163},[],"A dynamic, shader-powered animated background with fluid neural-like visuals using OGL and GLSL.",{},{"title":69,"description":7164},[1067,5952,5953,6991,7023,7168],"cursify","cCp6gxensgQ2G3bYV6TIk98lcaWEv-IIi2ByJvYGcQE",{"id":7171,"title":73,"badge":687,"body":7172,"category":5947,"description":7269,"extension":856,"links":687,"meta":7270,"navigation":859,"path":74,"seo":7271,"stem":75,"tags":7272,"__hash__":7273},"docs_en/en/2.components/backgrounds/particle-whirlpool-bg.md",{"type":689,"value":7173,"toc":7267},[7174],[5728,7175,7180,7251],{":component-files":7176,"component-id":7177,"config":7178,"demo-file":7179,"dependencies":6200,"dev-dependencies":6121},"[\"ParticleWhirlpoolBg.vue\"]","bg-particle-whirlpool","ParticleWhirlpoolBgConfig","ParticleWhirlpoolBgDemo.vue",[3549,7181,7182,7184],{"v-slot:api":613},[882,7183,5856],{"id":5855},[5858,7185,7186,7198],{},[5861,7187,7188],{},[5864,7189,7190,7192,7194,7196],{},[5867,7191,5869],{},[5867,7193,5872],{},[5867,7195,5875],{},[5867,7197,5878],{},[5880,7199,7200,7216,7232],{},[5864,7201,7202,7206,7210,7214],{},[5885,7203,7204],{},[894,7205,5889],{},[5885,7207,7208],{},[894,7209,5894],{},[5885,7211,7212],{},[894,7213,6077],{},[5885,7215,6962],{},[5864,7217,7218,7222,7226,7230],{},[5885,7219,7220],{},[894,7221,6148],{},[5885,7223,7224],{},[894,7225,6016],{},[5885,7227,7228],{},[894,7229,6157],{},[5885,7231,6160],{},[5864,7233,7234,7239,7243,7248],{},[5885,7235,7236],{},[894,7237,7238],{},"particleCount",[5885,7240,7241],{},[894,7242,6016],{},[5885,7244,7245],{},[894,7246,7247],{},"2000",[5885,7249,7250],{},"Number of particles in the whirlpool animation.",[3549,7252,7253],{"v-slot:credits":613},[751,7254,7255,7260],{},[754,7256,6167,7257,6173],{},[696,7258,6172],{"href":6170,"rel":7259},[700],[754,7261,6857,7262],{},[696,7263,7266],{"href":7264,"rel":7265},"https://troisjs.github.io/examples/demos/3.html",[700],"TroisJs",{"title":613,"searchDepth":847,"depth":847,"links":7268},[],"An animated background with swirling particles.",{},{"title":73,"description":7269},[1067,5952,5953,6188,6447],"BvhNj_sjD6n-f7uuhUpEDTUd9kbLODGDXPTiJKq15oI",{"id":7275,"title":77,"badge":687,"body":7276,"category":5947,"description":7395,"extension":856,"links":687,"meta":7396,"navigation":859,"path":78,"seo":7397,"stem":79,"tags":7398,"__hash__":7399},"docs_en/en/2.components/backgrounds/particles-bg.md",{"type":689,"value":7277,"toc":7393},[7278],[5728,7279,7284,7377],{":component-files":7280,"component-id":7281,"config":7282,"demo-file":7283},"[\"ParticlesBg.vue\"]","particles-bg","ParticlesBgConfig","ParticlesBgDemo.vue",[3549,7285,7286,7288],{"v-slot:api":613},[882,7287,5856],{"id":5855},[5858,7289,7290,7302],{},[5861,7291,7292],{},[5864,7293,7294,7296,7298,7300],{},[5867,7295,5869],{},[5867,7297,5872],{},[5867,7299,5875],{},[5867,7301,5878],{},[5880,7303,7304,7322,7341,7359],{},[5864,7305,7306,7310,7314,7319],{},[5885,7307,7308],{},[894,7309,6485],{},[5885,7311,7312],{},[894,7313,5894],{},[5885,7315,7316],{},[894,7317,7318],{},"#FFF",[5885,7320,7321],{},"Hexadecimal color code used for particles. Supports 3 or 6 character hex codes.",[5864,7323,7324,7329,7333,7338],{},[5885,7325,7326],{},[894,7327,7328],{},"quantity",[5885,7330,7331],{},[894,7332,6016],{},[5885,7334,7335],{},[894,7336,7337],{},"100",[5885,7339,7340],{},"The number of particles to generate and display on the canvas.",[5864,7342,7343,7348,7352,7356],{},[5885,7344,7345],{},[894,7346,7347],{},"staticity",[5885,7349,7350],{},[894,7351,6016],{},[5885,7353,7354],{},[894,7355,6021],{},[5885,7357,7358],{},"Determines how much the particles move based on the mouse's proximity. Higher values reduce movement.",[5864,7360,7361,7366,7370,7374],{},[5885,7362,7363],{},[894,7364,7365],{},"ease",[5885,7367,7368],{},[894,7369,6016],{},[5885,7371,7372],{},[894,7373,6021],{},[5885,7375,7376],{},"Controls the easing effect of particle movement; lower values make particles follow the mouse more closely.",[3549,7378,7379],{"v-slot:credits":613},[751,7380,7381,7388],{},[754,7382,5929,7383,7387],{},[696,7384,725],{"href":7385,"rel":7386},"https://magicui.design/docs/components/particles",[700]," for this fantastic component.",[754,7389,6526,7390,6532],{},[696,7391,6531],{"href":6529,"rel":7392},[700],{"title":613,"searchDepth":847,"depth":847,"links":7394},[],"Particles can add a dynamic and engaging element to your website's visuals. They help create a feeling of depth, motion, and interaction, making the site more visually appealing.",{},{"title":77,"description":7395},[1067,5952,5953,6732,6108],"onEpH3qUuVQRFFf4bQq66y07YmEkxFHg08VqBLlfUw4",{"id":7401,"title":81,"badge":687,"body":7402,"category":5947,"description":7640,"extension":856,"links":687,"meta":7641,"navigation":859,"path":82,"seo":7642,"stem":83,"tags":7643,"__hash__":7644},"docs_en/en/2.components/backgrounds/pattern-background.md",{"type":689,"value":7403,"toc":7638},[7404],[5728,7405,7411,7605],{":component-files":7406,"component-id":7407,"config":7408,"demo-file":7409,"dependencies":7410},"[\"PatternBackground.vue\", \"index.ts\"]","pattern-background","PatternBackgroundConfig","PatternBackgroundDemo.vue","class-variance-authority",[3549,7412,7413,7415],{"v-slot:api":613},[882,7414,5856],{"id":5855},[5858,7416,7417,7429],{},[5861,7418,7419],{},[5864,7420,7421,7423,7425,7427],{},[5867,7422,5869],{},[5867,7424,5872],{},[5867,7426,5875],{},[5867,7428,5878],{},[5880,7430,7431,7453,7495,7519,7546,7571],{},[5864,7432,7433,7438,7442,7447],{},[5885,7434,7435],{},[894,7436,7437],{},"animate",[5885,7439,7440],{},[894,7441,5914],{},[5885,7443,7444],{},[894,7445,7446],{},"false",[5885,7448,7449,7450,7452],{},"Set ",[894,7451,5919],{}," if you want to animate the background.",[5864,7454,7455,7460,7485,7489],{},[5885,7456,7457],{},[894,7458,7459],{},"direction",[5885,7461,7462,7464,7465,7464,7467,7464,7470,7464,7473,7464,7476,7464,7479,7464,7482],{},[894,7463,4005],{}," | ",[894,7466,4146],{},[894,7468,7469],{},"left",[894,7471,7472],{},"right",[894,7474,7475],{},"top-left",[894,7477,7478],{},"top-right",[894,7480,7481],{},"bottom-left",[894,7483,7484],{},"bottom-right",[5885,7486,7487],{},[894,7488,4005],{},[5885,7490,7491,7492],{},"Direction of the animation movement. You can use the const ",[894,7493,7494],{},"PATTERN_BACKGROUND_DIRECTION.",[5864,7496,7497,7501,7509,7513],{},[5885,7498,7499],{},[894,7500,7459],{},[5885,7502,7503,7464,7506],{},[894,7504,7505],{},"grid",[894,7507,7508],{},"dot",[5885,7510,7511],{},[894,7512,7505],{},[5885,7514,7515,7516],{},"Type of pattern. You can use the const ",[894,7517,7518],{},"PATTERN_BACKGROUND_VARIANT.",[5864,7520,7521,7526,7539,7543],{},[5885,7522,7523],{},[894,7524,7525],{},"size",[5885,7527,7528,7464,7531,7464,7534,7464,7536],{},[894,7529,7530],{},"xs",[894,7532,7533],{},"sm",[894,7535,856],{},[894,7537,7538],{},"lg",[5885,7540,7541],{},[894,7542,856],{},[5885,7544,7545],{},"Size of the background pattern.",[5864,7547,7548,7553,7561,7565],{},[5885,7549,7550],{},[894,7551,7552],{},"mask",[5885,7554,7555,7464,7558],{},[894,7556,7557],{},"ellipse",[894,7559,7560],{},"ellipse-top",[5885,7562,7563],{},[894,7564,7557],{},[5885,7566,7567,7568],{},"Add a mask over the background pattern. You can use the const ",[894,7569,7570],{},"PATTERN_BACKGROUND_MASK.",[5864,7572,7573,7578,7582,7587],{},[5885,7574,7575],{},[894,7576,7577],{},"speed",[5885,7579,7580],{},[894,7581,6016],{},[5885,7583,7584],{},[894,7585,7586],{},"10000",[5885,7588,7589,7590,7593,7594,7597,7598,7601,7602],{},"Duration of the animation in ",[894,7591,7592],{},"ms",", the bigger it is, the slower the animation. (",[894,7595,7596],{},"20000"," slower than ",[894,7599,7600],{},"5000","). You can use the const ",[894,7603,7604],{},"PATTERN_BACKGROUND_SPEED.",[3549,7606,7607],{"v-slot:credits":613},[751,7608,7609,7617,7624,7631],{},[754,7610,6857,7611,7616],{},[696,7612,7615],{"href":7613,"rel":7614},"https://magicui.design/docs/components/dot-pattern",[700],"Magic UI's Dot Pattern"," component.",[754,7618,6857,7619,7616],{},[696,7620,7623],{"href":7621,"rel":7622},"https://magicui.design/docs/components/grid-pattern",[700],"Magic UI's Grid Pattern",[754,7625,6857,7626,7616],{},[696,7627,7630],{"href":7628,"rel":7629},"https://magicui.design/docs/components/animated-grid-pattern",[700],"Magic UI's Animated Grid Pattern",[754,7632,5929,7633,5941],{},[696,7634,7637],{"href":7635,"rel":7636},"https://nathandepachtere.com/",[700],"Nathan De Pachtere",{"title":613,"searchDepth":847,"depth":847,"links":7639},[],"Simple animated pattern background to make your sections stand out.",{},{"title":81,"description":7640},[1067,5952,5953,6732],"B33lVP4arpqRt4gHQT0cbpJmhKm72kh3hpwErMvtDDg",{"id":7646,"title":85,"badge":687,"body":7647,"category":5947,"description":7831,"extension":856,"links":687,"meta":7832,"navigation":859,"path":86,"seo":7833,"stem":87,"tags":7834,"__hash__":7835},"docs_en/en/2.components/backgrounds/ripple.md",{"type":689,"value":7648,"toc":7829},[7649],[5728,7650,7655,7808],{":component-files":7651,"component-id":7652,"config":7653,"demo-file":7654},"[\"Ripple.vue\", \"RippleCircle.vue\", \"RippleContainer.vue\"]","ripple","RippleConfig","RippleDemo.vue",[3549,7656,7657,7659],{"v-slot:api":613},[882,7658,5856],{"id":5855},[5858,7660,7661,7673],{},[5861,7662,7663],{},[5864,7664,7665,7667,7669,7671],{},[5867,7666,5869],{},[5867,7668,5872],{},[5867,7670,5875],{},[5867,7672,5878],{},[5880,7674,7675,7694,7713,7732,7751,7770,7789],{},[5864,7676,7677,7682,7686,7691],{},[5885,7678,7679],{},[894,7680,7681],{},"baseCircleSize",[5885,7683,7684],{},[894,7685,6016],{},[5885,7687,7688],{},[894,7689,7690],{},"210",[5885,7692,7693],{},"The size of the main circle in pixels.",[5864,7695,7696,7701,7705,7710],{},[5885,7697,7698],{},[894,7699,7700],{},"baseCircleOpacity",[5885,7702,7703],{},[894,7704,6016],{},[5885,7706,7707],{},[894,7708,7709],{},"0.24",[5885,7711,7712],{},"The opacity of the main circle.",[5864,7714,7715,7720,7724,7729],{},[5885,7716,7717],{},[894,7718,7719],{},"spaceBetweenCircle",[5885,7721,7722],{},[894,7723,6016],{},[5885,7725,7726],{},[894,7727,7728],{},"70",[5885,7730,7731],{},"The space between each ripple circle in pixels.",[5864,7733,7734,7739,7743,7748],{},[5885,7735,7736],{},[894,7737,7738],{},"circleOpacityDowngradeRatio",[5885,7740,7741],{},[894,7742,6016],{},[5885,7744,7745],{},[894,7746,7747],{},"0.03",[5885,7749,7750],{},"The rate at which opacity decreases for each successive ripple circle.",[5864,7752,7753,7758,7762,7767],{},[5885,7754,7755],{},[894,7756,7757],{},"circleClass",[5885,7759,7760],{},[894,7761,5894],{},[5885,7763,7764],{},[894,7765,7766],{},"undefined",[5885,7768,7769],{},"CSS class name(s) for additional styling of circles.",[5864,7771,7772,7777,7781,7786],{},[5885,7773,7774],{},[894,7775,7776],{},"waveSpeed",[5885,7778,7779],{},[894,7780,6016],{},[5885,7782,7783],{},[894,7784,7785],{},"80",[5885,7787,7788],{},"The animation speed for the wave effect, measured in ms.",[5864,7790,7791,7796,7800,7805],{},[5885,7792,7793],{},[894,7794,7795],{},"numberOfCircles",[5885,7797,7798],{},[894,7799,6016],{},[5885,7801,7802],{},[894,7803,7804],{},"7",[5885,7806,7807],{},"The number of ripple circles to render.",[3549,7809,7810],{"v-slot:credits":613},[751,7811,7812,7818,7823],{},[754,7813,5929,7814,880],{},[696,7815,725],{"href":7816,"rel":7817},"https://magicui.design/docs/components/ripple",[700],[754,7819,5929,7820,5941],{},[696,7821,5940],{"href":5938,"rel":7822},[700],[754,7824,5929,7825,7828],{},[696,7826,7637],{"href":7635,"rel":7827},[700]," for updating this component.",{"title":613,"searchDepth":847,"depth":847,"links":7830},[],"An animated ripple effect typically used behind elements to emphasize them.",{},{"title":85,"description":7831},[1067,5952,5953,6732],"BVTECLjFSnUpn-8Al7QhJyEwuIw8bFfpQnTNShDvaeU",{"id":7837,"title":89,"badge":687,"body":7838,"category":5947,"description":7983,"extension":856,"links":687,"meta":7984,"navigation":859,"path":90,"seo":7985,"stem":91,"tags":7986,"__hash__":7988},"docs_en/en/2.components/backgrounds/silk-background.md",{"type":689,"value":7839,"toc":7981},[7840],[5728,7841,7846,7965],{":component-files":7842,"component-id":7843,"config":7844,"demo-file":7845},"[\"SilkBackground.vue\"]","bg-silk","SilkBackgroundConfig","SilkBackgroundDemo.vue",[3549,7847,7848,7850,7957],{"v-slot:api":613},[882,7849,5856],{"id":5855},[5858,7851,7852,7864],{},[5861,7853,7854],{},[5864,7855,7856,7858,7860,7862],{},[5867,7857,5869],{},[5867,7859,5872],{},[5867,7861,5875],{},[5867,7863,5878],{},[5880,7865,7866,7884,7901,7919,7940],{},[5864,7867,7868,7872,7876,7881],{},[5885,7869,7870],{},[894,7871,7061],{},[5885,7873,7874],{},[894,7875,6016],{},[5885,7877,7878],{},[894,7879,7880],{},"300",[5885,7882,7883],{},"Base hue for the silk texture (in degrees, 0–360).",[5864,7885,7886,7890,7894,7898],{},[5885,7887,7888],{},[894,7889,7079],{},[5885,7891,7892],{},[894,7893,6016],{},[5885,7895,7896],{},[894,7897,6923],{},[5885,7899,7900],{},"Saturation of the color (0–1).",[5864,7902,7903,7908,7912,7916],{},[5885,7904,7905],{},[894,7906,7907],{},"brightness",[5885,7909,7910],{},[894,7911,6016],{},[5885,7913,7914],{},[894,7915,1758],{},[5885,7917,7918],{},"Brightness multiplier for the output color (0–2 recommended).",[5864,7920,7921,7925,7929,7933],{},[5885,7922,7923],{},[894,7924,7577],{},[5885,7926,7927],{},[894,7928,6016],{},[5885,7930,7931],{},[894,7932,1758],{},[5885,7934,7935,7936,7939],{},"Controls the animation speed multiplier (e.g., ",[894,7937,7938],{},"2"," = double speed).",[5864,7941,7942,7946,7950,7954],{},[5885,7943,7944],{},[894,7945,5889],{},[5885,7947,7948],{},[894,7949,5894],{},[5885,7951,7952],{},[894,7953,7124],{},[5885,7955,7956],{},"Optional additional CSS classes for the container div (e.g., z-index, etc).",[7129,7958,7959],{},[692,7960,7961,7962,7964],{},"💡 This component uses a full-screen absolute container by default. You can override positioning or stacking via the ",[894,7963,5889],{}," prop.",[3549,7966,7967],{"v-slot:credits":613},[751,7968,7969,7978],{},[754,7970,7971,7972,7977],{},"Adapted from ",[696,7973,7976],{"href":7974,"rel":7975},"https://www.shadertoy.com/view/X3yXRd",[700],"this ShaderToy shader"," by Giorgi Azmaipharashvili (MIT License).",[754,7979,7980],{},"Inspired by silk textures and fluid motion patterns found in organic materials.",{"title":613,"searchDepth":847,"depth":847,"links":7982},[],"A soft, flowing shader-powered background inspired by silk fabric motion and texture, rendered using ShaderToy.",{},{"title":89,"description":7983},[1067,5952,5953,7987,6991,7023],"shader-toy","txF8zecDojNSJ-j8Mw_0IwyA_WegBW4Lv4OEVacbf8A",{"id":7990,"title":93,"badge":687,"body":7991,"category":5947,"description":8154,"extension":856,"links":687,"meta":8155,"navigation":859,"path":94,"seo":8156,"stem":95,"tags":8157,"__hash__":8158},"docs_en/en/2.components/backgrounds/singularity-background.md",{"type":689,"value":7992,"toc":8152},[7993],[5728,7994,7999,8142],{":component-files":7995,"component-id":7996,"config":7997,"demo-file":7998},"[\"SingularityBackground.vue\"]","bg-singularity","SingularityBackgroundConfig","SingularityBackgroundDemo.vue",[3549,8000,8001,8003,8137],{"v-slot:api":613},[882,8002,5856],{"id":5855},[5858,8004,8005,8017],{},[5861,8006,8007],{},[5864,8008,8009,8011,8013,8015],{},[5867,8010,5869],{},[5867,8012,5872],{},[5867,8014,5875],{},[5867,8016,5878],{},[5880,8018,8019,8036,8052,8068,8085,8103,8121],{},[5864,8020,8021,8025,8029,8033],{},[5885,8022,8023],{},[894,8024,7061],{},[5885,8026,8027],{},[894,8028,6016],{},[5885,8030,8031],{},[894,8032,6157],{},[5885,8034,8035],{},"Base hue for the fractal texture (0–360 degrees).",[5864,8037,8038,8042,8046,8050],{},[5885,8039,8040],{},[894,8041,7079],{},[5885,8043,8044],{},[894,8045,6016],{},[5885,8047,8048],{},[894,8049,1758],{},[5885,8051,7900],{},[5864,8053,8054,8058,8062,8066],{},[5885,8055,8056],{},[894,8057,7907],{},[5885,8059,8060],{},[894,8061,6016],{},[5885,8063,8064],{},[894,8065,1758],{},[5885,8067,7918],{},[5864,8069,8070,8074,8078,8082],{},[5885,8071,8072],{},[894,8073,7577],{},[5885,8075,8076],{},[894,8077,6016],{},[5885,8079,8080],{},[894,8081,1758],{},[5885,8083,8084],{},"Speed multiplier for animation.",[5864,8086,8087,8092,8096,8100],{},[5885,8088,8089],{},[894,8090,8091],{},"mouseSensitivity",[5885,8093,8094],{},[894,8095,6016],{},[5885,8097,8098],{},[894,8099,6923],{},[5885,8101,8102],{},"Controls the responsiveness to mouse movement. (0–5)",[5864,8104,8105,8110,8114,8118],{},[5885,8106,8107],{},[894,8108,8109],{},"damping",[5885,8111,8112],{},[894,8113,6016],{},[5885,8115,8116],{},[894,8117,1758],{},[5885,8119,8120],{},"Damping factor to control the smoothness of texture distortions. (0–1)",[5864,8122,8123,8127,8131,8135],{},[5885,8124,8125],{},[894,8126,5889],{},[5885,8128,8129],{},[894,8130,5894],{},[5885,8132,8133],{},[894,8134,7124],{},[5885,8136,7956],{},[7129,8138,8139],{},[692,8140,8141],{},"💡 This component is designed to be used in full-screen or large section backgrounds. It is optimized for modern GPUs but may be demanding on lower-end devices.",[3549,8143,8144],{"v-slot:credits":613},[751,8145,8146],{},[754,8147,7971,8148,880],{},[696,8149,7976],{"href":8150,"rel":8151},"https://www.shadertoy.com/view/3csSWB",[700],{"title":613,"searchDepth":847,"depth":847,"links":8153},[],"A shader-based background.",{},{"title":93,"description":8154},[1067,5952,5953,7987,7023,6991],"DkMcVbROy-rgYYgaQ9e8dxIoH9T1roQGABH6QLpl8Jg",{"id":8160,"title":97,"badge":687,"body":8161,"category":5947,"description":8304,"extension":856,"links":687,"meta":8305,"navigation":859,"path":98,"seo":8306,"stem":99,"tags":8307,"__hash__":8308},"docs_en/en/2.components/backgrounds/snowfall-bg.md",{"type":689,"value":8162,"toc":8302},[8163],[5728,8164,8169,8295],{":component-files":8165,"component-id":8166,"config":8167,"demo-file":8168},"[\"SnowfallBg.vue\"]","snowfall-bg","SnowfallBgConfig","SnowfallBgDemo.vue",[3549,8170,8171,8173],{"v-slot:api":613},[882,8172,5856],{"id":5855},[5858,8174,8175,8187],{},[5861,8176,8177],{},[5864,8178,8179,8181,8183,8185],{},[5867,8180,5869],{},[5867,8182,5872],{},[5867,8184,5875],{},[5867,8186,5878],{},[5880,8188,8189,8206,8223,8240,8259,8277],{},[5864,8190,8191,8195,8199,8203],{},[5885,8192,8193],{},[894,8194,6485],{},[5885,8196,8197],{},[894,8198,5894],{},[5885,8200,8201],{},[894,8202,7318],{},[5885,8204,8205],{},"Color of the snowflakes in hexadecimal format.",[5864,8207,8208,8212,8216,8220],{},[5885,8209,8210],{},[894,8211,7328],{},[5885,8213,8214],{},[894,8215,6016],{},[5885,8217,8218],{},[894,8219,7337],{},[5885,8221,8222],{},"Number of snowflakes to display.",[5864,8224,8225,8229,8233,8237],{},[5885,8226,8227],{},[894,8228,7577],{},[5885,8230,8231],{},[894,8232,6016],{},[5885,8234,8235],{},[894,8236,1758],{},[5885,8238,8239],{},"Speed at which snowflakes fall.",[5864,8241,8242,8247,8251,8256],{},[5885,8243,8244],{},[894,8245,8246],{},"maxRadius",[5885,8248,8249],{},[894,8250,6016],{},[5885,8252,8253],{},[894,8254,8255],{},"3",[5885,8257,8258],{},"Maximum radius of snowflakes.",[5864,8260,8261,8266,8270,8274],{},[5885,8262,8263],{},[894,8264,8265],{},"minRadius",[5885,8267,8268],{},[894,8269,6016],{},[5885,8271,8272],{},[894,8273,1758],{},[5885,8275,8276],{},"Minimum radius of snowflakes.",[5864,8278,8279,8283,8287,8292],{},[5885,8280,8281],{},[894,8282,5889],{},[5885,8284,8285],{},[894,8286,5894],{},[5885,8288,8289],{},[894,8290,8291],{},"null",[5885,8293,8294],{},"Additional CSS classes to apply to the container element.",[3549,8296,8297],{"v-slot:credits":613},[751,8298,8299],{},[754,8300,8301],{},"Inspired by natural snowfall effects.",{"title":613,"searchDepth":847,"depth":847,"links":8303},[],"A beautifully animated snowfall effect applied as a background.",{},{"title":97,"description":8304},[1067,5952,5953,6108],"kBweItEGUE8B66FbXWB898gpXLZTWNfTe4mvGqU7Gvg",{"id":8310,"title":101,"badge":687,"body":8311,"category":5947,"description":8468,"extension":856,"links":687,"meta":8469,"navigation":859,"path":102,"seo":8470,"stem":103,"tags":8471,"__hash__":8472},"docs_en/en/2.components/backgrounds/sparkles.md",{"type":689,"value":8312,"toc":8466},[8313],[5728,8314,8319,8448],{":component-files":8315,"component-id":8316,"config":8317,"demo-file":8318},"[\"Sparkles.vue\"]","sparkles","SparklesConfig","SparklesDemo.vue",[3549,8320,8321,8323],{"v-slot:api":613},[882,8322,5856],{"id":5855},[5858,8324,8325,8337],{},[5861,8326,8327],{},[5864,8328,8329,8331,8333,8335],{},[5867,8330,5869],{},[5867,8332,5872],{},[5867,8334,5875],{},[5867,8336,5878],{},[5880,8338,8339,8357,8376,8394,8412,8429],{},[5864,8340,8341,8345,8349,8354],{},[5885,8342,8343],{},[894,8344,5953],{},[5885,8346,8347],{},[894,8348,5894],{},[5885,8350,8351],{},[894,8352,8353],{},"'#0d47a1'",[5885,8355,8356],{},"Background color of the container. Use 'transparent' to see through to parent element.",[5864,8358,8359,8364,8368,8373],{},[5885,8360,8361],{},[894,8362,8363],{},"particleColor",[5885,8365,8366],{},[894,8367,5894],{},[5885,8369,8370],{},[894,8371,8372],{},"'#ffffff'",[5885,8374,8375],{},"Color of the particles. Accepts any valid CSS color value.",[5864,8377,8378,8383,8387,8391],{},[5885,8379,8380],{},[894,8381,8382],{},"minSize",[5885,8384,8385],{},[894,8386,6016],{},[5885,8388,8389],{},[894,8390,1758],{},[5885,8392,8393],{},"Minimum size of particles in pixels.",[5864,8395,8396,8401,8405,8409],{},[5885,8397,8398],{},[894,8399,8400],{},"maxSize",[5885,8402,8403],{},[894,8404,6016],{},[5885,8406,8407],{},[894,8408,8255],{},[5885,8410,8411],{},"Maximum size of particles in pixels.",[5864,8413,8414,8418,8422,8426],{},[5885,8415,8416],{},[894,8417,7577],{},[5885,8419,8420],{},[894,8421,6016],{},[5885,8423,8424],{},[894,8425,6236],{},[5885,8427,8428],{},"Movement speed multiplier. Higher values create faster movement.",[5864,8430,8431,8436,8440,8445],{},[5885,8432,8433],{},[894,8434,8435],{},"particleDensity",[5885,8437,8438],{},[894,8439,6016],{},[5885,8441,8442],{},[894,8443,8444],{},"120",[5885,8446,8447],{},"Number of particles to render. Higher values create denser particle fields.",[3549,8449,8450],{"v-slot:credits":613},[751,8451,8452,8459],{},[754,8453,5929,8454,5941],{},[696,8455,8458],{"href":8456,"rel":8457},"https://github.com/atif0075",[700],"M Atif",[754,8460,6969,8461,880],{},[696,8462,8465],{"href":8463,"rel":8464},"https://ui.aceternity.com/components/sparkles",[700],"Aceternity UI's Sparkles",{"title":613,"searchDepth":847,"depth":847,"links":8467},[],"A configurable sparkles component that can be used as a background or as a standalone component.",{},{"title":101,"description":8468},[1067,5952,5953,6108],"w-MHF-YcvP8VnBJcaBrK5RB1E1HI5qqTmkuwvyaCH6U",{"id":8474,"title":105,"badge":687,"body":8475,"category":5947,"description":8613,"extension":856,"links":687,"meta":8614,"navigation":859,"path":106,"seo":8615,"stem":107,"tags":8616,"__hash__":8618},"docs_en/en/2.components/backgrounds/stars-background.md",{"type":689,"value":8476,"toc":8611},[8477],[5728,8478,8483,8600],{":component-files":8479,"component-id":8480,"config":8481,"demo-file":8482},"[\"StarsBackground.vue\"]","bg-stars","StarsBackgroundConfig","StarsBackgroundDemo.vue",[3549,8484,8485,8487,8595],{"v-slot:api":613},[882,8486,5856],{"id":5855},[5858,8488,8489,8501],{},[5861,8490,8491],{},[5864,8492,8493,8495,8497,8499],{},[5867,8494,5869],{},[5867,8496,5872],{},[5867,8498,5875],{},[5867,8500,5878],{},[5880,8502,8503,8522,8539,8559,8578],{},[5864,8504,8505,8510,8514,8519],{},[5885,8506,8507],{},[894,8508,8509],{},"factor",[5885,8511,8512],{},[894,8513,6016],{},[5885,8515,8516],{},[894,8517,8518],{},"0.05",[5885,8520,8521],{},"Multiplier for mouse parallax movement.",[5864,8523,8524,8528,8532,8536],{},[5885,8525,8526],{},[894,8527,7577],{},[5885,8529,8530],{},[894,8531,6016],{},[5885,8533,8534],{},[894,8535,6021],{},[5885,8537,8538],{},"Base speed (in seconds) for vertical looping animation of star layers.",[5864,8540,8541,8546,8551,8556],{},[5885,8542,8543],{},[894,8544,8545],{},"transition",[5885,8547,8548],{},[894,8549,8550],{},"SpringOptions",[5885,8552,8553],{},[894,8554,8555],{},"{ stiffness: 50, damping: 20 }",[5885,8557,8558],{},"Spring physics config for smooth motion response to cursor movement.",[5864,8560,8561,8566,8570,8575],{},[5885,8562,8563],{},[894,8564,8565],{},"starColor",[5885,8567,8568],{},[894,8569,5894],{},[5885,8571,8572],{},[894,8573,8574],{},"\"#fff\"",[5885,8576,8577],{},"Color of the stars. Accepts any valid CSS color value.",[5864,8579,8580,8584,8588,8592],{},[5885,8581,8582],{},[894,8583,5889],{},[5885,8585,8586],{},[894,8587,5894],{},[5885,8589,8590],{},[894,8591,7124],{},[5885,8593,8594],{},"Optional additional classes for container div. Useful for z-index, etc.",[7129,8596,8597],{},[692,8598,8599],{},"💡 This component wraps a slot for children, so you can place other UI elements over the background.",[3549,8601,8602],{"v-slot:credits":613},[751,8603,8604],{},[754,8605,6969,8606],{},[696,8607,8610],{"href":8608,"rel":8609},"https://animate-ui.com/docs/backgrounds/stars",[700],"Animate UI",{"title":613,"searchDepth":847,"depth":847,"links":8612},[],"A parallax-animated starfield background using layered motion and randomized star positions.",{},{"title":105,"description":8613},[1067,5952,5953,8617,1023],"animate-ui","3eTGVP-IDMwznpfDN1C_FFPSfxiXfeEevXUOHHdyuOw",{"id":8620,"title":109,"badge":687,"body":8621,"category":5947,"description":8782,"extension":856,"links":687,"meta":8783,"navigation":859,"path":110,"seo":8784,"stem":111,"tags":8785,"__hash__":8786},"docs_en/en/2.components/backgrounds/stractium-background.md",{"type":689,"value":8622,"toc":8780},[8623],[5728,8624,8629,8767],{":component-files":8625,"component-id":8626,"config":8627,"demo-file":8628},"[\"StractiumBackground.vue\"]","bg-stractium","StractiumBackgroundConfig","StractiumBackgroundDemo.vue",[3549,8630,8631,8633,8763],{"v-slot:api":613},[882,8632,5856],{"id":5855},[5858,8634,8635,8647],{},[5861,8636,8637],{},[5864,8638,8639,8641,8643,8645],{},[5867,8640,5869],{},[5867,8642,5872],{},[5867,8644,5875],{},[5867,8646,5878],{},[5880,8648,8649,8665,8681,8697,8714,8731,8747],{},[5864,8650,8651,8655,8659,8663],{},[5885,8652,8653],{},[894,8654,7061],{},[5885,8656,8657],{},[894,8658,6016],{},[5885,8660,8661],{},[894,8662,6157],{},[5885,8664,8035],{},[5864,8666,8667,8671,8675,8679],{},[5885,8668,8669],{},[894,8670,7079],{},[5885,8672,8673],{},[894,8674,6016],{},[5885,8676,8677],{},[894,8678,1758],{},[5885,8680,7900],{},[5864,8682,8683,8687,8691,8695],{},[5885,8684,8685],{},[894,8686,7907],{},[5885,8688,8689],{},[894,8690,6016],{},[5885,8692,8693],{},[894,8694,1758],{},[5885,8696,7918],{},[5864,8698,8699,8703,8707,8711],{},[5885,8700,8701],{},[894,8702,7577],{},[5885,8704,8705],{},[894,8706,6016],{},[5885,8708,8709],{},[894,8710,1758],{},[5885,8712,8713],{},"Speed multiplier for texture animation.",[5864,8715,8716,8720,8724,8728],{},[5885,8717,8718],{},[894,8719,8091],{},[5885,8721,8722],{},[894,8723,6016],{},[5885,8725,8726],{},[894,8727,6923],{},[5885,8729,8730],{},"Controls the responsiveness of the texture to mouse movement. (0–1)",[5864,8732,8733,8737,8741,8745],{},[5885,8734,8735],{},[894,8736,8109],{},[5885,8738,8739],{},[894,8740,6016],{},[5885,8742,8743],{},[894,8744,1758],{},[5885,8746,8120],{},[5864,8748,8749,8753,8757,8761],{},[5885,8750,8751],{},[894,8752,5889],{},[5885,8754,8755],{},[894,8756,5894],{},[5885,8758,8759],{},[894,8760,7124],{},[5885,8762,7956],{},[7129,8764,8765],{},[692,8766,8141],{},[3549,8768,8769],{"v-slot:credits":613},[751,8770,8771,8774,8777],{},[754,8772,8773],{},"Based on a ShaderToy fragment shader by the original creator of the fractal patterns (MIT License).",[754,8775,8776],{},"Embedded in a Vue component and adapted for dynamic input via props.",[754,8778,8779],{},"Inspired by fractal patterns, natural textures, and advanced raymarching techniques.",{"title":613,"searchDepth":847,"depth":847,"links":8781},[],"A shader-based background inspired by intricate fractal patterns and organic textures, created using raymarching and GLSL. This effect is designed to simulate complex, evolving visual textures.",{},{"title":109,"description":8782},[1067,5952,5953,7987,7023,6991],"4qMmKL174xRxwLptZoWkhtELACZRCYPa0VuTivItXJU",{"id":8788,"title":113,"badge":687,"body":8789,"category":5947,"description":8892,"extension":856,"links":687,"meta":8893,"navigation":859,"path":114,"seo":8894,"stem":115,"tags":8895,"__hash__":8896},"docs_en/en/2.components/backgrounds/tetris.md",{"type":689,"value":8790,"toc":8890},[8791],[5728,8792,8798,8872],{":component-files":8793,"component-id":8794,"config":8795,"demo-file":8796,"dependencies":8797},"[\"Tetris.vue\"]","tetris","TetrisConfig","TetrisDemo.vue","theme-colors",[3549,8799,8800,8802],{"v-slot:api":613},[882,8801,5856],{"id":5855},[5858,8803,8804,8816],{},[5861,8805,8806],{},[5864,8807,8808,8810,8812,8814],{},[5867,8809,5869],{},[5867,8811,5872],{},[5867,8813,5875],{},[5867,8815,5878],{},[5880,8817,8818,8835,8854],{},[5864,8819,8820,8824,8828,8832],{},[5885,8821,8822],{},[894,8823,5889],{},[5885,8825,8826],{},[894,8827,5894],{},[5885,8829,8830],{},[894,8831,6077],{},[5885,8833,8834],{},"Additional class names to style the component.",[5864,8836,8837,8842,8846,8851],{},[5885,8838,8839],{},[894,8840,8841],{},"base",[5885,8843,8844],{},[894,8845,6016],{},[5885,8847,8848],{},[894,8849,8850],{},"10",[5885,8852,8853],{},"How many blocks do you have in a row.",[5864,8855,8856,8861,8865,8869],{},[5885,8857,8858],{},[894,8859,8860],{},"square-color",[5885,8862,8863],{},[894,8864,5894],{},[5885,8866,8867],{},[894,8868,6077],{},[5885,8870,8871],{},"Square color.",[3549,8873,8874],{"v-slot:credits":613},[751,8875,8876,8883],{},[754,8877,5929,8878,6725],{},[696,8879,8882],{"href":8880,"rel":8881},"https://github.com/Whbbit1999",[700],"Whbbit1999",[754,8884,6435,8885,880],{},[696,8886,8889],{"href":8887,"rel":8888},"https://ui2.nuxt.com/",[700],"Nuxt UI Home",{"title":613,"searchDepth":847,"depth":847,"links":8891},[],"Tetris background component, you can even click on a block to eliminate it.",{},{"title":113,"description":8892},[1067,5952,5953],"yWFdXS2uNO6uiXq0LRm1m8U2RUl7d3dC6u-Qy9jS7IM",{"id":8898,"title":117,"badge":687,"body":8899,"category":5947,"description":9055,"extension":856,"links":687,"meta":9056,"navigation":859,"path":118,"seo":9057,"stem":119,"tags":9058,"__hash__":9059},"docs_en/en/2.components/backgrounds/thunderstorm-background.md",{"type":689,"value":8900,"toc":9053},[8901],[5728,8902,8907,9043],{":component-files":8903,"component-id":8904,"config":8905,"demo-file":8906},"[\"ThunderstormBackground.vue\"]","bg-thunderstorm","ThunderstormBackgroundConfig","ThunderstormBackgroundDemo.vue",[3549,8908,8909,8911,9039],{"v-slot:api":613},[882,8910,5856],{"id":5855},[5858,8912,8913,8925],{},[5861,8914,8915],{},[5864,8916,8917,8919,8921,8923],{},[5867,8918,5869],{},[5867,8920,5872],{},[5867,8922,5875],{},[5867,8924,5878],{},[5880,8926,8927,8943,8959,8975,8991,9007,9023],{},[5864,8928,8929,8933,8937,8941],{},[5885,8930,8931],{},[894,8932,7061],{},[5885,8934,8935],{},[894,8936,6016],{},[5885,8938,8939],{},[894,8940,6157],{},[5885,8942,8035],{},[5864,8944,8945,8949,8953,8957],{},[5885,8946,8947],{},[894,8948,7079],{},[5885,8950,8951],{},[894,8952,6016],{},[5885,8954,8955],{},[894,8956,1758],{},[5885,8958,7900],{},[5864,8960,8961,8965,8969,8973],{},[5885,8962,8963],{},[894,8964,7907],{},[5885,8966,8967],{},[894,8968,6016],{},[5885,8970,8971],{},[894,8972,1758],{},[5885,8974,7918],{},[5864,8976,8977,8981,8985,8989],{},[5885,8978,8979],{},[894,8980,7577],{},[5885,8982,8983],{},[894,8984,6016],{},[5885,8986,8987],{},[894,8988,1758],{},[5885,8990,8084],{},[5864,8992,8993,8997,9001,9005],{},[5885,8994,8995],{},[894,8996,8091],{},[5885,8998,8999],{},[894,9000,6016],{},[5885,9002,9003],{},[894,9004,6923],{},[5885,9006,8102],{},[5864,9008,9009,9013,9017,9021],{},[5885,9010,9011],{},[894,9012,8109],{},[5885,9014,9015],{},[894,9016,6016],{},[5885,9018,9019],{},[894,9020,1758],{},[5885,9022,8120],{},[5864,9024,9025,9029,9033,9037],{},[5885,9026,9027],{},[894,9028,5889],{},[5885,9030,9031],{},[894,9032,5894],{},[5885,9034,9035],{},[894,9036,7124],{},[5885,9038,7956],{},[7129,9040,9041],{},[692,9042,8141],{},[3549,9044,9045],{"v-slot:credits":613},[751,9046,9047],{},[754,9048,7971,9049,880],{},[696,9050,7976],{"href":9051,"rel":9052},"https://www.shadertoy.com/view/W3d3z7",[700],{"title":613,"searchDepth":847,"depth":847,"links":9054},[],"A shader-based background inspired by thunderstorm in clouds.",{},{"title":117,"description":9055},[1067,5952,5953,7987,7023,6991],"89sXELONk2jcPzQVn8kaVp9SD4tF7qburSBeDGWl1wc",{"id":9061,"title":121,"badge":687,"body":9062,"category":5947,"description":9313,"extension":856,"links":687,"meta":9314,"navigation":859,"path":122,"seo":9315,"stem":123,"tags":9316,"__hash__":9317},"docs_en/en/2.components/backgrounds/video-text.md",{"type":689,"value":9063,"toc":9311},[9064],[5728,9065,9070,9295],{":component-files":9066,"component-id":9067,"config":9068,"demo-file":9069},"[\"VideoText.vue\"]","video-text","VideoTextConfig","VideoTextDemo.vue",[3549,9071,9072,9074],{"v-slot:api":613},[882,9073,5856],{"id":5855},[5858,9075,9076,9088],{},[5861,9077,9078],{},[5864,9079,9080,9082,9084,9086],{},[5867,9081,5869],{},[5867,9083,5872],{},[5867,9085,5875],{},[5867,9087,5878],{},[5880,9089,9090,9109,9126,9144,9162,9180,9200,9220,9239,9258,9276],{},[5864,9091,9092,9097,9101,9106],{},[5885,9093,9094],{},[894,9095,9096],{},"src",[5885,9098,9099],{},[894,9100,5894],{},[5885,9102,9103],{},[894,9104,9105],{},"Required",[5885,9107,9108],{},"The video source URL.",[5864,9110,9111,9115,9119,9123],{},[5885,9112,9113],{},[894,9114,5889],{},[5885,9116,9117],{},[894,9118,5894],{},[5885,9120,9121],{},[894,9122,6077],{},[5885,9124,9125],{},"Additional classes for the container.",[5864,9127,9128,9133,9137,9141],{},[5885,9129,9130],{},[894,9131,9132],{},"autoPlay",[5885,9134,9135],{},[894,9136,5914],{},[5885,9138,9139],{},[894,9140,5919],{},[5885,9142,9143],{},"Whether to autoplay the video.",[5864,9145,9146,9151,9155,9159],{},[5885,9147,9148],{},[894,9149,9150],{},"muted",[5885,9152,9153],{},[894,9154,5914],{},[5885,9156,9157],{},[894,9158,5919],{},[5885,9160,9161],{},"Whether to mute the video.",[5864,9163,9164,9169,9173,9177],{},[5885,9165,9166],{},[894,9167,9168],{},"loop",[5885,9170,9171],{},[894,9172,5914],{},[5885,9174,9175],{},[894,9176,5919],{},[5885,9178,9179],{},"Whether to loop the video.",[5864,9181,9182,9187,9192,9197],{},[5885,9183,9184],{},[894,9185,9186],{},"preload",[5885,9188,9189],{},[894,9190,9191],{},"\"auto\" | \"metadata\" | \"none\"",[5885,9193,9194],{},[894,9195,9196],{},"\"auto\"",[5885,9198,9199],{},"Whether to preload the video.",[5864,9201,9202,9207,9212,9217],{},[5885,9203,9204],{},[894,9205,9206],{},"fontSize",[5885,9208,9209],{},[894,9210,9211],{},"string | number",[5885,9213,9214],{},[894,9215,9216],{},"\"120\"",[5885,9218,9219],{},"Font size for the text mask.",[5864,9221,9222,9227,9231,9236],{},[5885,9223,9224],{},[894,9225,9226],{},"fontWeight",[5885,9228,9229],{},[894,9230,9211],{},[5885,9232,9233],{},[894,9234,9235],{},"\"bold\"",[5885,9237,9238],{},"Font weight for the text mask.",[5864,9240,9241,9246,9250,9255],{},[5885,9242,9243],{},[894,9244,9245],{},"textAnchor",[5885,9247,9248],{},[894,9249,5894],{},[5885,9251,9252],{},[894,9253,9254],{},"\"middle\"",[5885,9256,9257],{},"Text anchor for the text mask.",[5864,9259,9260,9265,9269,9273],{},[5885,9261,9262],{},[894,9263,9264],{},"dominantBaseline",[5885,9266,9267],{},[894,9268,5894],{},[5885,9270,9271],{},[894,9272,9254],{},[5885,9274,9275],{},"Dominant baseline for the text mask.",[5864,9277,9278,9283,9287,9292],{},[5885,9279,9280],{},[894,9281,9282],{},"fontFamily",[5885,9284,9285],{},[894,9286,5894],{},[5885,9288,9289],{},[894,9290,9291],{},"\"sans-serif\"",[5885,9293,9294],{},"Font family for the text mask.",[3549,9296,9297],{"v-slot:credits":613},[751,9298,9299,9304],{},[754,9300,5929,9301,6725],{},[696,9302,5940],{"href":5938,"rel":9303},[700],[754,9305,6969,9306,880],{},[696,9307,9310],{"href":9308,"rel":9309},"https://magicui.design/docs/components/video-text",[700],"Magic UI's Video Text",{"title":613,"searchDepth":847,"depth":847,"links":9312},[],"A text component with a video background.",{},{"title":121,"description":9313},[1067,5952,5953,6732],"v4lABNZmoeZbMW_1zGzdSH4l3V2ElRQB5eSI9BWyRZI",{"id":9319,"title":125,"badge":687,"body":9320,"category":5947,"description":9545,"extension":856,"links":687,"meta":9546,"navigation":859,"path":126,"seo":9547,"stem":127,"tags":9548,"__hash__":9549},"docs_en/en/2.components/backgrounds/vortex.md",{"type":689,"value":9321,"toc":9543},[9322],[5728,9323,9329,9528],{":component-files":9324,"component-id":9325,"config":9326,"demo-file":9327,"dependencies":9328},"[\"Vortex.vue\"]","vortex","VortexConfig","VortexDemo.vue","simplex-noise",[3549,9330,9331,9333],{"v-slot:api":613},[882,9332,5856],{"id":5855},[5858,9334,9335,9347],{},[5861,9336,9337],{},[5864,9338,9339,9341,9343,9345],{},[5867,9340,5869],{},[5867,9342,5872],{},[5867,9344,5875],{},[5867,9346,5878],{},[5880,9348,9349,9364,9380,9398,9416,9435,9454,9473,9491,9509],{},[5864,9350,9351,9355,9359,9361],{},[5885,9352,9353],{},[894,9354,5889],{},[5885,9356,9357],{},[894,9358,5894],{},[5885,9360],{},[5885,9362,9363],{},"Optional className for styling the children wrapper.",[5864,9365,9366,9371,9375,9377],{},[5885,9367,9368],{},[894,9369,9370],{},"containerClass",[5885,9372,9373],{},[894,9374,5894],{},[5885,9376],{},[5885,9378,9379],{},"Optional className for styling the container.",[5864,9381,9382,9386,9390,9395],{},[5885,9383,9384],{},[894,9385,7238],{},[5885,9387,9388],{},[894,9389,6016],{},[5885,9391,9392],{},[894,9393,9394],{},"700",[5885,9396,9397],{},"Number of particles to be generated.",[5864,9399,9400,9405,9409,9413],{},[5885,9401,9402],{},[894,9403,9404],{},"rangeY",[5885,9406,9407],{},[894,9408,6016],{},[5885,9410,9411],{},[894,9412,7337],{},[5885,9414,9415],{},"Vertical range for particle movement.",[5864,9417,9418,9423,9427,9432],{},[5885,9419,9420],{},[894,9421,9422],{},"baseHue",[5885,9424,9425],{},[894,9426,6016],{},[5885,9428,9429],{},[894,9430,9431],{},"220",[5885,9433,9434],{},"Base hue for particle color.",[5864,9436,9437,9442,9446,9451],{},[5885,9438,9439],{},[894,9440,9441],{},"baseSpeed",[5885,9443,9444],{},[894,9445,6016],{},[5885,9447,9448],{},[894,9449,9450],{},"0.0",[5885,9452,9453],{},"Base speed for particle movement.",[5864,9455,9456,9461,9465,9470],{},[5885,9457,9458],{},[894,9459,9460],{},"rangeSpeed",[5885,9462,9463],{},[894,9464,6016],{},[5885,9466,9467],{},[894,9468,9469],{},"1.5",[5885,9471,9472],{},"Range of speed variation for particles.",[5864,9474,9475,9480,9484,9488],{},[5885,9476,9477],{},[894,9478,9479],{},"baseRadius",[5885,9481,9482],{},[894,9483,6016],{},[5885,9485,9486],{},[894,9487,1758],{},[5885,9489,9490],{},"Base radius of particles.",[5864,9492,9493,9498,9502,9506],{},[5885,9494,9495],{},[894,9496,9497],{},"rangeRadius",[5885,9499,9500],{},[894,9501,6016],{},[5885,9503,9504],{},[894,9505,7938],{},[5885,9507,9508],{},"Range of radius variation for particles.",[5864,9510,9511,9516,9520,9525],{},[5885,9512,9513],{},[894,9514,9515],{},"backgroundColor",[5885,9517,9518],{},[894,9519,5894],{},[5885,9521,9522],{},[894,9523,9524],{},"\"#000000\"",[5885,9526,9527],{},"Background color of the canvas.",[3549,9529,9530],{"v-slot:credits":613},[751,9531,9532,9538],{},[754,9533,5929,9534,880],{},[696,9535,719],{"href":9536,"rel":9537},"https://ui.aceternity.com/components/vortex",[700],[754,9539,5929,9540,5941],{},[696,9541,5940],{"href":5938,"rel":9542},[700],{"title":613,"searchDepth":847,"depth":847,"links":9544},[],"A wavy, swirly, vortex background ideal for CTAs and backgrounds.",{},{"title":125,"description":9545},[1067,5952,5953,5954,1023,9328],"RTbPHT9LhNtC5XIfFriEPaAfIQpc6LwYy854MhivLq0",{"id":9551,"title":129,"badge":687,"body":9552,"category":5947,"description":9726,"extension":856,"links":687,"meta":9727,"navigation":859,"path":130,"seo":9728,"stem":131,"tags":9729,"__hash__":9730},"docs_en/en/2.components/backgrounds/warp-background.md",{"type":689,"value":9553,"toc":9724},[9554],[5728,9555,9560,9708],{":component-files":9556,"component-id":9557,"config":9558,"demo-file":9559},"[\"WarpBackground.vue\", \"Beam.vue\"]","warp-background","WarpBackgroundConfig","WarpBackgroundDemo.vue",[3549,9561,9562,9564],{"v-slot:api":613},[882,9563,5856],{"id":5855},[5858,9565,9566,9578],{},[5861,9567,9568],{},[5864,9569,9570,9572,9574,9576],{},[5867,9571,5869],{},[5867,9573,5872],{},[5867,9575,5875],{},[5867,9577,5878],{},[5880,9579,9580,9598,9616,9635,9653,9671,9689],{},[5864,9581,9582,9587,9591,9595],{},[5885,9583,9584],{},[894,9585,9586],{},"perspective",[5885,9588,9589],{},[894,9590,6016],{},[5885,9592,9593],{},[894,9594,7337],{},[5885,9596,9597],{},"The perspective of the warp animation",[5864,9599,9600,9605,9609,9613],{},[5885,9601,9602],{},[894,9603,9604],{},"beamsPerSide",[5885,9606,9607],{},[894,9608,6016],{},[5885,9610,9611],{},[894,9612,8255],{},[5885,9614,9615],{},"The number of beams per side",[5864,9617,9618,9623,9627,9632],{},[5885,9619,9620],{},[894,9621,9622],{},"beamSize",[5885,9624,9625],{},[894,9626,6016],{},[5885,9628,9629],{},[894,9630,9631],{},"5",[5885,9633,9634],{},"The size of the beams",[5864,9636,9637,9642,9646,9650],{},[5885,9638,9639],{},[894,9640,9641],{},"beamDelayMax",[5885,9643,9644],{},[894,9645,6016],{},[5885,9647,9648],{},[894,9649,8255],{},[5885,9651,9652],{},"The maximum delay of the beams in seconds",[5864,9654,9655,9660,9664,9668],{},[5885,9656,9657],{},[894,9658,9659],{},"beamDelayMin",[5885,9661,9662],{},[894,9663,6016],{},[5885,9665,9666],{},[894,9667,6157],{},[5885,9669,9670],{},"The minimum delay of the beams in seconds",[5864,9672,9673,9678,9682,9686],{},[5885,9674,9675],{},[894,9676,9677],{},"beamDuration",[5885,9679,9680],{},[894,9681,6016],{},[5885,9683,9684],{},[894,9685,8255],{},[5885,9687,9688],{},"The duration of the beams",[5864,9690,9691,9696,9700,9705],{},[5885,9692,9693],{},[894,9694,9695],{},"gridColor",[5885,9697,9698],{},[894,9699,5894],{},[5885,9701,9702],{},[894,9703,9704],{},"\"hsl(var(--border))\"",[5885,9706,9707],{},"The color of the grid lines",[3549,9709,9710],{"v-slot:credits":613},[751,9711,9712,9717],{},[754,9713,5929,9714,6725],{},[696,9715,8882],{"href":8880,"rel":9716},[700],[754,9718,6435,9719,880],{},[696,9720,9723],{"href":9721,"rel":9722},"https://magicui.design/docs/components/warp-background",[700],"Magic UI WarpBackground",{"title":613,"searchDepth":847,"depth":847,"links":9725},[],"A container component that applies a warp animation effect to its children",{},{"title":129,"description":9726},[1067,5952,5953,6732],"CcSvuo4M1YBAs4XObOiUJvWiHlV7TJM_frMpiEAWWxo",{"id":9732,"title":133,"badge":687,"body":9733,"category":5947,"description":9939,"extension":856,"links":687,"meta":9940,"navigation":859,"path":134,"seo":9941,"stem":135,"tags":9942,"__hash__":9943},"docs_en/en/2.components/backgrounds/wavy-background.md",{"type":689,"value":9734,"toc":9937},[9735],[5728,9736,9741,9922],{":component-files":9737,"component-id":9738,"config":9739,"demo-file":9740,"dependencies":9328},"[\"WavyBackground.vue\"]","wavy-background","WavyBackgroundConfig","WavyBackgroundDemo.vue",[3549,9742,9743,9745],{"v-slot:api":613},[882,9744,5856],{"id":5855},[5858,9746,9747,9759],{},[5861,9748,9749],{},[5864,9750,9751,9753,9755,9757],{},[5867,9752,5869],{},[5867,9754,5872],{},[5867,9756,5875],{},[5867,9758,5878],{},[5880,9760,9761,9778,9795,9815,9833,9852,9869,9887,9904],{},[5864,9762,9763,9767,9771,9775],{},[5885,9764,9765],{},[894,9766,5889],{},[5885,9768,9769],{},[894,9770,5894],{},[5885,9772,9773],{},[894,9774,5899],{},[5885,9776,9777],{},"The content to be displayed on top of the wavy background.",[5864,9779,9780,9784,9788,9792],{},[5885,9781,9782],{},[894,9783,9370],{},[5885,9785,9786],{},[894,9787,5894],{},[5885,9789,9790],{},[894,9791,5899],{},[5885,9793,9794],{},"The CSS class to apply to the content container.",[5864,9796,9797,9802,9807,9812],{},[5885,9798,9799],{},[894,9800,9801],{},"colors",[5885,9803,9804],{},[894,9805,9806],{},"string[]",[5885,9808,9809],{},[894,9810,9811],{},"[\"#38bdf8\", \"#818cf8\", \"#c084fc\", \"#e879f9\", \"#22d3ee\"]",[5885,9813,9814],{},"The colors of the waves.",[5864,9816,9817,9822,9826,9830],{},[5885,9818,9819],{},[894,9820,9821],{},"waveWidth",[5885,9823,9824],{},[894,9825,6016],{},[5885,9827,9828],{},[894,9829,6021],{},[5885,9831,9832],{},"The width of the waves.",[5864,9834,9835,9840,9844,9849],{},[5885,9836,9837],{},[894,9838,9839],{},"backgroundFill",[5885,9841,9842],{},[894,9843,5894],{},[5885,9845,9846],{},[894,9847,9848],{},"\"black\"",[5885,9850,9851],{},"The background color.",[5864,9853,9854,9858,9862,9866],{},[5885,9855,9856],{},[894,9857,6148],{},[5885,9859,9860],{},[894,9861,6016],{},[5885,9863,9864],{},[894,9865,8850],{},[5885,9867,9868],{},"The blur effect applied to the waves.",[5864,9870,9871,9875,9880,9885],{},[5885,9872,9873],{},[894,9874,7577],{},[5885,9876,9877],{},[894,9878,9879],{},"\"slow\" | \"fast\"",[5885,9881,9882],{},[894,9883,9884],{},"\"fast\"",[5885,9886,9472],{},[5864,9888,9889,9894,9898,9902],{},[5885,9890,9891],{},[894,9892,9893],{},"waveOpacity",[5885,9895,9896],{},[894,9897,6016],{},[5885,9899,9900],{},[894,9901,6923],{},[5885,9903,9490],{},[5864,9905,9906,9911,9916,9920],{},[5885,9907,9908],{},[894,9909,9910],{},"[key: string]",[5885,9912,9913],{},[894,9914,9915],{},"any",[5885,9917,9918],{},[894,9919,5899],{},[5885,9921,9508],{},[3549,9923,9924],{"v-slot:credits":613},[751,9925,9926,9932],{},[754,9927,5929,9928,880],{},[696,9929,719],{"href":9930,"rel":9931},"https://ui.aceternity.com/components/wavy-background",[700],[754,9933,5929,9934,5941],{},[696,9935,5940],{"href":5938,"rel":9936},[700],{"title":613,"searchDepth":847,"depth":847,"links":9938},[],"A cool background effect with waves that move.",{},{"title":133,"description":9939},[1067,5952,5953,9328,5954],"P14hLGtWvrDgpzD5V26VIuvEdRed3X0E1aHswHCws5g",{"id":9945,"title":143,"badge":687,"body":9946,"category":10099,"description":10100,"extension":856,"links":687,"meta":10101,"navigation":859,"path":144,"seo":10102,"stem":145,"tags":10103,"__hash__":10105},"docs_en/en/2.components/buttons/gradient-button.md",{"type":689,"value":9947,"toc":10097},[9948],[5728,9949,9954],{":component-files":9950,"component-id":9951,"config":9952,"demo-file":9953},"[\"GradientButton.vue\"]","gradient-button","GradientButtonConfig","GradientButtonDemo.vue",[3549,9955,9956,9958],{"v-slot:api":613},[882,9957,5856],{"id":5855},[5858,9959,9960,9972],{},[5861,9961,9962],{},[5864,9963,9964,9966,9968,9970],{},[5867,9965,5869],{},[5867,9967,5872],{},[5867,9969,5875],{},[5867,9971,5878],{},[5880,9973,9974,9992,10008,10026,10045,10062,10078],{},[5864,9975,9976,9981,9985,9989],{},[5885,9977,9978],{},[894,9979,9980],{},"borderWidth",[5885,9982,9983],{},[894,9984,6016],{},[5885,9986,9987],{},[894,9988,7938],{},[5885,9990,9991],{},"Width of the gradient border in pixels.",[5864,9993,9994,9998,10002,10005],{},[5885,9995,9996],{},[894,9997,9801],{},[5885,9999,10000],{},[894,10001,9806],{},[5885,10003,10004],{},"Rainbow Colors Array",[5885,10006,10007],{},"Array of colors used in the conic gradient border.",[5864,10009,10010,10014,10018,10023],{},[5885,10011,10012],{},[894,10013,6933],{},[5885,10015,10016],{},[894,10017,6016],{},[5885,10019,10020],{},[894,10021,10022],{},"2500",[5885,10024,10025],{},"Duration of the gradient rotation animation in milliseconds.",[5864,10027,10028,10033,10037,10042],{},[5885,10029,10030],{},[894,10031,10032],{},"borderRadius",[5885,10034,10035],{},[894,10036,6016],{},[5885,10038,10039],{},[894,10040,10041],{},"8",[5885,10043,10044],{},"Border radius for rounded corners in pixels.",[5864,10046,10047,10051,10055,10059],{},[5885,10048,10049],{},[894,10050,6148],{},[5885,10052,10053],{},[894,10054,6016],{},[5885,10056,10057],{},[894,10058,6236],{},[5885,10060,10061],{},"Blur intensity of the gradient border effect in pixels.",[5864,10063,10064,10068,10072,10076],{},[5885,10065,10066],{},[894,10067,5889],{},[5885,10069,10070],{},[894,10071,5894],{},[5885,10073,10074],{},[894,10075,6077],{},[5885,10077,6962],{},[5864,10079,10080,10085,10089,10094],{},[5885,10081,10082],{},[894,10083,10084],{},"bgColor",[5885,10086,10087],{},[894,10088,5894],{},[5885,10090,10091],{},[894,10092,10093],{},"\"#000\"",[5885,10095,10096],{},"Background color of the button content.",{"title":613,"searchDepth":847,"depth":847,"links":10098},[],"Button","A stylish animated button with a rotating conic gradient border and customizable properties for a vibrant look.",{},{"title":143,"description":10100},[1067,5952,10104],"button","VXhZrbwHrt61NEmKpjzIJoYjeteZyYhdoKN949wZA-g",{"id":10107,"title":147,"badge":687,"body":10108,"category":10099,"description":10188,"extension":856,"links":687,"meta":10189,"navigation":859,"path":148,"seo":10190,"stem":149,"tags":10191,"__hash__":10192},"docs_en/en/2.components/buttons/interactive-hover-button.md",{"type":689,"value":10109,"toc":10186},[10110],[5728,10111,10116,10170],{":component-files":10112,"component-id":10113,"config":10114,"demo-file":10115},"[\"InteractiveHoverButton.vue\"]","interactive-hover-button","InteractiveHoverButtonConfig","InteractiveHoverButtonDemo.vue",[3549,10117,10118,10120],{"v-slot:api":613},[882,10119,5856],{"id":5855},[5858,10121,10122,10134],{},[5861,10123,10124],{},[5864,10125,10126,10128,10130,10132],{},[5867,10127,5869],{},[5867,10129,5872],{},[5867,10131,5875],{},[5867,10133,5878],{},[5880,10135,10136,10154],{},[5864,10137,10138,10143,10147,10151],{},[5885,10139,10140],{},[894,10141,10142],{},"text",[5885,10144,10145],{},[894,10146,5894],{},[5885,10148,10149],{},[894,10150,10099],{},[5885,10152,10153],{},"The text to be displayed inside the button.",[5864,10155,10156,10160,10164,10168],{},[5885,10157,10158],{},[894,10159,5889],{},[5885,10161,10162],{},[894,10163,5894],{},[5885,10165,10166],{},[894,10167,6077],{},[5885,10169,8834],{},[3549,10171,10172],{"v-slot:credits":613},[751,10173,10174,10179],{},[754,10175,5929,10176,6725],{},[696,10177,8882],{"href":8880,"rel":10178},[700],[754,10180,6435,10181,880],{},[696,10182,10185],{"href":10183,"rel":10184},"https://magicui.design/docs/components/interactive-hover-button",[700],"Magic UI Interactive Hover Button",{"title":613,"searchDepth":847,"depth":847,"links":10187},[],"A visually engaging button component that responds to hover with dynamic transitions, adapting smoothly between light and dark modes for enhanced user interactivity.",{},{"title":147,"description":10188},[1067,5952,10104,6732],"_bL4tS1lxhPFH6PUShrMUPsI1d7qELmr8li4FsfdC5M",{"id":10194,"title":151,"badge":687,"body":10195,"category":10099,"description":10295,"extension":856,"links":687,"meta":10296,"navigation":859,"path":152,"seo":10297,"stem":153,"tags":10298,"__hash__":10299},"docs_en/en/2.components/buttons/rainbow-button.md",{"type":689,"value":10196,"toc":10293},[10197],[5728,10198,10203,10276],{":component-files":10199,"component-id":10200,"config":10201,"demo-file":10202},"[\"RainbowButton.vue\"]","rainbow-button","RainbowButtonConfig","RainbowButtonDemo.vue",[3549,10204,10205,10207],{"v-slot:api":613},[882,10206,5856],{"id":5855},[5858,10208,10209,10221],{},[5861,10210,10211],{},[5864,10212,10213,10215,10217,10219],{},[5867,10214,5869],{},[5867,10216,5872],{},[5867,10218,5875],{},[5867,10220,5878],{},[5880,10222,10223,10240,10259],{},[5864,10224,10225,10229,10233,10237],{},[5885,10226,10227],{},[894,10228,5889],{},[5885,10230,10231],{},[894,10232,5894],{},[5885,10234,10235],{},[894,10236,6077],{},[5885,10238,10239],{},"Additional CSS classes to apply to the button.",[5864,10241,10242,10247,10251,10256],{},[5885,10243,10244],{},[894,10245,10246],{},"is",[5885,10248,10249],{},[894,10250,5894],{},[5885,10252,10253],{},[894,10254,10255],{},"\"button\"",[5885,10257,10258],{},"The HTML tag to render for the component.",[5864,10260,10261,10265,10269,10273],{},[5885,10262,10263],{},[894,10264,7577],{},[5885,10266,10267],{},[894,10268,6016],{},[5885,10270,10271],{},[894,10272,7938],{},[5885,10274,10275],{},"Duration of the animation in seconds.",[3549,10277,10278],{"v-slot:credits":613},[751,10279,10280,10287],{},[754,10281,5929,10282,5941],{},[696,10283,10286],{"href":10284,"rel":10285},"https://github.com/Grzechu335",[700],"Grzegorz Krol",[754,10288,5929,10289,880],{},[696,10290,725],{"href":10291,"rel":10292},"https://magicui.design/docs/components/rainbow-button",[700],{"title":613,"searchDepth":847,"depth":847,"links":10294},[],"A rainbow effect on button.",{},{"title":151,"description":10295},[1067,5952,10104,6732],"vH1JewCKoABhcZhdTHuUJM9pjn_61ugViChW7_mq9YY",{"id":10301,"title":155,"badge":687,"body":10302,"category":10099,"description":10433,"extension":856,"links":687,"meta":10434,"navigation":859,"path":156,"seo":10435,"stem":157,"tags":10436,"__hash__":10437},"docs_en/en/2.components/buttons/ripple-button.md",{"type":689,"value":10303,"toc":10431},[10304],[5728,10305,10310,10415],{":component-files":10306,"component-id":10307,"config":10308,"demo-file":10309},"[\"RippleButton.vue\"]","ripple-button","RippleButtonConfig","RippleButtonDemo.vue",[3549,10311,10312,10314,10381,10385],{"v-slot:api":613},[882,10313,5856],{"id":5855},[5858,10315,10316,10328],{},[5861,10317,10318],{},[5864,10319,10320,10322,10324,10326],{},[5867,10321,5869],{},[5867,10323,5872],{},[5867,10325,5875],{},[5867,10327,5878],{},[5880,10329,10330,10344,10363],{},[5864,10331,10332,10336,10340,10342],{},[5885,10333,10334],{},[894,10335,5889],{},[5885,10337,10338],{},[894,10339,5894],{},[5885,10341,5899],{},[5885,10343,6962],{},[5864,10345,10346,10351,10355,10360],{},[5885,10347,10348],{},[894,10349,10350],{},"rippleColor",[5885,10352,10353],{},[894,10354,5894],{},[5885,10356,10357],{},[894,10358,10359],{},"\"#ADD8E6\"",[5885,10361,10362],{},"Color of the ripple effect.",[5864,10364,10365,10369,10373,10378],{},[5885,10366,10367],{},[894,10368,6933],{},[5885,10370,10371],{},[894,10372,6016],{},[5885,10374,10375],{},[894,10376,10377],{},"600",[5885,10379,10380],{},"Duration of the ripple animation in milliseconds.",[882,10382,10384],{"id":10383},"emits","Emits",[5858,10386,10387,10398],{},[5861,10388,10389],{},[5864,10390,10391,10394,10396],{},[5867,10392,10393],{},"Event Name",[5867,10395,5872],{},[5867,10397,5878],{},[5880,10399,10400],{},[5864,10401,10402,10407,10412],{},[5885,10403,10404],{},[894,10405,10406],{},"click",[5885,10408,10409],{},[894,10410,10411],{},"event",[5885,10413,10414],{},"Click event",[3549,10416,10417],{"v-slot:credits":613},[751,10418,10419,10426],{},[754,10420,6857,10421,7616],{},[696,10422,10425],{"href":10423,"rel":10424},"https://magicui.design/docs/components/ripple-button",[700],"Magic UI's Ripple Button",[754,10427,5929,10428,5941],{},[696,10429,6869],{"href":6867,"rel":10430},[700],{"title":613,"searchDepth":847,"depth":847,"links":10432},[],"A stylish ripple button component with customizable colors and animation duration.",{},{"title":155,"description":10433},[1067,5952,10104,6732],"GsowR_-NrgGdZtTSQcnvk5nr0Chu2BB7YWS9yyA-7K8",{"id":10439,"title":159,"badge":687,"body":10440,"category":10099,"description":10590,"extension":856,"links":687,"meta":10591,"navigation":859,"path":160,"seo":10592,"stem":161,"tags":10593,"__hash__":10594},"docs_en/en/2.components/buttons/shimmer-button.md",{"type":689,"value":10441,"toc":10588},[10442],[5728,10443,10448,10577],{":component-files":10444,"component-id":10445,"config":10446,"demo-file":10447},"[\"ShimmerButton.vue\"]","shimmer-button","ShimmerButtonConfig","ShimmerButtonDemo.vue",[3549,10449,10450,10452],{"v-slot:api":613},[882,10451,5856],{"id":5855},[5858,10453,10454,10466],{},[5861,10455,10456],{},[5864,10457,10458,10460,10462,10464],{},[5867,10459,5869],{},[5867,10461,5872],{},[5867,10463,5875],{},[5867,10465,5878],{},[5880,10467,10468,10484,10503,10522,10540,10559],{},[5864,10469,10470,10474,10478,10482],{},[5885,10471,10472],{},[894,10473,5889],{},[5885,10475,10476],{},[894,10477,5894],{},[5885,10479,10480],{},[894,10481,6077],{},[5885,10483,10239],{},[5864,10485,10486,10491,10495,10500],{},[5885,10487,10488],{},[894,10489,10490],{},"shimmerColor",[5885,10492,10493],{},[894,10494,5894],{},[5885,10496,10497],{},[894,10498,10499],{},"\"#ffffff\"",[5885,10501,10502],{},"Color of the shimmer effect.",[5864,10504,10505,10510,10514,10519],{},[5885,10506,10507],{},[894,10508,10509],{},"shimmerSize",[5885,10511,10512],{},[894,10513,5894],{},[5885,10515,10516],{},[894,10517,10518],{},"\"0.05em\"",[5885,10520,10521],{},"Size of the shimmer effect.",[5864,10523,10524,10528,10532,10537],{},[5885,10525,10526],{},[894,10527,10032],{},[5885,10529,10530],{},[894,10531,5894],{},[5885,10533,10534],{},[894,10535,10536],{},"\"100px\"",[5885,10538,10539],{},"Border radius of the button.",[5864,10541,10542,10547,10551,10556],{},[5885,10543,10544],{},[894,10545,10546],{},"shimmerDuration",[5885,10548,10549],{},[894,10550,5894],{},[5885,10552,10553],{},[894,10554,10555],{},"\"3s\"",[5885,10557,10558],{},"Duration of the shimmer animation.",[5864,10560,10561,10565,10569,10574],{},[5885,10562,10563],{},[894,10564,5953],{},[5885,10566,10567],{},[894,10568,5894],{},[5885,10570,10571],{},[894,10572,10573],{},"\"rgba(0, 0, 0, 1)\"",[5885,10575,10576],{},"Background color of the button. Can be rgb or hex code.",[3549,10578,10579],{"v-slot:credits":613},[751,10580,10581],{},[754,10582,6969,10583,880],{},[696,10584,10587],{"href":10585,"rel":10586},"https://magicui.design/docs/components/shimmer-button",[700],"Magic UI Shimmer Button",{"title":613,"searchDepth":847,"depth":847,"links":10589},[],"A button with a shimmering animated effect.",{},{"title":159,"description":10590},[1067,5952,10104,6732],"xDipOjku9e5Vsx-yRcVqRIOF8_-EvIcjDBR7q5t4Hr4",{"id":10596,"title":168,"badge":687,"body":10597,"category":10920,"description":10921,"extension":856,"links":687,"meta":10922,"navigation":859,"path":169,"seo":10923,"stem":170,"tags":10924,"__hash__":10926},"docs_en/en/2.components/cards/3d-card.md",{"type":689,"value":10598,"toc":10918},[10599],[5728,10600,10605,10911],{":component-files":10601,"component-id":10602,"config":10603,"demo-file":10604},"[\"CardContainer.vue\", \"CardBody.vue\", \"CardItem.vue\", \"useMouseState.ts\"]","card-3d","Card3dConfig","CardDemo.vue",[3549,10606,10607,10609,10615,10621,10624,10670,10672,10678,10686,10689,10720,10722,10728,10733,10736,10880,10882],{"v-slot:api":613},[882,10608,5856],{"id":5855},[728,10610,10612],{"id":10611},"cardcontainer",[894,10613,10614],{},"CardContainer",[692,10616,10617,10618,10620],{},"The ",[894,10619,10614],{}," component serves as a wrapper for the 3D card effect. It manages mouse events to create a 3D perspective.",[3097,10622,3696],{"id":10623},"props",[5858,10625,10626,10638],{},[5861,10627,10628],{},[5864,10629,10630,10632,10634,10636],{},[5867,10631,5869],{},[5867,10633,5872],{},[5867,10635,5875],{},[5867,10637,5878],{},[5880,10639,10640,10655],{},[5864,10641,10642,10646,10648,10652],{},[5885,10643,10644],{},[894,10645,5889],{},[5885,10647,5894],{},[5885,10649,10650],{},[894,10651,8291],{},[5885,10653,10654],{},"Additional classes for styling the inner container element.",[5864,10656,10657,10661,10663,10667],{},[5885,10658,10659],{},[894,10660,9370],{},[5885,10662,5894],{},[5885,10664,10665],{},[894,10666,8291],{},[5885,10668,10669],{},"Additional classes for styling the outer container element.",[2973,10671],{},[728,10673,10675],{"id":10674},"cardbody",[894,10676,10677],{},"CardBody",[692,10679,10617,10680,10682,10683,10685],{},[894,10681,10677],{}," component is a flexible container with preserved 3D styling. It is intended to be used within a ",[894,10684,10614],{}," to hold content with a 3D transformation effect.",[3097,10687,3696],{"id":10688},"props-1",[5858,10690,10691,10703],{},[5861,10692,10693],{},[5864,10694,10695,10697,10699,10701],{},[5867,10696,5869],{},[5867,10698,5872],{},[5867,10700,5875],{},[5867,10702,5878],{},[5880,10704,10705],{},[5864,10706,10707,10711,10713,10717],{},[5885,10708,10709],{},[894,10710,5889],{},[5885,10712,5894],{},[5885,10714,10715],{},[894,10716,8291],{},[5885,10718,10719],{},"Additional classes for custom styling.",[2973,10721],{},[728,10723,10725],{"id":10724},"carditem",[894,10726,10727],{},"CardItem",[692,10729,10617,10730,10732],{},[894,10731,10727],{}," component represents individual items within the 3D card. It supports various transformations (translation and rotation) to create dynamic 3D effects.",[3097,10734,3696],{"id":10735},"props-2",[5858,10737,10738,10750],{},[5861,10739,10740],{},[5864,10741,10742,10744,10746,10748],{},[5867,10743,5869],{},[5867,10745,5872],{},[5867,10747,5875],{},[5867,10749,5878],{},[5880,10751,10752,10769,10784,10800,10816,10832,10848,10864],{},[5864,10753,10754,10759,10761,10766],{},[5885,10755,10756],{},[894,10757,10758],{},"as",[5885,10760,5894],{},[5885,10762,10763],{},[894,10764,10765],{},"\"div\"",[5885,10767,10768],{},"The HTML tag or component to use for the item.",[5864,10770,10771,10775,10777,10781],{},[5885,10772,10773],{},[894,10774,5889],{},[5885,10776,5894],{},[5885,10778,10779],{},[894,10780,8291],{},[5885,10782,10783],{},"Additional classes for styling the item.",[5864,10785,10786,10791,10793,10797],{},[5885,10787,10788],{},[894,10789,10790],{},"translateX",[5885,10792,5894],{},[5885,10794,10795],{},[894,10796,6157],{},[5885,10798,10799],{},"X-axis translation in pixels.",[5864,10801,10802,10807,10809,10813],{},[5885,10803,10804],{},[894,10805,10806],{},"translateY",[5885,10808,5894],{},[5885,10810,10811],{},[894,10812,6157],{},[5885,10814,10815],{},"Y-axis translation in pixels.",[5864,10817,10818,10823,10825,10829],{},[5885,10819,10820],{},[894,10821,10822],{},"translateZ",[5885,10824,5894],{},[5885,10826,10827],{},[894,10828,6157],{},[5885,10830,10831],{},"Z-axis translation in pixels, used to control the depth effect.",[5864,10833,10834,10839,10841,10845],{},[5885,10835,10836],{},[894,10837,10838],{},"rotateX",[5885,10840,5894],{},[5885,10842,10843],{},[894,10844,6157],{},[5885,10846,10847],{},"X-axis rotation in degrees.",[5864,10849,10850,10855,10857,10861],{},[5885,10851,10852],{},[894,10853,10854],{},"rotateY",[5885,10856,5894],{},[5885,10858,10859],{},[894,10860,6157],{},[5885,10862,10863],{},"Y-axis rotation in degrees.",[5864,10865,10866,10871,10873,10877],{},[5885,10867,10868],{},[894,10869,10870],{},"rotateZ",[5885,10872,5894],{},[5885,10874,10875],{},[894,10876,6157],{},[5885,10878,10879],{},"Z-axis rotation in degrees.",[2973,10881],{},[7129,10883,10884,10893],{},[692,10885,10886,10887],{},"💡 ",[702,10888,10889],{},[10890,10891,10892],"em",{},"Important Note:",[692,10894,10895,10896,10898,10899,10902,10903,10906,10907,10910],{},"If you are using ",[894,10897,10727],{}," inside a ",[894,10900,10901],{},"div",", add ",[894,10904,10905],{},"style=\"transform-style: preserve-3d;\""," to the div to make ",[894,10908,10909],{},"translate-z"," prop to work.",[3549,10912,10913],{"v-slot:credits":613},[751,10914,10915],{},[754,10916,10917],{},"Ported from Aceternity UI 3D Card Component.",{"title":613,"searchDepth":847,"depth":847,"links":10919},[],"Card","A card perspective effect, hover over the card to elevate card elements.",{},{"title":168,"description":10921},[1067,5952,10925,5954],"card","oOZRcxeGcwOy_NZiTjcHeq-2y6nuwymQQeuzDaBIIsU",{"id":10928,"title":172,"badge":687,"body":10929,"category":10920,"description":11392,"extension":856,"links":687,"meta":11393,"navigation":859,"path":173,"seo":11394,"stem":174,"tags":11395,"__hash__":11396},"docs_en/en/2.components/cards/apple-card-carousel.md",{"type":689,"value":10930,"toc":11390},[10931],[5728,10932,10937,11379],{":component-files":10933,"component-id":10934,"config":10935,"demo-file":10936},"[\"AppleCardCarousel.vue\", \"AppleCarouselItem.vue\", \"AppleCard.vue\", \"AppleBlurImage.vue\", \"AppleCarouselContext.ts\"]","apple-card-carousel","AppleCardCarouselConfig","AppleCardCarouselDemo.vue",[3549,10938,10939,10945,11003,11006,11008,11013,11048,11052,11060,11062,11067,11069,11074,11107,11110,11118,11120,11125,11199,11202,11209,11212,11221,11223,11228,11366,11377],{"v-slot:api":613},[692,10940,10617,10941,10944],{},[702,10942,10943],{},"Apple Carousel"," suite is composed of four inter‑related components:",[5858,10946,10947,10957],{},[5861,10948,10949],{},[5864,10950,10951,10954],{},[5867,10952,10953],{},"Component",[5867,10955,10956],{},"Purpose",[5880,10958,10959,10969,10979,10989],{},[5864,10960,10961,10966],{},[5885,10962,10963],{},[894,10964,10965],{},"AppleCardCarousel",[5885,10967,10968],{},"The horizontal scroll container with left / right controls.",[5864,10970,10971,10976],{},[5885,10972,10973],{},[894,10974,10975],{},"AppleCarouselItem",[5885,10977,10978],{},"A wrapper that adds enter‑animation and spacing to each card.",[5864,10980,10981,10986],{},[5885,10982,10983],{},[894,10984,10985],{},"AppleCard",[5885,10987,10988],{},"A richly styled, clickable card that can expand into a fullscreen modal.",[5864,10990,10991,10996],{},[5885,10992,10993],{},[894,10994,10995],{},"AppleBlurImage",[5885,10997,10998,10999,11002],{},"An ",[894,11000,11001],{},"\u003Cimg>"," replacement that starts blurred until the image loads.",[692,11004,11005],{},"Together they reproduce the interactive “App Store / Apple TV” browsing experience.",[2973,11007],{},[882,11009,11011],{"id":11010},"applecardcarousel",[894,11012,10965],{},[5858,11014,11015,11028],{},[5861,11016,11017],{},[5864,11018,11019,11022,11024,11026],{},[5867,11020,11021],{},"Prop",[5867,11023,5872],{},[5867,11025,5875],{},[5867,11027,5878],{},[5880,11029,11030],{},[5864,11031,11032,11037,11041,11045],{},[5885,11033,11034],{},[894,11035,11036],{},"initialScroll",[5885,11038,11039],{},[894,11040,6016],{},[5885,11042,11043],{},[894,11044,6157],{},[5885,11046,11047],{},"Horizontal scroll offset applied on mount (in px).",[728,11049,11051],{"id":11050},"slots","Slots",[692,11053,11054,11055,11059],{},"The default slot should contain one or more ",[702,11056,11057],{},[894,11058,10975],{}," components.",[728,11061,10384],{"id":10383},[692,11063,11064],{},[10890,11065,11066],{},"No custom events.",[2973,11068],{},[882,11070,11072],{"id":11071},"applecarouselitem",[894,11073,10975],{},[5858,11075,11076,11088],{},[5861,11077,11078],{},[5864,11079,11080,11082,11084,11086],{},[5867,11081,11021],{},[5867,11083,5872],{},[5867,11085,9105],{},[5867,11087,5878],{},[5880,11089,11090],{},[5864,11091,11092,11097,11101,11104],{},[5885,11093,11094],{},[894,11095,11096],{},"index",[5885,11098,11099],{},[894,11100,6016],{},[5885,11102,11103],{},"✓",[5885,11105,11106],{},"Zero‑based index; used to stagger the appear animation.",[728,11108,11051],{"id":11109},"slots-1",[692,11111,11112,11113,11117],{},"Default slot — place an ",[702,11114,11115],{},[894,11116,10985],{}," here.",[2973,11119],{},[882,11121,11123],{"id":11122},"applecard",[894,11124,10985],{},[5858,11126,11127,11141],{},[5861,11128,11129],{},[5864,11130,11131,11133,11135,11137,11139],{},[5867,11132,11021],{},[5867,11134,5872],{},[5867,11136,9105],{},[5867,11138,5875],{},[5867,11140,5878],{},[5880,11142,11143,11161,11178],{},[5864,11144,11145,11149,11154,11156,11158],{},[5885,11146,11147],{},[894,11148,10925],{},[5885,11150,11151],{},[894,11152,11153],{},"{ src: string; title: string; category: string }",[5885,11155,11103],{},[5885,11157,7124],{},[5885,11159,11160],{},"Data object for the card.",[5864,11162,11163,11167,11171,11173,11175],{},[5885,11164,11165],{},[894,11166,11096],{},[5885,11168,11169],{},[894,11170,6016],{},[5885,11172,11103],{},[5885,11174,7124],{},[5885,11176,11177],{},"Position within the carousel.",[5864,11179,11180,11185,11189,11192,11196],{},[5885,11181,11182],{},[894,11183,11184],{},"layout",[5885,11186,11187],{},[894,11188,5914],{},[5885,11190,11191],{},"✕",[5885,11193,11194],{},[894,11195,7446],{},[5885,11197,11198],{},"Enables shared‑layout FLIP animation.",[728,11200,11051],{"id":11201},"slots-2",[692,11203,11204,11205,11208],{},"When the card is ",[702,11206,11207],{},"expanded"," (modal open) the default slot renders inside the modal body; you can inject extended content such as text, images, or videos.",[728,11210,10384],{"id":11211},"emits-1",[692,11213,11214],{},[10890,11215,11216,11217,11220],{},"No custom events (relies on injected ",[894,11218,11219],{},"CarouselKey"," context).",[2973,11222],{},[882,11224,11226],{"id":11225},"appleblurimage",[894,11227,10995],{},[5858,11229,11230,11242],{},[5861,11231,11232],{},[5864,11233,11234,11236,11238,11240],{},[5867,11235,11021],{},[5867,11237,5872],{},[5867,11239,5875],{},[5867,11241,5878],{},[5880,11243,11244,11264,11281,11303,11322,11346],{},[5864,11245,11246,11250,11254,11258],{},[5885,11247,11248],{},[894,11249,9096],{},[5885,11251,11252],{},[894,11253,5894],{},[5885,11255,11256],{},[702,11257,7124],{},[5885,11259,11260,11261],{},"Image source URL. ",[10890,11262,11263],{},"Required.",[5864,11265,11266,11271,11275,11278],{},[5885,11267,11268],{},[894,11269,11270],{},"alt",[5885,11272,11273],{},[894,11274,5894],{},[5885,11276,11277],{},"\"Background of a beautiful view\"",[5885,11279,11280],{},"Alt text.",[5864,11282,11283,11287,11292,11297],{},[5885,11284,11285],{},[894,11286,6649],{},[5885,11288,11289],{},[894,11290,11291],{},"number | string",[5885,11293,11294],{},[10890,11295,11296],{},"img natural",[5885,11298,11299,11300,880],{},"Width attribute; omitted when using ",[894,11301,11302],{},"fill",[5864,11304,11305,11309,11313,11317],{},[5885,11306,11307],{},[894,11308,6667],{},[5885,11310,11311],{},[894,11312,11291],{},[5885,11314,11315],{},[10890,11316,11296],{},[5885,11318,11319,11320,880],{},"Height attribute; omitted when using ",[894,11321,11302],{},[5864,11323,11324,11328,11332,11336],{},[5885,11325,11326],{},[894,11327,11302],{},[5885,11329,11330],{},[894,11331,5914],{},[5885,11333,11334],{},[894,11335,7446],{},[5885,11337,11338,11339,11341,11342,11345],{},"If ",[894,11340,5919],{},", sets ",[894,11343,11344],{},"width:100%; height:100%"," via utility classes.",[5864,11347,11348,11352,11356,11360],{},[5885,11349,11350],{},[894,11351,5889],{},[5885,11353,11354],{},[894,11355,5894],{},[5885,11357,11358],{},[894,11359,6077],{},[5885,11361,11362,11363,880],{},"Additional classes merged via ",[894,11364,11365],{},"cn()",[692,11367,11368,11369,11372,11373,11376],{},"When the image fires the native ",[894,11370,11371],{},"load"," event it gracefully transitions from ",[894,11374,11375],{},"blur-sm"," to no‑blur.",[2973,11378],{},[3549,11380,11381],{"v-slot:credits":613},[751,11382,11383],{},[754,11384,6969,11385,880],{},[696,11386,11389],{"href":11387,"rel":11388},"https://ui.aceternity.com/components/apple-cards-carousel",[700],"Aceternity UI Apple Card Carousel",{"title":613,"searchDepth":847,"depth":847,"links":11391},[],"A sleek, Apple‑style card carousel with blur‑loading images, modal expansion, and smooth scrolling controls.",{},{"title":172,"description":11392},[1067,5952,10925,5954],"X3Xh_2QXR4l74WHSlEa6RIPZvbc1qUKLt-RM71DBbDs",{"id":11398,"title":176,"badge":687,"body":11399,"category":10920,"description":11513,"extension":856,"links":687,"meta":11514,"navigation":859,"path":177,"seo":11515,"stem":178,"tags":11516,"__hash__":11517},"docs_en/en/2.components/cards/card-spotlight.md",{"type":689,"value":11400,"toc":11511},[11401],[5728,11402,11407,11500],{":component-files":11403,"component-id":11404,"config":11405,"demo-file":11406},"[\"CardSpotlight.vue\"]","card-spotlight","CardSpotlightConfig","CardSpotlightDemo.vue",[3549,11408,11409,11411],{"v-slot:api":613},[882,11410,5856],{"id":5855},[5858,11412,11413,11425],{},[5861,11414,11415],{},[5864,11416,11417,11419,11421,11423],{},[5867,11418,5869],{},[5867,11420,5872],{},[5867,11422,5875],{},[5867,11424,5878],{},[5880,11426,11427,11445,11464,11482],{},[5864,11428,11429,11434,11438,11442],{},[5885,11430,11431],{},[894,11432,11433],{},"gradientSize",[5885,11435,11436],{},[894,11437,6016],{},[5885,11439,11440],{},[894,11441,6513],{},[5885,11443,11444],{},"Radius in pixels of the spotlight effect.",[5864,11446,11447,11452,11456,11461],{},[5885,11448,11449],{},[894,11450,11451],{},"gradientColor",[5885,11453,11454],{},[894,11455,5894],{},[5885,11457,11458],{},[894,11459,11460],{},"'#262626'",[5885,11462,11463],{},"The color of the spotlight gradient.",[5864,11465,11466,11471,11475,11479],{},[5885,11467,11468],{},[894,11469,11470],{},"gradientOpacity",[5885,11472,11473],{},[894,11474,6016],{},[5885,11476,11477],{},[894,11478,6942],{},[5885,11480,11481],{},"The opacity level of the spotlight gradient effect.",[5864,11483,11484,11489,11493,11497],{},[5885,11485,11486],{},[894,11487,11488],{},"slotClass",[5885,11490,11491],{},[894,11492,5894],{},[5885,11494,11495],{},[894,11496,7766],{},[5885,11498,11499],{},"Class to apply to the parent container containing the slot.",[3549,11501,11502],{"v-slot:credits":613},[751,11503,11504],{},[754,11505,11506,11507,880],{},"Inspired by Magic Card component from ",[696,11508,725],{"href":11509,"rel":11510},"https://magicui.design/docs/components/magic-card",[700],{"title":613,"searchDepth":847,"depth":847,"links":11512},[],"A card component with a dynamic spotlight effect that follows the mouse cursor, enhancing visual interactivity.",{},{"title":176,"description":11513},[1067,5952,10925,6732],"iV5j9vjzwkXRZU_qf7evZKxYeXDzAPVrfUUUskmaTQk",{"id":11519,"title":180,"badge":687,"body":11520,"category":10920,"description":11635,"extension":856,"links":687,"meta":11636,"navigation":859,"path":181,"seo":11637,"stem":182,"tags":11638,"__hash__":11639},"docs_en/en/2.components/cards/direction-aware-hover.md",{"type":689,"value":11521,"toc":11633},[11522],[5728,11523,11528,11617],{":component-files":11524,"component-id":11525,"config":11526,"demo-file":11527},"[\"DirectionAwareHover.vue\"]","direction-aware-hover","DirectionAwareHoverConfig","DirectionAwareHoverDemo.vue",[3549,11529,11530,11532],{"v-slot:api":613},[882,11531,5856],{"id":5855},[5858,11533,11534,11546],{},[5861,11535,11536],{},[5864,11537,11538,11540,11542,11544],{},[5867,11539,5869],{},[5867,11541,5872],{},[5867,11543,5875],{},[5867,11545,5878],{},[5880,11547,11548,11564,11581,11599],{},[5864,11549,11550,11555,11559,11561],{},[5885,11551,11552],{},[894,11553,11554],{},"imageUrl",[5885,11556,11557],{},[894,11558,5894],{},[5885,11560,9105],{},[5885,11562,11563],{},"The URL of the image to be displayed.",[5864,11565,11566,11570,11574,11578],{},[5885,11567,11568],{},[894,11569,5889],{},[5885,11571,11572],{},[894,11573,5894],{},[5885,11575,11576],{},[894,11577,7766],{},[5885,11579,11580],{},"Additional CSS classes for the card container.",[5864,11582,11583,11588,11592,11596],{},[5885,11584,11585],{},[894,11586,11587],{},"imageClass",[5885,11589,11590],{},[894,11591,5894],{},[5885,11593,11594],{},[894,11595,7766],{},[5885,11597,11598],{},"Additional CSS classes for the image element.",[5864,11600,11601,11606,11610,11614],{},[5885,11602,11603],{},[894,11604,11605],{},"childrenClass",[5885,11607,11608],{},[894,11609,5894],{},[5885,11611,11612],{},[894,11613,7766],{},[5885,11615,11616],{},"Additional CSS classes for the content overlay.",[3549,11618,11619],{"v-slot:credits":613},[751,11620,11621,11626],{},[754,11622,5929,11623,5941],{},[696,11624,8458],{"href":8456,"rel":11625},[700],[754,11627,6969,11628],{},[696,11629,11632],{"href":11630,"rel":11631},"https://ui.aceternity.com/components/direction-aware-hover",[700],"Aceternity UI's Direction Aware Hover",{"title":613,"searchDepth":847,"depth":847,"links":11634},[],"A direction aware hover card, that displays an image with dynamic hover effects and customizable content overlay.",{},{"title":180,"description":11635},[1067,5952,10925,5954],"eK-qy4Aqnhan2SGtOnmnG-9kJifpwz2QNjdDwpDdafE",{"id":11641,"title":184,"badge":11642,"body":11643,"category":10920,"description":11848,"extension":856,"links":687,"meta":11849,"navigation":859,"path":185,"seo":11850,"stem":186,"tags":11851,"__hash__":11852},"docs_en/en/2.components/cards/fey-cards.md","New",{"type":689,"value":11644,"toc":11846},[11645],[5728,11646,11651,11836],{":component-files":11647,"component-id":11648,"config":11649,"demo-file":11650},"[\"FeyCards.vue\"]","fey-cards","FeyCardsConfig","FeyCardsDemo.vue",[3549,11652,11653,11655],{"v-slot:api":613},[882,11654,5856],{"id":5855},[5858,11656,11657,11669],{},[5861,11658,11659],{},[5864,11660,11661,11663,11665,11667],{},[5867,11662,5869],{},[5867,11664,5872],{},[5867,11666,5875],{},[5867,11668,5878],{},[5880,11670,11671,11689,11707,11725,11744,11764,11783,11801,11819],{},[5864,11672,11673,11678,11682,11686],{},[5885,11674,11675],{},[894,11676,11677],{},"imgSrc",[5885,11679,11680],{},[894,11681,9806],{},[5885,11683,11684],{},[894,11685,3932],{},[5885,11687,11688],{},"Array of image sources used for the stacked cards.",[5864,11690,11691,11696,11700,11704],{},[5885,11692,11693],{},[894,11694,11695],{},"mainImg",[5885,11697,11698],{},[894,11699,5894],{},[5885,11701,11702],{},[894,11703,5899],{},[5885,11705,11706],{},"Main image shown behind the card stack.",[5864,11708,11709,11714,11718,11722],{},[5885,11710,11711],{},[894,11712,11713],{},"idleImg",[5885,11715,11716],{},[894,11717,5894],{},[5885,11719,11720],{},[894,11721,5899],{},[5885,11723,11724],{},"Idle image shown before the hovered swap effect.",[5864,11726,11727,11732,11736,11741],{},[5885,11728,11729],{},[894,11730,11731],{},"cardSpacing",[5885,11733,11734],{},[894,11735,6016],{},[5885,11737,11738],{},[894,11739,11740],{},"32",[5885,11742,11743],{},"Horizontal spacing between stacked cards.",[5864,11745,11746,11751,11756,11761],{},[5885,11747,11748],{},[894,11749,11750],{},"spring",[5885,11752,11753],{},[894,11754,11755],{},"SpringConfig",[5885,11757,11758],{},[894,11759,11760],{},"{ type: \"spring\", visualDuration: 0.5, bounce: 0.2 }",[5885,11762,11763],{},"Motion spring configuration for the entrance and shift animations.",[5864,11765,11766,11771,11775,11780],{},[5885,11767,11768],{},[894,11769,11770],{},"shiftDistance",[5885,11772,11773],{},[894,11774,6016],{},[5885,11776,11777],{},[894,11778,11779],{},"60",[5885,11781,11782],{},"Distance cards move horizontally when a hover state is active.",[5864,11784,11785,11790,11794,11798],{},[5885,11786,11787],{},[894,11788,11789],{},"swapDuration",[5885,11791,11792],{},[894,11793,6016],{},[5885,11795,11796],{},[894,11797,6923],{},[5885,11799,11800],{},"Duration of the image swap transition in seconds.",[5864,11802,11803,11808,11812,11816],{},[5885,11804,11805],{},[894,11806,11807],{},"entranceStagger",[5885,11809,11810],{},[894,11811,6016],{},[5885,11813,11814],{},[894,11815,6407],{},[5885,11817,11818],{},"Delay between the entrance animations of each card.",[5864,11820,11821,11825,11829,11833],{},[5885,11822,11823],{},[894,11824,5889],{},[5885,11826,11827],{},[894,11828,5894],{},[5885,11830,11831],{},[894,11832,5899],{},[5885,11834,11835],{},"Additional Tailwind classes applied to the wrapper.",[3549,11837,11838],{"v-slot:credits":613},[751,11839,11840],{},[754,11841,6857,11842,880],{},[696,11843,719],{"href":11844,"rel":11845},"https://ui.aceternity.com/labs/fey-card",[700],{"title":613,"searchDepth":847,"depth":847,"links":11847},[],"An animated hover card stack with layered image swapping and a cinematic heading reveal.",{},{"title":184,"description":11848},[1067,5952,10925,5954],"MRQ8K5WfZX7CNRUQCrMilzZcAWlRgBG4aYzTJHzpZ-0",{"id":11854,"title":188,"badge":687,"body":11855,"category":10920,"description":11963,"extension":856,"links":687,"meta":11964,"navigation":859,"path":189,"seo":11965,"stem":190,"tags":11966,"__hash__":11967},"docs_en/en/2.components/cards/flip-card.md",{"type":689,"value":11856,"toc":11961},[11857],[5728,11858,11863,11952],{":component-files":11859,"component-id":11860,"config":11861,"demo-file":11862},"[\"FlipCard.vue\"]","flip-card","FlipCardConfig","FlipCardDemo.vue",[3549,11864,11865,11867,11920],{"v-slot:api":613},[882,11866,5856],{"id":5855},[5858,11868,11869,11881],{},[5861,11870,11871],{},[5864,11872,11873,11875,11877,11879],{},[5867,11874,5869],{},[5867,11876,5872],{},[5867,11878,5875],{},[5867,11880,5878],{},[5880,11882,11883,11900],{},[5864,11884,11885,11889,11893,11897],{},[5885,11886,11887],{},[894,11888,5889],{},[5885,11890,11891],{},[894,11892,5894],{},[5885,11894,11895],{},[894,11896,5899],{},[5885,11898,11899],{},"The class to be applied to the component.",[5864,11901,11902,11907,11912,11917],{},[5885,11903,11904],{},[894,11905,11906],{},"rotate",[5885,11908,11909],{},[894,11910,11911],{},"x | y",[5885,11913,11914],{},[894,11915,11916],{},"y",[5885,11918,11919],{},"You can pass the rotate value as you want.",[5858,11921,11922,11931],{},[5861,11923,11924],{},[5864,11925,11926,11929],{},[5867,11927,11928],{},"Slot Name",[5867,11930,5878],{},[5880,11932,11933,11942],{},[5864,11934,11935,11939],{},[5885,11936,11937],{},[894,11938,3785],{},[5885,11940,11941],{},"Component to show as front.",[5864,11943,11944,11949],{},[5885,11945,11946],{},[894,11947,11948],{},"back",[5885,11950,11951],{},"Component to show as back.",[3549,11953,11954],{"v-slot:credits":613},[751,11955,11956],{},[754,11957,5929,11958,6725],{},[696,11959,5940],{"href":5938,"rel":11960},[700],{"title":613,"searchDepth":847,"depth":847,"links":11962},[],"A dynamic flip card with smooth 180-degree flipping animations along both the X and Y axes, providing an engaging and interactive visual effect.",{},{"title":188,"description":11963},[1067,5952,10925],"Axa8n8besJY_9RuVH8dp7idmX3hshCsaaLAVyLX-wd4",{"id":11969,"title":192,"badge":11642,"body":11970,"category":10920,"description":12064,"extension":856,"links":687,"meta":12065,"navigation":859,"path":193,"seo":12066,"stem":194,"tags":12067,"__hash__":12070},"docs_en/en/2.components/cards/floating-card.md",{"type":689,"value":11971,"toc":12062},[11972],[5728,11973,11978,12052],{":component-files":11974,"component-id":11975,"config":11976,"demo-file":11977},"[\"FloatingCard.vue\"]","floating-card","FloatingCardConfig","FloatingCardDemo.vue",[3549,11979,11980,11982],{"v-slot:api":613},[882,11981,5856],{"id":5855},[5858,11983,11984,11996],{},[5861,11985,11986],{},[5864,11987,11988,11990,11992,11994],{},[5867,11989,5869],{},[5867,11991,5872],{},[5867,11993,5875],{},[5867,11995,5878],{},[5880,11997,11998,12017,12036],{},[5864,11999,12000,12005,12009,12014],{},[5885,12001,12002],{},[894,12003,12004],{},"rotateDepth",[5885,12006,12007],{},[894,12008,6016],{},[5885,12010,12011],{},[894,12012,12013],{},"17.5",[5885,12015,12016],{},"Maximum X/Y rotation applied while the card is hovered.",[5864,12018,12019,12024,12028,12033],{},[5885,12020,12021],{},[894,12022,12023],{},"translateDepth",[5885,12025,12026],{},[894,12027,6016],{},[5885,12029,12030],{},[894,12031,12032],{},"20",[5885,12034,12035],{},"Maximum X/Y translation applied while tracking cursor.",[5864,12037,12038,12042,12046,12050],{},[5885,12039,12040],{},[894,12041,5889],{},[5885,12043,12044],{},[894,12045,5894],{},[5885,12047,12048],{},[894,12049,5899],{},[5885,12051,11835],{},[3549,12053,12054],{"v-slot:credits":613},[751,12055,12056],{},[754,12057,6857,12058,880],{},[696,12059,719],{"href":12060,"rel":12061},"https://ui.aceternity.com/components/comet-card",[700],{"title":613,"searchDepth":847,"depth":847,"links":12063},[],"A perspective, 3D, Tilt card as seen on Perplexity Comet's website.",{},{"title":192,"description":12064},[1067,5952,10925,12068,12069,5954],"motion","3D","nEJ_96Mg5tN1uKAU5ErXhK_WnPASEFsa_k8OtdpEGf8",{"id":12072,"title":196,"badge":687,"body":12073,"category":10920,"description":12135,"extension":856,"links":687,"meta":12136,"navigation":859,"path":197,"seo":12137,"stem":198,"tags":12138,"__hash__":12139},"docs_en/en/2.components/cards/glare-card.md",{"type":689,"value":12074,"toc":12133},[12075],[5728,12076,12081,12118],{":component-files":12077,"component-id":12078,"config":12079,"demo-file":12080},"[\"GlareCard.vue\"]","glare-card","GlareCardConfig","GlareCardDemo.vue",[3549,12082,12083,12085],{"v-slot:api":613},[882,12084,5856],{"id":5855},[5858,12086,12087,12099],{},[5861,12088,12089],{},[5864,12090,12091,12093,12095,12097],{},[5867,12092,5869],{},[5867,12094,5872],{},[5867,12096,5875],{},[5867,12098,5878],{},[5880,12100,12101],{},[5864,12102,12103,12107,12111,12115],{},[5885,12104,12105],{},[894,12106,5889],{},[5885,12108,12109],{},[894,12110,5894],{},[5885,12112,12113],{},[894,12114,5899],{},[5885,12116,12117],{},"Additional Tailwind CSS class names to apply to the card.",[3549,12119,12120],{"v-slot:credits":613},[751,12121,12122,12127],{},[754,12123,5929,12124,6725],{},[696,12125,5940],{"href":5938,"rel":12126},[700],[754,12128,6176,12129,880],{},[696,12130,719],{"href":12131,"rel":12132},"https://ui.aceternity.com/components/glare-card",[700],{"title":613,"searchDepth":847,"depth":847,"links":12134},[],"A glare effect that happens on hover, as seen on Linear's website.",{},{"title":196,"description":12135},[1067,5952,10925,5954],"Hoo0BlaLRIHi6IgDDgpD_WpVb9lWxF3CXYpspWMNers",{"id":12141,"title":205,"badge":687,"body":12142,"category":12463,"description":12464,"extension":856,"links":687,"meta":12465,"navigation":859,"path":206,"seo":12466,"stem":207,"tags":12467,"__hash__":12469},"docs_en/en/2.components/cursors/fluid-cursor.md",{"type":689,"value":12143,"toc":12461},[12144],[5728,12145,12150,12447],{":component-files":12146,"component-id":12147,"config":12148,"demo-file":12149},"[\"FluidCursor.vue\"]","fluid-cursor","FluidCursorConfig","FluidCursorDemo.vue",[3549,12151,12152,12154],{"v-slot:api":613},[882,12153,5856],{"id":5855},[5858,12155,12156,12168],{},[5861,12157,12158],{},[5864,12159,12160,12162,12164,12166],{},[5867,12161,5869],{},[5867,12163,5872],{},[5867,12165,5875],{},[5867,12167,5878],{},[5880,12169,12170,12189,12208,12227,12246,12264,12283,12301,12319,12337,12356,12374,12392,12412,12430],{},[5864,12171,12172,12177,12181,12186],{},[5885,12173,12174],{},[894,12175,12176],{},"simResolution",[5885,12178,12179],{},[894,12180,6016],{},[5885,12182,12183],{},[894,12184,12185],{},"128",[5885,12187,12188],{},"Resolution for the simulation grid affecting fluid detail and performance.",[5864,12190,12191,12196,12200,12205],{},[5885,12192,12193],{},[894,12194,12195],{},"dyeResolution",[5885,12197,12198],{},[894,12199,6016],{},[5885,12201,12202],{},[894,12203,12204],{},"1440",[5885,12206,12207],{},"Resolution for the fluid dye (color) texture.",[5864,12209,12210,12215,12219,12224],{},[5885,12211,12212],{},[894,12213,12214],{},"captureResolution",[5885,12216,12217],{},[894,12218,6016],{},[5885,12220,12221],{},[894,12222,12223],{},"512",[5885,12225,12226],{},"Resolution for capturing input events.",[5864,12228,12229,12234,12238,12243],{},[5885,12230,12231],{},[894,12232,12233],{},"densityDissipation",[5885,12235,12236],{},[894,12237,6016],{},[5885,12239,12240],{},[894,12241,12242],{},"3.5",[5885,12244,12245],{},"Rate at which color density dissipates over time.",[5864,12247,12248,12253,12257,12261],{},[5885,12249,12250],{},[894,12251,12252],{},"velocityDissipation",[5885,12254,12255],{},[894,12256,6016],{},[5885,12258,12259],{},[894,12260,7938],{},[5885,12262,12263],{},"Rate at which velocity dissipates over time, affecting fluid momentum persistence.",[5864,12265,12266,12271,12275,12280],{},[5885,12267,12268],{},[894,12269,12270],{},"pressure",[5885,12272,12273],{},[894,12274,6016],{},[5885,12276,12277],{},[894,12278,12279],{},"0.1",[5885,12281,12282],{},"Pressure factor used in fluid physics calculations.",[5864,12284,12285,12290,12294,12298],{},[5885,12286,12287],{},[894,12288,12289],{},"pressureIterations",[5885,12291,12292],{},[894,12293,6016],{},[5885,12295,12296],{},[894,12297,12032],{},[5885,12299,12300],{},"Number of iterations for pressure solver accuracy.",[5864,12302,12303,12308,12312,12316],{},[5885,12304,12305],{},[894,12306,12307],{},"curl",[5885,12309,12310],{},[894,12311,6016],{},[5885,12313,12314],{},[894,12315,8255],{},[5885,12317,12318],{},"Intensity of curl/vorticity effect to enhance swirling motions.",[5864,12320,12321,12326,12330,12334],{},[5885,12322,12323],{},[894,12324,12325],{},"splatRadius",[5885,12327,12328],{},[894,12329,6016],{},[5885,12331,12332],{},[894,12333,6407],{},[5885,12335,12336],{},"Radius of the pointer's splat effect in the fluid.",[5864,12338,12339,12344,12348,12353],{},[5885,12340,12341],{},[894,12342,12343],{},"splatForce",[5885,12345,12346],{},[894,12347,6016],{},[5885,12349,12350],{},[894,12351,12352],{},"6000",[5885,12354,12355],{},"Force applied by the pointer to the fluid on interaction.",[5864,12357,12358,12363,12367,12371],{},[5885,12359,12360],{},[894,12361,12362],{},"shading",[5885,12364,12365],{},[894,12366,5914],{},[5885,12368,12369],{},[894,12370,5919],{},[5885,12372,12373],{},"Enable or disable shading effects for depth and light on fluid colors.",[5864,12375,12376,12381,12385,12389],{},[5885,12377,12378],{},[894,12379,12380],{},"colorUpdateSpeed",[5885,12382,12383],{},[894,12384,6016],{},[5885,12386,12387],{},[894,12388,8850],{},[5885,12390,12391],{},"Speed at which pointer colors update dynamically.",[5864,12393,12394,12399,12404,12409],{},[5885,12395,12396],{},[894,12397,12398],{},"backColor",[5885,12400,12401],{},[894,12402,12403],{},"object",[5885,12405,12406],{},[894,12407,12408],{},"{ r: 0.5, g: 0, b: 0 }",[5885,12410,12411],{},"Background color of the fluid in RGB format.",[5864,12413,12414,12419,12423,12427],{},[5885,12415,12416],{},[894,12417,12418],{},"transparent",[5885,12420,12421],{},[894,12422,5914],{},[5885,12424,12425],{},[894,12426,5919],{},[5885,12428,12429],{},"Whether the canvas background is transparent.",[5864,12431,12432,12436,12440,12444],{},[5885,12433,12434],{},[894,12435,5889],{},[5885,12437,12438],{},[894,12439,5894],{},[5885,12441,12442],{},[894,12443,7766],{},[5885,12445,12446],{},"Additional CSS classes for the outer container div.",[3549,12448,12449],{"v-slot:credits":613},[751,12450,12451,12458],{},[754,12452,6176,12453],{},[696,12454,12457],{"href":12455,"rel":12456},"https://cursify.vercel.app/components/fluid-cursor",[700],"Fluid Cursor by Cursify",[754,12459,12460],{},"Utilizes WebGL 1/2 context and custom GLSL shaders for fluid physics and rendering.",{"title":613,"searchDepth":847,"depth":847,"links":12462},[],"Cursor","A GPU-accelerated animated cursor trail that simulates fluid motion.",{},{"title":205,"description":12464},[1067,5952,12468,7023,7168],"cursor","hOikV0wwJfq6ZtpJBPI4IItYQUysm2Oe3QpMDhHY6Rw",{"id":12471,"title":209,"badge":687,"body":12472,"category":12463,"description":12569,"extension":856,"links":687,"meta":12570,"navigation":859,"path":210,"seo":12571,"stem":211,"tags":12572,"__hash__":12574},"docs_en/en/2.components/cursors/image-trail-cursor.md",{"type":689,"value":12473,"toc":12567},[12474],[5728,12475,12481,12550],{":component-files":12476,"component-id":12477,"config":12478,"demo-file":12479,"dependencies":12480},"[\"ImageTrailCursor.vue\", \"trail-variants.ts\"]","image-trail-cursor","ImageTrailCursorConfig","ImageTrailCursorDemo.vue","gsap",[3549,12482,12483,12485,12545],{"v-slot:api":613},[882,12484,5856],{"id":5855},[5858,12486,12487,12499],{},[5861,12488,12489],{},[5864,12490,12491,12493,12495,12497],{},[5867,12492,5869],{},[5867,12494,5872],{},[5867,12496,5875],{},[5867,12498,5878],{},[5880,12500,12501,12519],{},[5864,12502,12503,12508,12512,12516],{},[5885,12504,12505],{},[894,12506,12507],{},"images",[5885,12509,12510],{},[894,12511,9806],{},[5885,12513,12514],{},[894,12515,3932],{},[5885,12517,12518],{},"Array of image URLs to display in the trailing effect.",[5864,12520,12521,12526,12531,12536],{},[5885,12522,12523],{},[894,12524,12525],{},"variant",[5885,12527,12528],{},[894,12529,12530],{},"VariantType",[5885,12532,12533],{},[894,12534,12535],{},"\"type1\"",[5885,12537,12538,12539,12541,12542,3001],{},"Animation variant type (",[894,12540,12535],{}," through ",[894,12543,12544],{},"\"type7\"",[7129,12546,12547],{},[692,12548,12549],{},"💡 This component creates a full-width, full-height container with high z-index for cursor tracking. Each image is 190px wide with a 1.1 aspect ratio and rounded corners.",[3549,12551,12552],{"v-slot:credits":613},[751,12553,12554,12557,12560],{},[754,12555,12556],{},"Inspired by modern cursor trail effects and image hover interactions.",[754,12558,12559],{},"Built with Vue 3 Composition API for optimal reactivity and performance.",[754,12561,6969,12562],{},[696,12563,12566],{"href":12564,"rel":12565},"https://tympanus.net/codrops/2023/10/18/ideas-for-image-motion-trail-animations/",[700],"Codrops Article",{"title":613,"searchDepth":847,"depth":847,"links":12568},[],"An interactive cursor effect that creates a dynamic trail of images following mouse movement with multiple animation variants.",{},{"title":209,"description":12569},[1067,5952,12468,12573,12480],"codrops","xITIWZel6SclhwFBtdO3RIf0rlLnoYFqaTUcKdKyYJ0",{"id":12576,"title":213,"badge":687,"body":12577,"category":12463,"description":12736,"extension":856,"links":687,"meta":12737,"navigation":859,"path":214,"seo":12738,"stem":215,"tags":12739,"__hash__":12740},"docs_en/en/2.components/cursors/sleek-line-cursor.md",{"type":689,"value":12578,"toc":12733},[12579],[5728,12580,12585,12587,12712,12722],{":component-files":12581,"component-id":12582,"config":12583,"demo-file":12584},"[\"SleekLineCursor.vue\"]","sleek-line-cursor","SleekLineCursorConfig","SleekLineCursorDemo.vue",[882,12586,5856],{"id":5855},[5858,12588,12589,12601],{},[5861,12590,12591],{},[5864,12592,12593,12595,12597,12599],{},[5867,12594,5869],{},[5867,12596,5872],{},[5867,12598,5875],{},[5867,12600,5878],{},[5880,12602,12603,12621,12639,12656,12674,12693],{},[5864,12604,12605,12609,12614,12618],{},[5885,12606,12607],{},[894,12608,5889],{},[5885,12610,12611],{},[894,12612,12613],{},"string | string[]",[5885,12615,12616],{},[894,12617,7766],{},[5885,12619,12620],{},"Additional CSS classes for the canvas container element.",[5864,12622,12623,12628,12632,12636],{},[5885,12624,12625],{},[894,12626,12627],{},"trails",[5885,12629,12630],{},[894,12631,6016],{},[5885,12633,12634],{},[894,12635,12032],{},[5885,12637,12638],{},"Number of trailing lines rendered behind the cursor.",[5864,12640,12641,12645,12649,12653],{},[5885,12642,12643],{},[894,12644,7525],{},[5885,12646,12647],{},[894,12648,6016],{},[5885,12650,12651],{},[894,12652,6021],{},[5885,12654,12655],{},"Number of spring-connected nodes per trail.",[5864,12657,12658,12663,12667,12671],{},[5885,12659,12660],{},[894,12661,12662],{},"friction",[5885,12664,12665],{},[894,12666,6016],{},[5885,12668,12669],{},[894,12670,6923],{},[5885,12672,12673],{},"Global friction applied to velocity.",[5864,12675,12676,12681,12685,12690],{},[5885,12677,12678],{},[894,12679,12680],{},"dampening",[5885,12682,12683],{},[894,12684,6016],{},[5885,12686,12687],{},[894,12688,12689],{},"0.25",[5885,12691,12692],{},"Velocity damping applied between connected nodes.",[5864,12694,12695,12700,12704,12709],{},[5885,12696,12697],{},[894,12698,12699],{},"tension",[5885,12701,12702],{},[894,12703,6016],{},[5885,12705,12706],{},[894,12707,12708],{},"0.98",[5885,12710,12711],{},"Reduces spring intensity across the tail, giving a fluid tapering motion.",[7129,12713,12714],{},[692,12715,12716,12717,12719,12720,7964],{},"💡 This component uses ",[894,12718,7136],{}," and is fixed fullscreen by default. You can extend or override its styling via the ",[894,12721,5889],{},[3549,12723,12724],{"v-slot:credits":613},[751,12725,12726],{},[754,12727,6969,12728,880],{},[696,12729,12732],{"href":12730,"rel":12731},"https://cursify.vercel.app/components/canvas-cursor",[700],"Canvas Cursor by Cursify",{"title":613,"searchDepth":847,"depth":847,"links":12734},[12735],{"id":5855,"depth":847,"text":5856},"A reactive animated cursor trail with smooth wave-like motion, using spring physics and dynamic color waves.",{},{"title":213,"description":12736},[1067,5952,12468,7023,7168],"DJqaiO79yesB48ps5NJz5wwjf5goHBim1N4zWW7hfx8",{"id":12742,"title":217,"badge":687,"body":12743,"category":12463,"description":12896,"extension":856,"links":687,"meta":12897,"navigation":859,"path":218,"seo":12898,"stem":219,"tags":12899,"__hash__":12900},"docs_en/en/2.components/cursors/smooth-cursor.md",{"type":689,"value":12744,"toc":12894},[12745,12891],[5728,12746,12751,12875],{":component-files":12747,"component-id":12748,"config":12749,"demo-file":12750},"[\"SmoothCursor.vue\"]","smooth-cursor","SmoothCursorConfig","SmoothCursorDemo.vue",[3549,12752,12753,12755,12808,12812],{"v-slot:api":613},[882,12754,5856],{"id":5855},[5858,12756,12757,12769],{},[5861,12758,12759],{},[5864,12760,12761,12763,12765,12767],{},[5867,12762,5869],{},[5867,12764,5872],{},[5867,12766,5875],{},[5867,12768,5878],{},[5880,12770,12771,12789],{},[5864,12772,12773,12777,12781,12786],{},[5885,12774,12775],{},[894,12776,12468],{},[5885,12778,12779],{},[894,12780,10953],{},[5885,12782,12783],{},[894,12784,12785],{},"DefaultCursor",[5885,12787,12788],{},"Custom cursor component to replace the default cursor",[5864,12790,12791,12796,12800,12805],{},[5885,12792,12793],{},[894,12794,12795],{},"springConfig",[5885,12797,12798],{},[894,12799,11755],{},[5885,12801,12802],{},[894,12803,12804],{},"See below",[5885,12806,12807],{},"Configuration object for the spring animation behavior.",[728,12809,12811],{"id":12810},"springconfig-type","SpringConfig Type",[925,12813,12815],{"className":3124,"code":12814,"language":3126,"meta":613,"style":613},"interface springConfig {\n  damping: number;\n  stiffness: number;\n  mass: number;\n  restDelta: number;\n}\n",[894,12816,12817,12826,12838,12849,12860,12871],{"__ignoreMap":613},[934,12818,12819,12821,12824],{"class":936,"line":937},[934,12820,3861],{"class":1308},[934,12822,12823],{"class":940}," springConfig",[934,12825,1312],{"class":1078},[934,12827,12828,12831,12833,12836],{"class":936,"line":847},[934,12829,12830],{"class":3302},"  damping",[934,12832,1305],{"class":1078},[934,12834,12835],{"class":940}," number",[934,12837,1087],{"class":1078},[934,12839,12840,12843,12845,12847],{"class":936,"line":850},[934,12841,12842],{"class":3302},"  stiffness",[934,12844,1305],{"class":1078},[934,12846,12835],{"class":940},[934,12848,1087],{"class":1078},[934,12850,12851,12854,12856,12858],{"class":936,"line":1108},[934,12852,12853],{"class":3302},"  mass",[934,12855,1305],{"class":1078},[934,12857,12835],{"class":940},[934,12859,1087],{"class":1078},[934,12861,12862,12865,12867,12869],{"class":936,"line":1121},[934,12863,12864],{"class":3302},"  restDelta",[934,12866,1305],{"class":1078},[934,12868,12835],{"class":940},[934,12870,1087],{"class":1078},[934,12872,12873],{"class":936,"line":1127},[934,12874,1294],{"class":1078},[3549,12876,12877],{"v-slot:credits":613},[751,12878,12879,12884],{},[754,12880,5929,12881,6725],{},[696,12882,8882],{"href":8880,"rel":12883},[700],[754,12885,6969,12886,880],{},[696,12887,12890],{"href":12888,"rel":12889},"https://magicui.design/docs/components/smooth-cursor",[700],"Magic UI Smooth Cursor",[2836,12892,12893],{},"html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":613,"searchDepth":847,"depth":847,"links":12895},[],"A customizable, physics-based smooth cursor animation component for Vue applications.",{},{"title":217,"description":12896},[1067,5952,12468,6732],"-0WN_qi2C1xLgJGzfH-oxevAxwimiVmUg6qIqG-ZnTE",{"id":12902,"title":221,"badge":687,"body":12903,"category":12463,"description":13170,"extension":856,"links":687,"meta":13171,"navigation":859,"path":222,"seo":13172,"stem":223,"tags":13173,"__hash__":13174},"docs_en/en/2.components/cursors/tailed-cursor.md",{"type":689,"value":12904,"toc":13168},[12905],[5728,12906,12911,13151],{":component-files":12907,"component-id":12908,"config":12909,"demo-file":12910,"dependencies":6991},"[\"TailedCursor.vue\"]","tailed-cursor","TailedCursorConfig","TailedCursorDemo.vue",[3549,12912,12913,12915],{"v-slot:api":613},[882,12914,5856],{"id":5855},[5858,12916,12917,12929],{},[5861,12918,12919],{},[5864,12920,12921,12923,12925,12927],{},[5867,12922,5869],{},[5867,12924,5872],{},[5867,12926,5875],{},[5867,12928,5878],{},[5880,12930,12931,12949,12967,12986,13005,13023,13042,13060,13078,13096,13114,13132],{},[5864,12932,12933,12937,12941,12946],{},[5885,12934,12935],{},[894,12936,9801],{},[5885,12938,12939],{},[894,12940,9806],{},[5885,12942,12943],{},[894,12944,12945],{},"[\"#ff9346\", \"#7cff67\", \"#ffee51\", \"#00d8ff\"]",[5885,12947,12948],{},"Array of colors for each tail ribbon.",[5864,12950,12951,12956,12960,12964],{},[5885,12952,12953],{},[894,12954,12955],{},"baseSpring",[5885,12957,12958],{},[894,12959,6016],{},[5885,12961,12962],{},[894,12963,7747],{},[5885,12965,12966],{},"Spring strength for tail movement responsiveness.",[5864,12968,12969,12974,12978,12983],{},[5885,12970,12971],{},[894,12972,12973],{},"baseFriction",[5885,12975,12976],{},[894,12977,6016],{},[5885,12979,12980],{},[894,12981,12982],{},"0.9",[5885,12984,12985],{},"Friction factor slowing down the tail movement.",[5864,12987,12988,12993,12997,13002],{},[5885,12989,12990],{},[894,12991,12992],{},"baseThickness",[5885,12994,12995],{},[894,12996,6016],{},[5885,12998,12999],{},[894,13000,13001],{},"30",[5885,13003,13004],{},"Base thickness of the tail ribbons.",[5864,13006,13007,13012,13016,13020],{},[5885,13008,13009],{},[894,13010,13011],{},"offsetFactor",[5885,13013,13014],{},[894,13015,6016],{},[5885,13017,13018],{},[894,13019,8518],{},[5885,13021,13022],{},"Horizontal offset factor between each ribbon line.",[5864,13024,13025,13030,13034,13039],{},[5885,13026,13027],{},[894,13028,13029],{},"maxAge",[5885,13031,13032],{},[894,13033,6016],{},[5885,13035,13036],{},[894,13037,13038],{},"500",[5885,13040,13041],{},"Maximum age for tail segments controlling their fade timing.",[5864,13043,13044,13049,13053,13057],{},[5885,13045,13046],{},[894,13047,13048],{},"pointCount",[5885,13050,13051],{},[894,13052,6016],{},[5885,13054,13055],{},[894,13056,6021],{},[5885,13058,13059],{},"Number of points composing each ribbon tail.",[5864,13061,13062,13067,13071,13075],{},[5885,13063,13064],{},[894,13065,13066],{},"speedMultiplier",[5885,13068,13069],{},[894,13070,6016],{},[5885,13072,13073],{},[894,13074,7106],{},[5885,13076,13077],{},"Speed multiplier controlling the animation speed.",[5864,13079,13080,13085,13089,13093],{},[5885,13081,13082],{},[894,13083,13084],{},"enableFade",[5885,13086,13087],{},[894,13088,5914],{},[5885,13090,13091],{},[894,13092,7446],{},[5885,13094,13095],{},"Enables fading effect on tail edges.",[5864,13097,13098,13103,13107,13111],{},[5885,13099,13100],{},[894,13101,13102],{},"enableShaderEffect",[5885,13104,13105],{},[894,13106,5914],{},[5885,13108,13109],{},[894,13110,7446],{},[5885,13112,13113],{},"Enables dynamic shader wave effect on ribbons.",[5864,13115,13116,13121,13125,13129],{},[5885,13117,13118],{},[894,13119,13120],{},"effectAmplitude",[5885,13122,13123],{},[894,13124,6016],{},[5885,13126,13127],{},[894,13128,7938],{},[5885,13130,13131],{},"Amplitude of the shader wave effect when enabled.",[5864,13133,13134,13138,13143,13148],{},[5885,13135,13136],{},[894,13137,9515],{},[5885,13139,13140],{},[894,13141,13142],{},"number[]",[5885,13144,13145],{},[894,13146,13147],{},"[0, 0, 0, 0]",[5885,13149,13150],{},"RGBA background clear color for the WebGL canvas.",[3549,13152,13153],{"v-slot:credits":613},[751,13154,13155,13162],{},[754,13156,13157,13158,13161],{},"Built with ",[696,13159,7009],{"href":7007,"rel":13160},[700],", a lightweight WebGL framework.",[754,13163,6176,13164],{},[696,13165,12566],{"href":13166,"rel":13167},"https://tympanus.net/codrops/2019/09/24/crafting-stylised-mouse-trails-with-ogl/",[700],{"title":613,"searchDepth":847,"depth":847,"links":13169},[],"A smooth, colorful ribbon cursor trail rendered with WebGL using OGL, featuring dynamic shaders and customizable animation effects.",{},{"title":221,"description":13170},[1067,5952,12468,7023,12573],"RX3g08zLwNmB2A86k9pEMF4Gx_OrmdxjCZ2mLM344lI",{"id":13176,"title":230,"badge":687,"body":13177,"category":13270,"description":13271,"extension":856,"links":687,"meta":13272,"navigation":859,"path":231,"seo":13273,"stem":232,"tags":13274,"__hash__":13276},"docs_en/en/2.components/device-mocks/iphone-mockup.md",{"type":689,"value":13178,"toc":13268},[13179],[5728,13180,13185,13258],{":component-files":13181,"component-id":13182,"config":13183,"demo-file":13184},"[\"iPhone15ProMockup.vue\"]","iphone-mockup","iPhone15ProMockupConfig","iPhone15ProMockupDemo.vue",[3549,13186,13187,13189],{"v-slot:api":613},[882,13188,5856],{"id":5855},[5858,13190,13191,13203],{},[5861,13192,13193],{},[5864,13194,13195,13197,13199,13201],{},[5867,13196,5869],{},[5867,13198,5872],{},[5867,13200,5875],{},[5867,13202,5878],{},[5880,13204,13205,13223,13241],{},[5864,13206,13207,13211,13215,13220],{},[5885,13208,13209],{},[894,13210,6649],{},[5885,13212,13213],{},[894,13214,6016],{},[5885,13216,13217],{},[894,13218,13219],{},"433",[5885,13221,13222],{},"Width of the mockup SVG in pixels.",[5864,13224,13225,13229,13233,13238],{},[5885,13226,13227],{},[894,13228,6667],{},[5885,13230,13231],{},[894,13232,6016],{},[5885,13234,13235],{},[894,13236,13237],{},"882",[5885,13239,13240],{},"Height of the mockup SVG in pixels.",[5864,13242,13243,13247,13251,13255],{},[5885,13244,13245],{},[894,13246,9096],{},[5885,13248,13249],{},[894,13250,5894],{},[5885,13252,13253],{},[894,13254,8291],{},[5885,13256,13257],{},"URL of the image to display inside the mockup.",[3549,13259,13260],{"v-slot:credits":613},[751,13261,13262],{},[754,13263,6969,13264,880],{},[696,13265,725],{"href":13266,"rel":13267},"https://magicui.design/docs/components/iphone-15-pro",[700],{"title":613,"searchDepth":847,"depth":847,"links":13269},[],"Device Mockup","An SVG mockup of an iPhone.",{},{"title":230,"description":13271},[1067,5952,13275,6732],"device-mockup","vSelfisZ9jj_wz1ZofTZlNlaBmFVzVpGzMNCu446s0o",{"id":13278,"title":234,"badge":687,"body":13279,"category":13270,"description":13387,"extension":856,"links":687,"meta":13388,"navigation":859,"path":235,"seo":13389,"stem":236,"tags":13390,"__hash__":13391},"docs_en/en/2.components/device-mocks/safari-mockup.md",{"type":689,"value":13280,"toc":13385},[13281],[5728,13282,13287,13375],{":component-files":13283,"component-id":13284,"config":13285,"demo-file":13286},"[\"SafariMockup.vue\"]","safari-mockup","SafariMockupConfig","SafariMockupDemo.vue",[3549,13288,13289,13291],{"v-slot:api":613},[882,13290,5856],{"id":5855},[5858,13292,13293,13305],{},[5861,13294,13295],{},[5864,13296,13297,13299,13301,13303],{},[5867,13298,5869],{},[5867,13300,5872],{},[5867,13302,5875],{},[5867,13304,5878],{},[5880,13306,13307,13325,13341,13358],{},[5864,13308,13309,13314,13318,13322],{},[5885,13310,13311],{},[894,13312,13313],{},"url",[5885,13315,13316],{},[894,13317,5894],{},[5885,13319,13320],{},[894,13321,8291],{},[5885,13323,13324],{},"URL displayed in the mockup's address bar.",[5864,13326,13327,13331,13335,13339],{},[5885,13328,13329],{},[894,13330,9096],{},[5885,13332,13333],{},[894,13334,5894],{},[5885,13336,13337],{},[894,13338,8291],{},[5885,13340,13257],{},[5864,13342,13343,13347,13351,13356],{},[5885,13344,13345],{},[894,13346,6649],{},[5885,13348,13349],{},[894,13350,6016],{},[5885,13352,13353],{},[894,13354,13355],{},"1203",[5885,13357,13222],{},[5864,13359,13360,13364,13368,13373],{},[5885,13361,13362],{},[894,13363,6667],{},[5885,13365,13366],{},[894,13367,6016],{},[5885,13369,13370],{},[894,13371,13372],{},"753",[5885,13374,13240],{},[3549,13376,13377],{"v-slot:credits":613},[751,13378,13379],{},[754,13380,6969,13381,880],{},[696,13382,725],{"href":13383,"rel":13384},"https://magicui.design/docs/components/safari",[700],{"title":613,"searchDepth":847,"depth":847,"links":13386},[],"An SVG mockup of the Safari browser.",{},{"title":234,"description":13387},[1067,5952,13275,6732],"pOJit6bX7ZIRzyGnLQG8nHMPLau8ggpRMfmv9whLn8g",{"id":13393,"title":13394,"badge":687,"body":13395,"category":687,"description":13402,"extension":856,"links":687,"meta":13403,"navigation":136,"path":24,"seo":13404,"stem":13405,"tags":687,"__hash__":13406},"docs_en/en/2.components/index.md","All Components",{"type":689,"value":13396,"toc":13400},[13397],[13398,13399],"components-list",{},{"title":613,"searchDepth":847,"depth":847,"links":13401},[],"List of all the components provided by Inspira UI.",{},{"title":13394,"description":13402},"en/2.components/index","N3i2RsLkFFNWF_HU6_fzQ7kvjCa3XehBihGQTCvmn44",{"id":13408,"title":243,"badge":687,"body":13409,"category":13608,"description":13609,"extension":856,"links":687,"meta":13610,"navigation":859,"path":244,"seo":13611,"stem":245,"tags":13612,"__hash__":13614},"docs_en/en/2.components/input-and-forms/balance-slider.md",{"type":689,"value":13410,"toc":13606},[13411],[5728,13412,13417,13586],{":component-files":13413,"component-id":13414,"config":13415,"demo-file":13416},"[\"BalanceSlider.vue\"]","balance-slider","BalanceSliderConfig","BalanceSliderDemo.vue",[3549,13418,13419,13421],{"v-slot:api":613},[882,13420,5856],{"id":5855},[5858,13422,13423,13435],{},[5861,13424,13425],{},[5864,13426,13427,13429,13431,13433],{},[5867,13428,5869],{},[5867,13430,5872],{},[5867,13432,5875],{},[5867,13434,5878],{},[5880,13436,13437,13455,13474,13492,13510,13529,13548,13567],{},[5864,13438,13439,13444,13448,13452],{},[5885,13440,13441],{},[894,13442,13443],{},"initialValue",[5885,13445,13446],{},[894,13447,6016],{},[5885,13449,13450],{},[894,13451,6021],{},[5885,13453,13454],{},"Initial position of the slider (0-100).",[5864,13456,13457,13462,13466,13471],{},[5885,13458,13459],{},[894,13460,13461],{},"leftColor",[5885,13463,13464],{},[894,13465,5894],{},[5885,13467,13468],{},[894,13469,13470],{},"\"#e68a00\"",[5885,13472,13473],{},"Background color for the left side of the slider.",[5864,13475,13476,13481,13485,13489],{},[5885,13477,13478],{},[894,13479,13480],{},"rightColor",[5885,13482,13483],{},[894,13484,5894],{},[5885,13486,13487],{},[894,13488,10499],{},[5885,13490,13491],{},"Background color for the right side of the slider.",[5864,13493,13494,13499,13503,13507],{},[5885,13495,13496],{},[894,13497,13498],{},"minShiftLimit",[5885,13500,13501],{},[894,13502,6016],{},[5885,13504,13505],{},[894,13506,6810],{},[5885,13508,13509],{},"Minimum limit where shifting animation activates.",[5864,13511,13512,13517,13521,13526],{},[5885,13513,13514],{},[894,13515,13516],{},"maxShiftLimit",[5885,13518,13519],{},[894,13520,6016],{},[5885,13522,13523],{},[894,13524,13525],{},"68",[5885,13527,13528],{},"Maximum limit where shifting animation deactivates.",[5864,13530,13531,13536,13540,13545],{},[5885,13532,13533],{},[894,13534,13535],{},"leftContent",[5885,13537,13538],{},[894,13539,5894],{},[5885,13541,13542],{},[894,13543,13544],{},"\"LEFT\"",[5885,13546,13547],{},"Text displayed in the tooltip for the left side.",[5864,13549,13550,13555,13559,13564],{},[5885,13551,13552],{},[894,13553,13554],{},"rightContent",[5885,13556,13557],{},[894,13558,5894],{},[5885,13560,13561],{},[894,13562,13563],{},"\"RIGHT\"",[5885,13565,13566],{},"Text displayed in the tooltip for the right side.",[5864,13568,13569,13574,13578,13583],{},[5885,13570,13571],{},[894,13572,13573],{},"indicatorColor",[5885,13575,13576],{},[894,13577,5894],{},[5885,13579,13580],{},[894,13581,13582],{},"\"#FFFFFF\"",[5885,13584,13585],{},"Color of the central indicator on the slider.",[3549,13587,13588],{"v-slot:credits":613},[751,13589,13590,13598],{},[754,13591,13592,13593],{},"Inspired and ported from code shared in ",[696,13594,13597],{"href":13595,"rel":13596},"https://x.com/jh3yy/status/1748809599598399792?s=46",[700],"Jhey's CSS only version of Balance Slider",[754,13599,13600,13601,880],{},"Original concept by ",[696,13602,13605],{"href":13603,"rel":13604},"https://x.com/MalayVasa/status/1748726374079381930",[700],"Malay Vasa",{"title":613,"searchDepth":847,"depth":847,"links":13607},[],"Forms & Input","A dynamic balance slider with adjustable colors, limits, and interactive tooltip.",{},{"title":243,"description":13609},[1067,5952,13613],"input","6YK-IbNNSEU8dRgMVtFbTZu6LU74HbX7vtZDrbAbZq8",{"id":13616,"title":247,"badge":687,"body":13617,"category":13608,"description":13942,"extension":856,"links":687,"meta":13943,"navigation":859,"path":248,"seo":13944,"stem":249,"tags":13945,"__hash__":13947},"docs_en/en/2.components/input-and-forms/color-picker.md",{"type":689,"value":13618,"toc":13940},[13619,13937],[5728,13620,13626,13921],{":component-files":13621,"component-id":13622,"config":13623,"demo-file":13624,"dependencies":13625},"[\"ColorPicker.vue\", \"ObjectColorInput.vue\", \"ContrastRatio.vue\", \"index.ts\"]","color-picker","ColorPickerConfig","ColorPickerDemo.vue","@uiw/color-convert",[3549,13627,13628,13630,13634,13779,13783,13827,13831],{"v-slot:api":613},[882,13629,5856],{"id":5855},[728,13631,13633],{"id":13632},"colorpicker-props","ColorPicker Props",[5858,13635,13636,13648],{},[5861,13637,13638],{},[5864,13639,13640,13642,13644,13646],{},[5867,13641,5869],{},[5867,13643,5872],{},[5867,13645,5875],{},[5867,13647,5878],{},[5880,13649,13650,13669,13689,13708,13726,13744,13761],{},[5864,13651,13652,13657,13662,13666],{},[5885,13653,13654],{},[894,13655,13656],{},"value",[5885,13658,13659],{},[894,13660,13661],{},"string | HsvaColor | HslaColor | RgbaColor",[5885,13663,13664],{},[894,13665,7766],{},[5885,13667,13668],{},"The current color value in any supported format",[5864,13670,13671,13676,13681,13686],{},[5885,13672,13673],{},[894,13674,13675],{},"type",[5885,13677,13678],{},[894,13679,13680],{},"'hsl' | 'hsla' | 'rgb' | 'rgba' | 'hex'",[5885,13682,13683],{},[894,13684,13685],{},"'hsl'",[5885,13687,13688],{},"Default color format to display in inputs",[5864,13690,13691,13696,13701,13705],{},[5885,13692,13693],{},[894,13694,13695],{},"swatches",[5885,13697,13698],{},[894,13699,13700],{},"HexColor[]",[5885,13702,13703],{},[894,13704,3932],{},[5885,13706,13707],{},"Array of predefined color swatches",[5864,13709,13710,13715,13719,13723],{},[5885,13711,13712],{},[894,13713,13714],{},"hideContrastRatio",[5885,13716,13717],{},[894,13718,5914],{},[5885,13720,13721],{},[894,13722,7446],{},[5885,13724,13725],{},"Hide the accessibility contrast ratio section",[5864,13727,13728,13733,13737,13741],{},[5885,13729,13730],{},[894,13731,13732],{},"hideDefaultSwatches",[5885,13734,13735],{},[894,13736,5914],{},[5885,13738,13739],{},[894,13740,7446],{},[5885,13742,13743],{},"Hide the default color swatches",[5864,13745,13746,13750,13754,13758],{},[5885,13747,13748],{},[894,13749,5889],{},[5885,13751,13752],{},[894,13753,5894],{},[5885,13755,13756],{},[894,13757,6077],{},[5885,13759,13760],{},"Additional CSS classes for the popover content",[5864,13762,13763,13768,13772,13776],{},[5885,13764,13765],{},[894,13766,13767],{},"open",[5885,13769,13770],{},[894,13771,5914],{},[5885,13773,13774],{},[894,13775,7446],{},[5885,13777,13778],{},"Control the open/closed state of the color picker",[728,13780,13782],{"id":13781},"colorpicker-events","ColorPicker Events",[5858,13784,13785,13795],{},[5861,13786,13787],{},[5864,13788,13789,13791,13793],{},[5867,13790,10393],{},[5867,13792,5872],{},[5867,13794,5878],{},[5880,13796,13797,13812],{},[5864,13798,13799,13804,13809],{},[5885,13800,13801],{},[894,13802,13803],{},"value-change",[5885,13805,13806],{},[894,13807,13808],{},"(value: ColorPickerValue) => void",[5885,13810,13811],{},"Emitted when the selected color changes",[5864,13813,13814,13819,13824],{},[5885,13815,13816],{},[894,13817,13818],{},"update:open",[5885,13820,13821],{},[894,13822,13823],{},"(value: boolean) => void",[5885,13825,13826],{},"Emitted when the popover open state changes",[728,13828,13830],{"id":13829},"colorpickervalue-type","ColorPickerValue Type",[925,13832,13834],{"className":3975,"code":13833,"language":3977,"meta":613,"style":613},"interface ColorPickerValue {\n  hex: string; // Hex color string (e.g., \"#ff0000\")\n  hsl: HslaColor; // HSL color object with h, s, l, a properties\n  hsla: HslaColor; // HSLA color object with h, s, l, a properties\n  rgb: RgbaColor; // RGB color object with r, g, b, a properties\n  rgba: RgbaColor; // RGBA color object with r, g, b, a properties\n}\n",[894,13835,13836,13845,13859,13874,13888,13903,13917],{"__ignoreMap":613},[934,13837,13838,13840,13843],{"class":936,"line":937},[934,13839,3861],{"class":1308},[934,13841,13842],{"class":940}," ColorPickerValue",[934,13844,1312],{"class":1078},[934,13846,13847,13850,13852,13854,13856],{"class":936,"line":847},[934,13848,13849],{"class":3302},"  hex",[934,13851,1305],{"class":1078},[934,13853,3875],{"class":940},[934,13855,4207],{"class":1078},[934,13857,13858],{"class":3133}," // Hex color string (e.g., \"#ff0000\")\n",[934,13860,13861,13864,13866,13869,13871],{"class":936,"line":850},[934,13862,13863],{"class":3302},"  hsl",[934,13865,1305],{"class":1078},[934,13867,13868],{"class":940}," HslaColor",[934,13870,4207],{"class":1078},[934,13872,13873],{"class":3133}," // HSL color object with h, s, l, a properties\n",[934,13875,13876,13879,13881,13883,13885],{"class":936,"line":1108},[934,13877,13878],{"class":3302},"  hsla",[934,13880,1305],{"class":1078},[934,13882,13868],{"class":940},[934,13884,4207],{"class":1078},[934,13886,13887],{"class":3133}," // HSLA color object with h, s, l, a properties\n",[934,13889,13890,13893,13895,13898,13900],{"class":936,"line":1121},[934,13891,13892],{"class":3302},"  rgb",[934,13894,1305],{"class":1078},[934,13896,13897],{"class":940}," RgbaColor",[934,13899,4207],{"class":1078},[934,13901,13902],{"class":3133}," // RGB color object with r, g, b, a properties\n",[934,13904,13905,13908,13910,13912,13914],{"class":936,"line":1127},[934,13906,13907],{"class":3302},"  rgba",[934,13909,1305],{"class":1078},[934,13911,13897],{"class":940},[934,13913,4207],{"class":1078},[934,13915,13916],{"class":3133}," // RGBA color object with r, g, b, a properties\n",[934,13918,13919],{"class":936,"line":1133},[934,13920,1294],{"class":1078},[3549,13922,13923],{"v-slot:credits":613},[751,13924,13925,13930],{},[754,13926,5929,13927,5941],{},[696,13928,6869],{"href":6867,"rel":13929},[700],[754,13931,6857,13932,880],{},[696,13933,13936],{"href":13934,"rel":13935},"https://21st.dev/uplusion23/color-picker/color-picker-with-swatches-and-onchange",[700],"@uplusion23",[2836,13938,13939],{},"html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":613,"searchDepth":847,"depth":847,"links":13941},[],"A comprehensive color picker component with support for multiple color formats, accessibility features, and custom swatches.",{},{"title":247,"description":13942},[1067,5952,13613,13622,13946],"uplusion23","1CRtnSiUnDKtAMYNidR2l7BclnxIWXwqfUB9R4hiSGs",{"id":13949,"title":251,"badge":687,"body":13950,"category":13608,"description":14098,"extension":856,"links":687,"meta":14099,"navigation":859,"path":252,"seo":14100,"stem":253,"tags":14101,"__hash__":14102},"docs_en/en/2.components/input-and-forms/file-upload.md",{"type":689,"value":13951,"toc":14096},[13952],[5728,13953,13958,14080],{":component-files":13954,"component-id":13955,"config":13956,"demo-file":13957},"[\"FileUpload.vue\", \"FileUploadGrid.vue\"]","file-upload","FileUploadConfig","FileUploadDemo.vue",[3549,13959,13960,13962,13968,13973,13975,14005,14007,14036,14042,14050,14052],{"v-slot:api":613},[882,13961,5856],{"id":5855},[728,13963,13965],{"id":13964},"fileupload",[894,13966,13967],{},"FileUpload",[692,13969,10617,13970,13972],{},[894,13971,13967],{}," component serves as a wrapper for the file upload effect. It manages mouse events to create a 3D perspective.",[3097,13974,3696],{"id":10623},[5858,13976,13977,13989],{},[5861,13978,13979],{},[5864,13980,13981,13983,13985,13987],{},[5867,13982,5869],{},[5867,13984,5872],{},[5867,13986,5875],{},[5867,13988,5878],{},[5880,13990,13991],{},[5864,13992,13993,13997,14000,14002],{},[5885,13994,13995],{},[894,13996,5889],{},[5885,13998,13999],{},"String",[5885,14001,5899],{},[5885,14003,14004],{},"Additional classes for styling the container element.",[3097,14006,10384],{"id":10383},[5858,14008,14009,14019],{},[5861,14010,14011],{},[5864,14012,14013,14015,14017],{},[5867,14014,10393],{},[5867,14016,5872],{},[5867,14018,5878],{},[5880,14020,14021],{},[5864,14022,14023,14028,14033],{},[5885,14024,14025],{},[894,14026,14027],{},"onChange",[5885,14029,14030],{},[894,14031,14032],{},"(files: File[]) => void",[5885,14034,14035],{},"Callback function triggered when files are added/uploaded.",[728,14037,14039],{"id":14038},"fileuploadgrid",[894,14040,14041],{},"FileUploadGrid",[692,14043,10617,14044,14046,14047,14049],{},[894,14045,14041],{}," component provides the background grid pattern for the file upload area. It is intended to be used within a ",[894,14048,13967],{}," component to create the visual grid effect behind the upload interface.",[3097,14051,3696],{"id":10688},[5858,14053,14054,14066],{},[5861,14055,14056],{},[5864,14057,14058,14060,14062,14064],{},[5867,14059,5869],{},[5867,14061,5872],{},[5867,14063,5875],{},[5867,14065,5878],{},[5880,14067,14068],{},[5864,14069,14070,14074,14076,14078],{},[5885,14071,14072],{},[894,14073,5889],{},[5885,14075,13999],{},[5885,14077,5899],{},[5885,14079,10719],{},[3549,14081,14082],{"v-slot:credits":613},[751,14083,14084,14089],{},[754,14085,5929,14086,5941],{},[696,14087,6869],{"href":6867,"rel":14088},[700],[754,14090,6857,14091,880],{},[696,14092,14095],{"href":14093,"rel":14094},"https://ui.aceternity.com/components/file-upload",[700],"AcernityUI",{"title":613,"searchDepth":847,"depth":847,"links":14097},[],"A modern file upload component with a 3D card effect, drag-and-drop functionality, and a responsive grid background pattern.",{},{"title":251,"description":14098},[1067,5952,13613,5954],"9EcFj1zOv6BfafuDemYM0zaGposXp5hD4LlCViuWY5E",{"id":14104,"title":255,"badge":687,"body":14105,"category":13608,"description":14162,"extension":856,"links":687,"meta":14163,"navigation":859,"path":256,"seo":14164,"stem":257,"tags":14165,"__hash__":14167},"docs_en/en/2.components/input-and-forms/halo-search.md",{"type":689,"value":14106,"toc":14160},[14107],[5728,14108,14113,14150],{":component-files":14109,"component-id":14110,"config":14111,"demo-file":14112},"[\"HaloSearch.vue\"]","halo-search","HaloSearchConfig","HaloSearchDemo.vue",[3549,14114,14115,14117],{"v-slot:api":613},[882,14116,5856],{"id":5855},[5858,14118,14119,14131],{},[5861,14120,14121],{},[5864,14122,14123,14125,14127,14129],{},[5867,14124,5869],{},[5867,14126,5872],{},[5867,14128,5875],{},[5867,14130,5878],{},[5880,14132,14133],{},[5864,14134,14135,14139,14143,14147],{},[5885,14136,14137],{},[894,14138,5889],{},[5885,14140,14141],{},[894,14142,5894],{},[5885,14144,14145],{},[894,14146,6077],{},[5885,14148,14149],{},"Additional CSS classes for root container.",[3549,14151,14152],{"v-slot:credits":613},[751,14153,14154,14157],{},[754,14155,14156],{},"Design inspired by futuristic UI concepts and ambient lighting effects popular in modern web and app design.",[754,14158,14159],{},"Inspired from UiVerse Search input challenge.",{"title":613,"searchDepth":847,"depth":847,"links":14161},[],"A futuristic search input component featuring multiple glowing rings and subtle animated halos for a vibrant, immersive UI experience.",{},{"title":255,"description":14162},[1067,5952,13613,14166],"ui-verse","tDxTiTCd-gGrgj7Dj5a8BND4sdSNxtCYRgIOoMV9MGY",{"id":14169,"title":259,"badge":687,"body":14170,"category":13608,"description":14265,"extension":856,"links":687,"meta":14266,"navigation":859,"path":260,"seo":14267,"stem":261,"tags":14268,"__hash__":14269},"docs_en/en/2.components/input-and-forms/input.md",{"type":689,"value":14171,"toc":14263},[14172],[5728,14173,14177,14249],{":component-files":14174,"component-id":13613,"config":14175,"demo-file":14176},"[\"IInput.vue\"]","InputConfig","InputDemo.vue",[3549,14178,14179,14181],{"v-slot:api":613},[882,14180,5856],{"id":5855},[5858,14182,14183,14195],{},[5861,14184,14185],{},[5864,14186,14187,14189,14191,14193],{},[5867,14188,5869],{},[5867,14190,5872],{},[5867,14192,5875],{},[5867,14194,5878],{},[5880,14196,14197,14216,14232],{},[5864,14198,14199,14204,14209,14213],{},[5885,14200,14201],{},[894,14202,14203],{},"defaultValue",[5885,14205,14206],{},[894,14207,14208],{},"string  | number",[5885,14210,14211],{},[894,14212,6077],{},[5885,14214,14215],{},"Default value of the input field.",[5864,14217,14218,14222,14226,14230],{},[5885,14219,14220],{},[894,14221,5889],{},[5885,14223,14224],{},[894,14225,5894],{},[5885,14227,14228],{},[894,14229,6077],{},[5885,14231,6962],{},[5864,14233,14234,14238,14242,14246],{},[5885,14235,14236],{},[894,14237,9370],{},[5885,14239,14240],{},[894,14241,5894],{},[5885,14243,14244],{},[894,14245,6077],{},[5885,14247,14248],{},"Additional CSS classes for custom styling of the container.",[3549,14250,14251],{"v-slot:credits":613},[751,14252,14253,14256],{},[754,14254,14255],{},"Built on ShadCN Vue's Input component foundation, with extended functionality for modern UI/UX needs.",[754,14257,6969,14258],{},[696,14259,14262],{"href":14260,"rel":14261},"https://ui.aceternity.com/components/signup-form",[700],"Aceternity UI's Signup Form Input Component",{"title":613,"searchDepth":847,"depth":847,"links":14264},[],"A versatile and visually dynamic input field with radial hover effects, styled for modern web applications.",{},{"title":259,"description":14265},[1067,5952,13613,5954],"z-OcNSUTMLAK4VXGGIzeh715sZ9ZyPwpMXTK7sBkWKM",{"id":14271,"title":263,"badge":687,"body":14272,"category":13608,"description":14389,"extension":856,"links":687,"meta":14390,"navigation":859,"path":264,"seo":14391,"stem":265,"tags":14392,"__hash__":14393},"docs_en/en/2.components/input-and-forms/placeholders-and-vanish-input.md",{"type":689,"value":14273,"toc":14387},[14274],[5728,14275,14280,14371],{":component-files":14276,"component-id":14277,"config":14278,"demo-file":14279},"[\"VanishingInput.vue\"]","vanishing-input","VanishingInputConfig","VanishingInputDemo.vue",[3549,14281,14282,14284,14320,14327],{"v-slot:api":613},[882,14283,5856],{"id":5855},[5858,14285,14286,14298],{},[5861,14287,14288],{},[5864,14289,14290,14292,14294,14296],{},[5867,14291,5869],{},[5867,14293,5872],{},[5867,14295,5875],{},[5867,14297,5878],{},[5880,14299,14300],{},[5864,14301,14302,14307,14312,14317],{},[5885,14303,14304],{},[894,14305,14306],{},"placeholders",[5885,14308,14309],{},[894,14310,14311],{},"Array\u003Cstring>",[5885,14313,14314],{},[894,14315,14316],{},"[\"Placeholder 1\", \"Placeholder 2\", \"Placeholder 3\"]",[5885,14318,14319],{},"An array of placeholder texts that cycle through as prompts in the input field.",[692,14321,14322,14323,14326],{},"This component listens to the following events emitted by the ",[894,14324,14325],{},"VanishingInput"," component:",[5858,14328,14329,14340],{},[5861,14330,14331],{},[5864,14332,14333,14335,14338],{},[5867,14334,10393],{},[5867,14336,14337],{},"Parameters",[5867,14339,5878],{},[5880,14341,14342,14357],{},[5864,14343,14344,14349,14354],{},[5885,14345,14346],{},[894,14347,14348],{},"change",[5885,14350,14351],{},[894,14352,14353],{},"Event",[5885,14355,14356],{},"Triggered when the input value changes.",[5864,14358,14359,14364,14368],{},[5885,14360,14361],{},[894,14362,14363],{},"submit",[5885,14365,14366],{},[894,14367,5894],{},[5885,14369,14370],{},"Triggered when the input is submitted.",[3549,14372,14373],{"v-slot:credits":613},[751,14374,14375,14380],{},[754,14376,5929,14377,5941],{},[696,14378,8458],{"href":8456,"rel":14379},[700],[754,14381,6969,14382,880],{},[696,14383,14386],{"href":14384,"rel":14385},"https://ui.aceternity.com/components/placeholders-and-vanish-input",[700],"Aceternity UI's Placeholders And Vanish Input",{"title":613,"searchDepth":847,"depth":847,"links":14388},[],"Sliding in placeholders and vanish effect of input on submit",{},{"title":263,"description":14389},[1067,5952,13613,5954],"9PTUKU3eSc9Sm-fS7wcDYYHFVtUzJIyYgBKvZ53U4dI",{"id":14395,"title":272,"badge":687,"body":14396,"category":267,"description":14573,"extension":856,"links":687,"meta":14574,"navigation":859,"path":273,"seo":14575,"stem":274,"tags":14576,"__hash__":14577},"docs_en/en/2.components/miscellaneous/animate-grid.md",{"type":689,"value":14397,"toc":14571},[14398],[5728,14399,14404,14413,14560],{":component-files":14400,"component-id":14401,"config":14402,"demo-file":14403},"[\"AnimateGrid.vue\"]","animate-grid","AnimateGridConfig","AnimateGridDemo.vue",[3549,14405,14406,14410],{"v-slot:instructions":613},[3097,14407,14409],{"id":14408},"add-svg-file","Add SVG file",[692,14411,14412],{},"Add at least one SVG file to the same folder as your component and update the import in your component to use it",[3549,14414,14415,14417],{"v-slot:api":613},[882,14416,5856],{"id":5855},[5858,14418,14419,14431],{},[5861,14420,14421],{},[5864,14422,14423,14425,14427,14429],{},[5867,14424,5869],{},[5867,14426,5872],{},[5867,14428,5875],{},[5867,14430,5878],{},[5880,14432,14433,14452,14471,14488,14506,14524,14543],{},[5864,14434,14435,14440,14444,14449],{},[5885,14436,14437],{},[894,14438,14439],{},"textGlowStartColor",[5885,14441,14442],{},[894,14443,5894],{},[5885,14445,14446],{},[894,14447,14448],{},"\"#38ef7d80\"",[5885,14450,14451],{},"Color of the box shadow start.",[5864,14453,14454,14459,14463,14468],{},[5885,14455,14456],{},[894,14457,14458],{},"textGlowEndColor",[5885,14460,14461],{},[894,14462,5894],{},[5885,14464,14465],{},[894,14466,14467],{},"\"#38ef7d\"",[5885,14469,14470],{},"Color of the box shadow end.",[5864,14472,14473,14477,14481,14485],{},[5885,14474,14475],{},[894,14476,9586],{},[5885,14478,14479],{},[894,14480,6016],{},[5885,14482,14483],{},[894,14484,10377],{},[5885,14486,14487],{},"You can pass perspective to transform CSS property.",[5864,14489,14490,14494,14498,14503],{},[5885,14491,14492],{},[894,14493,10838],{},[5885,14495,14496],{},[894,14497,6016],{},[5885,14499,14500],{},[894,14501,14502],{},"-1",[5885,14504,14505],{},"You can pass rotateX to transform CSS property.",[5864,14507,14508,14512,14516,14521],{},[5885,14509,14510],{},[894,14511,10854],{},[5885,14513,14514],{},[894,14515,6016],{},[5885,14517,14518],{},[894,14519,14520],{},"-15",[5885,14522,14523],{},"You can pass rotateY to transform CSS property.",[5864,14525,14526,14531,14535,14540],{},[5885,14527,14528],{},[894,14529,14530],{},"cards",[5885,14532,14533],{},[894,14534,3932],{},[5885,14536,14537],{},[894,14538,14539],{},"\"[{logo: 'src'}]\"",[5885,14541,14542],{},"Cards to display in grid.",[5864,14544,14545,14549,14553,14557],{},[5885,14546,14547],{},[894,14548,5889],{},[5885,14550,14551],{},[894,14552,5894],{},[5885,14554,14555],{},[894,14556,6077],{},[5885,14558,14559],{},"Additional tailwind CSS classes for custom styling.",[3549,14561,14562],{"v-slot:credits":613},[751,14563,14564],{},[754,14565,14566,14567,14570],{},"Thanks to ",[696,14568,5940],{"href":5938,"rel":14569},[700]," for providing this component.",{"title":613,"searchDepth":847,"depth":847,"links":14572},[],"Skew Animation grid with box shadow.",{},{"title":272,"description":14573},[1067,5952,13613],"87wv0Qbat3GpELYn9jupCpQJfoSJ_e_rDjIVyzP4Tyc",{"id":14579,"title":276,"badge":687,"body":14580,"category":267,"description":14785,"extension":856,"links":687,"meta":14786,"navigation":859,"path":277,"seo":14787,"stem":278,"tags":14788,"__hash__":14789},"docs_en/en/2.components/miscellaneous/animated-circular-progressbar.md",{"type":689,"value":14581,"toc":14783},[14582],[5728,14583,14588,14768],{":component-files":14584,"component-id":14585,"config":14586,"demo-file":14587},"[\"AnimatedCircularProgressBar.vue\"]","animated-circular-progressbar","AnimatedCircularProgressBarConfig","AnimatedCircularProgressBarDemo.vue",[3549,14589,14590,14592],{"v-slot:api":613},[882,14591,5856],{"id":5855},[5858,14593,14594,14606],{},[5861,14595,14596],{},[5864,14597,14598,14600,14602,14604],{},[5867,14599,5869],{},[5867,14601,5872],{},[5867,14603,5875],{},[5867,14605,5878],{},[5880,14607,14608,14624,14642,14660,14677,14696,14715,14733,14751],{},[5864,14609,14610,14614,14618,14622],{},[5885,14611,14612],{},[894,14613,5889],{},[5885,14615,14616],{},[894,14617,5894],{},[5885,14619,14620],{},[894,14621,5899],{},[5885,14623,11899],{},[5864,14625,14626,14631,14635,14639],{},[5885,14627,14628],{},[894,14629,14630],{},"max",[5885,14632,14633],{},[894,14634,6016],{},[5885,14636,14637],{},[894,14638,7337],{},[5885,14640,14641],{},"The maximum value of the gauge.",[5864,14643,14644,14649,14653,14657],{},[5885,14645,14646],{},[894,14647,14648],{},"min",[5885,14650,14651],{},[894,14652,6016],{},[5885,14654,14655],{},[894,14656,6157],{},[5885,14658,14659],{},"The minimum value of the gauge.",[5864,14661,14662,14666,14670,14674],{},[5885,14663,14664],{},[894,14665,13656],{},[5885,14667,14668],{},[894,14669,6016],{},[5885,14671,14672],{},[894,14673,6157],{},[5885,14675,14676],{},"The current value of the gauge.",[5864,14678,14679,14684,14688,14693],{},[5885,14680,14681],{},[894,14682,14683],{},"gaugePrimaryColor",[5885,14685,14686],{},[894,14687,5894],{},[5885,14689,14690],{},[894,14691,14692],{},"rgb(79 70 229)",[5885,14694,14695],{},"The primary color of the gauge.",[5864,14697,14698,14703,14707,14712],{},[5885,14699,14700],{},[894,14701,14702],{},"gaugeSecondaryColor",[5885,14704,14705],{},[894,14706,5894],{},[5885,14708,14709],{},[894,14710,14711],{},"rgba(0, 0, 0, 0.1)",[5885,14713,14714],{},"The secondary color of the gauge.",[5864,14716,14717,14722,14726,14730],{},[5885,14718,14719],{},[894,14720,14721],{},"circleStrokeWidth",[5885,14723,14724],{},[894,14725,6016],{},[5885,14727,14728],{},[894,14729,8850],{},[5885,14731,14732],{},"The width of the circle progress bar.",[5864,14734,14735,14740,14744,14748],{},[5885,14736,14737],{},[894,14738,14739],{},"showPercentage",[5885,14741,14742],{},[894,14743,5914],{},[5885,14745,14746],{},[894,14747,5919],{},[5885,14749,14750],{},"Show the value inside the circle",[5864,14752,14753,14757,14761,14765],{},[5885,14754,14755],{},[894,14756,6933],{},[5885,14758,14759],{},[894,14760,6016],{},[5885,14762,14763],{},[894,14764,1758],{},[5885,14766,14767],{},"The duration of the animation (in seconds).",[3549,14769,14770],{"v-slot:credits":613},[751,14771,14772,14778],{},[754,14773,5929,14774,880],{},[696,14775,725],{"href":14776,"rel":14777},"https://magicui.design/docs/components/animated-circular-progress-bar",[700],[754,14779,5929,14780,5941],{},[696,14781,5940],{"href":5938,"rel":14782},[700],{"title":613,"searchDepth":847,"depth":847,"links":14784},[],"Animated Circular Progress Bar is a component that displays a circular gauge with a percentage value.",{},{"title":276,"description":14785},[1067,5952,13613,6732],"0mVqWASXBgqvefZ1hXd74L0INBLOtMcsNbUHeJhTbdI",{"id":14791,"title":280,"badge":687,"body":14792,"category":267,"description":14849,"extension":856,"links":687,"meta":14850,"navigation":859,"path":281,"seo":14851,"stem":282,"tags":14852,"__hash__":14853},"docs_en/en/2.components/miscellaneous/animated-list.md",{"type":689,"value":14793,"toc":14847},[14794],[5728,14795,14800,14837],{":component-files":14796,"component-id":14797,"config":14798,"demo-file":14799},"[\"AnimatedList.vue\", \"Notification.vue\"]","animated-list","AnimatedListConfig","AnimatedListDemo.vue",[3549,14801,14802,14804],{"v-slot:api":613},[882,14803,5856],{"id":5855},[5858,14805,14806,14818],{},[5861,14807,14808],{},[5864,14809,14810,14812,14814,14816],{},[5867,14811,5869],{},[5867,14813,5872],{},[5867,14815,5875],{},[5867,14817,5878],{},[5880,14819,14820],{},[5864,14821,14822,14826,14830,14834],{},[5885,14823,14824],{},[894,14825,6914],{},[5885,14827,14828],{},[894,14829,6016],{},[5885,14831,14832],{},[894,14833,1758],{},[5885,14835,14836],{},"The delay in milliseconds before adding each item to the list.",[3549,14838,14839],{"v-slot:credits":613},[751,14840,14841],{},[754,14842,6857,14843,880],{},[696,14844,725],{"href":14845,"rel":14846},"https://magicui.design/docs/components/animated-list",[700],{"title":613,"searchDepth":847,"depth":847,"links":14848},[],"A sequentially animated list that introduces each item with a timed delay, perfect for displaying notifications or events on your landing page.",{},{"title":280,"description":14849},[1067,5952,6732],"WIZ7h6yYYb17n-UXOgtWp7pOBYtopNUcUjEBBDPQkZg",{"id":14855,"title":284,"badge":687,"body":14856,"category":267,"description":15247,"extension":856,"links":687,"meta":15248,"navigation":859,"path":285,"seo":15249,"stem":286,"tags":15250,"__hash__":15252},"docs_en/en/2.components/miscellaneous/animated-modal.md",{"type":689,"value":14857,"toc":15245},[14858],[5728,14859,14865,15227],{":component-files":14860,"component-id":14861,"config":14862,"demo-file":14863,"dependencies":14864},"[\"AnimatedModal.vue\", \"AnimatedModalBody.vue\", \"AnimatedModalContent.vue\", \"AnimatedModalFooter.vue\", \"AnimatedModalTrigger.vue\", \"AnimatedModalContext.ts\", \"useAnimatedModal.ts\", \"index.ts\"]","animated-modal","AnimatedModalConfig","AnimatedModalDemo.vue","motion-v @vueuse/core",[3549,14866,14867,14869,14875,14877,14949,14953,15010,15012,15044,15048,15058,15064,15066],{"v-slot:api":613},[882,14868,5856],{"id":5855},[728,14870,14872],{"id":14871},"animatedmodal",[894,14873,14874],{},"\u003CAnimatedModal />",[3097,14876,3696],{"id":10623},[5858,14878,14879,14891],{},[5861,14880,14881],{},[5864,14882,14883,14885,14887,14889],{},[5867,14884,5869],{},[5867,14886,5872],{},[5867,14888,5875],{},[5867,14890,5878],{},[5880,14892,14893,14910,14928],{},[5864,14894,14895,14899,14903,14907],{},[5885,14896,14897],{},[894,14898,13767],{},[5885,14900,14901],{},[894,14902,5914],{},[5885,14904,14905],{},[894,14906,5899],{},[5885,14908,14909],{},"Controlled open state.",[5864,14911,14912,14917,14921,14925],{},[5885,14913,14914],{},[894,14915,14916],{},"defaultOpen",[5885,14918,14919],{},[894,14920,5914],{},[5885,14922,14923],{},[894,14924,7446],{},[5885,14926,14927],{},"Uncontrolled initial state.",[5864,14929,14930,14935,14939,14943],{},[5885,14931,14932],{},[894,14933,14934],{},"closeOnEsc",[5885,14936,14937],{},[894,14938,5914],{},[5885,14940,14941],{},[894,14942,5919],{},[5885,14944,14945,14946],{},"Close modal when pressing ",[894,14947,14948],{},"Esc",[3097,14950,14952],{"id":14951},"events","Events",[5858,14954,14955,14966],{},[5861,14956,14957],{},[5864,14958,14959,14961,14964],{},[5867,14960,10393],{},[5867,14962,14963],{},"Payload",[5867,14965,5878],{},[5880,14967,14968,14981,14996],{},[5864,14969,14970,14974,14978],{},[5885,14971,14972],{},[894,14973,13818],{},[5885,14975,14976],{},[894,14977,5914],{},[5885,14979,14980],{},"Fired when open state changes.",[5864,14982,14983,14987,14989],{},[5885,14984,14985],{},[894,14986,13767],{},[5885,14988,5899],{},[5885,14990,14991,14992,14995],{},"Fired when ",[894,14993,14994],{},"openModal()"," is called.",[5864,14997,14998,15003,15005],{},[5885,14999,15000],{},[894,15001,15002],{},"close",[5885,15004,5899],{},[5885,15006,14991,15007,14995],{},[894,15008,15009],{},"closeModal()",[3097,15011,11051],{"id":11050},[5858,15013,15014,15023],{},[5861,15015,15016],{},[5864,15017,15018,15020],{},[5867,15019,11928],{},[5867,15021,15022],{},"Slot Props",[5880,15024,15025],{},[5864,15026,15027,15031],{},[5885,15028,15029],{},[894,15030,3785],{},[5885,15032,15033,4270,15035,4270,15038,4270,15041],{},[894,15034,13767],{},[894,15036,15037],{},"openModal",[894,15039,15040],{},"closeModal",[894,15042,15043],{},"toggle",[3097,15045,15047],{"id":15046},"composable","Composable",[751,15049,15050],{},[754,15051,15052,15055,15056,3001],{},[894,15053,15054],{},"useAnimatedModal()"," — access modal state/methods from any nested child component (must be used within ",[894,15057,14874],{},[728,15059,15061],{"id":15060},"animatedmodalbody",[894,15062,15063],{},"\u003CAnimatedModalBody />",[3097,15065,3696],{"id":10688},[5858,15067,15068,15080],{},[5861,15069,15070],{},[5864,15071,15072,15074,15076,15078],{},[5867,15073,5869],{},[5867,15075,5872],{},[5867,15077,5875],{},[5867,15079,5878],{},[5880,15081,15082,15099,15117,15135,15153,15171,15189,15207],{},[5864,15083,15084,15088,15092,15096],{},[5885,15085,15086],{},[894,15087,5889],{},[5885,15089,15090],{},[894,15091,5894],{},[5885,15093,15094],{},[894,15095,6077],{},[5885,15097,15098],{},"Extra classes for the modal panel.",[5864,15100,15101,15106,15110,15114],{},[5885,15102,15103],{},[894,15104,15105],{},"overlayClass",[5885,15107,15108],{},[894,15109,5894],{},[5885,15111,15112],{},[894,15113,6077],{},[5885,15115,15116],{},"Extra classes for the overlay.",[5864,15118,15119,15124,15128,15132],{},[5885,15120,15121],{},[894,15122,15123],{},"contentClass",[5885,15125,15126],{},[894,15127,5894],{},[5885,15129,15130],{},[894,15131,6077],{},[5885,15133,15134],{},"Extra classes for the content wrapper.",[5864,15136,15137,15142,15146,15150],{},[5885,15138,15139],{},[894,15140,15141],{},"showClose",[5885,15143,15144],{},[894,15145,5914],{},[5885,15147,15148],{},[894,15149,5919],{},[5885,15151,15152],{},"Show close button.",[5864,15154,15155,15160,15164,15168],{},[5885,15156,15157],{},[894,15158,15159],{},"closeOnOutside",[5885,15161,15162],{},[894,15163,5914],{},[5885,15165,15166],{},[894,15167,5919],{},[5885,15169,15170],{},"Close when clicking outside the dialog.",[5864,15172,15173,15178,15182,15186],{},[5885,15174,15175],{},[894,15176,15177],{},"lockScroll",[5885,15179,15180],{},[894,15181,5914],{},[5885,15183,15184],{},[894,15185,5919],{},[5885,15187,15188],{},"Lock page scroll while the modal is open.",[5864,15190,15191,15196,15200,15204],{},[5885,15192,15193],{},[894,15194,15195],{},"zIndex",[5885,15197,15198],{},[894,15199,6016],{},[5885,15201,15202],{},[894,15203,7586],{},[5885,15205,15206],{},"Z-index for the modal layer.",[5864,15208,15209,15214,15219,15224],{},[5885,15210,15211],{},[894,15212,15213],{},"teleportTo",[5885,15215,15216],{},[894,15217,15218],{},"string | HTMLElement",[5885,15220,15221],{},[894,15222,15223],{},"\"body\"",[5885,15225,15226],{},"Teleport target for the modal layer.",[3549,15228,15229],{"v-slot:credits":613},[751,15230,15231,15238],{},[754,15232,6969,15233,880],{},[696,15234,15237],{"href":15235,"rel":15236},"https://ui.aceternity.com/components/animated-modal",[700],"Aceternity UI's Animated Modal",[754,15239,15240,15241,880],{},"Animations powered by ",[696,15242,1023],{"href":15243,"rel":15244},"https://motion.dev/",[700],{"title":613,"searchDepth":847,"depth":847,"links":15246},[],"A modal dialog with a 3D entrance animation and blurred backdrop.",{},{"title":284,"description":15247},[1067,5952,15251,12068,5954],"modal","RxoaOBCE4WCQzdVilcfmQukj0Ma7hqyMFvMeALCtqpM",{"id":15254,"title":288,"badge":687,"body":15255,"category":267,"description":15605,"extension":856,"links":687,"meta":15606,"navigation":859,"path":289,"seo":15607,"stem":290,"tags":15608,"__hash__":15609},"docs_en/en/2.components/miscellaneous/animated-tabs.md",{"type":689,"value":15256,"toc":15603},[15257],[5728,15258,15263,15587],{":component-files":15259,"component-id":15260,"config":15261,"demo-file":15262,"dependencies":1023},"[\"AnimatedTabs.vue\", \"AnimatedTabsFadeInDiv.vue\", \"types.ts\", \"index.ts\"]","animated-tabs","AnimatedTabsConfig","AnimatedTabsDemo.vue",[3549,15264,15265,15267,15273,15280,15282,15406,15408,15436,15438,15473,15477,15484],{"v-slot:api":613},[882,15266,5856],{"id":5855},[728,15268,15270],{"id":15269},"animatedtabs",[894,15271,15272],{},"\u003CAnimatedTabs />",[692,15274,15275,15276,15279],{},"Tip: give the wrapper a fixed height (e.g. ",[894,15277,15278],{},"h-[20rem] md:h-[40rem]",") so the stacked content can be positioned absolutely.",[3097,15281,3696],{"id":10623},[5858,15283,15284,15296],{},[5861,15285,15286],{},[5864,15287,15288,15290,15292,15294],{},[5867,15289,5869],{},[5867,15291,5872],{},[5867,15293,5875],{},[5867,15295,5878],{},[5880,15297,15298,15316,15334,15352,15370,15388],{},[5864,15299,15300,15304,15309,15313],{},[5885,15301,15302],{},[894,15303,1051],{},[5885,15305,15306],{},[894,15307,15308],{},"AnimatedTab[]",[5885,15310,15311],{},[894,15312,5899],{},[5885,15314,15315],{},"Tabs metadata list.",[5864,15317,15318,15323,15327,15331],{},[5885,15319,15320],{},[894,15321,15322],{},"modelValue",[5885,15324,15325],{},[894,15326,5894],{},[5885,15328,15329],{},[894,15330,5899],{},[5885,15332,15333],{},"Controlled active tab value.",[5864,15335,15336,15341,15345,15349],{},[5885,15337,15338],{},[894,15339,15340],{},"containerClassName",[5885,15342,15343],{},[894,15344,5894],{},[5885,15346,15347],{},[894,15348,6077],{},[5885,15350,15351],{},"Extra classes for the tablist container.",[5864,15353,15354,15359,15363,15367],{},[5885,15355,15356],{},[894,15357,15358],{},"tabClassName",[5885,15360,15361],{},[894,15362,5894],{},[5885,15364,15365],{},[894,15366,6077],{},[5885,15368,15369],{},"Extra classes for each tab button.",[5864,15371,15372,15377,15381,15385],{},[5885,15373,15374],{},[894,15375,15376],{},"activeTabClassName",[5885,15378,15379],{},[894,15380,5894],{},[5885,15382,15383],{},[894,15384,6077],{},[5885,15386,15387],{},"Extra classes for the active pill background.",[5864,15389,15390,15395,15399,15403],{},[5885,15391,15392],{},[894,15393,15394],{},"contentClassName",[5885,15396,15397],{},[894,15398,5894],{},[5885,15400,15401],{},[894,15402,6077],{},[5885,15404,15405],{},"Extra classes for each stacked content card.",[3097,15407,14952],{"id":14951},[5858,15409,15410,15420],{},[5861,15411,15412],{},[5864,15413,15414,15416,15418],{},[5867,15415,10393],{},[5867,15417,14963],{},[5867,15419,5878],{},[5880,15421,15422],{},[5864,15423,15424,15429,15433],{},[5885,15425,15426],{},[894,15427,15428],{},"update:modelValue",[5885,15430,15431],{},[894,15432,5894],{},[5885,15434,15435],{},"Fired when active tab changes (controlled mode).",[3097,15437,11051],{"id":11050},[5858,15439,15440,15450],{},[5861,15441,15442],{},[5864,15443,15444,15446,15448],{},[5867,15445,11928],{},[5867,15447,15022],{},[5867,15449,5878],{},[5880,15451,15452],{},[5864,15453,15454,15459,15470],{},[5885,15455,15456],{},[894,15457,15458],{},"content",[5885,15460,15461,4270,15464,4270,15467],{},[894,15462,15463],{},"tab",[894,15465,15466],{},"active",[894,15468,15469],{},"hovering",[5885,15471,15472],{},"Render the tab content (recommended).",[3097,15474,15476],{"id":15475},"types","Types",[15478,15479,15481],"h5",{"id":15480},"animatedtab",[894,15482,15483],{},"AnimatedTab",[5858,15485,15486,15499],{},[5861,15487,15488],{},[5864,15489,15490,15493,15495,15497],{},[5867,15491,15492],{},"Field",[5867,15494,5872],{},[5867,15496,9105],{},[5867,15498,5878],{},[5880,15500,15501,15517,15532,15549,15568],{},[5864,15502,15503,15507,15511,15514],{},[5885,15504,15505],{},[894,15506,4382],{},[5885,15508,15509],{},[894,15510,5894],{},[5885,15512,15513],{},"yes",[5885,15515,15516],{},"Tab label (used by the default UI).",[5864,15518,15519,15523,15527,15529],{},[5885,15520,15521],{},[894,15522,13656],{},[5885,15524,15525],{},[894,15526,5894],{},[5885,15528,15513],{},[5885,15530,15531],{},"Unique tab id used for active state.",[5864,15533,15534,15539,15543,15546],{},[5885,15535,15536],{},[894,15537,15538],{},"panelClassName",[5885,15540,15541],{},[894,15542,5894],{},[5885,15544,15545],{},"no",[5885,15547,15548],{},"Optional panel background classes (used by demos / consumers).",[5864,15550,15551,15555,15559,15561],{},[5885,15552,15553],{},[894,15554,15458],{},[5885,15556,15557],{},[894,15558,10953],{},[5885,15560,15545],{},[5885,15562,15563,15564,15567],{},"Fallback content component when ",[894,15565,15566],{},"#content"," slot is not provided.",[5864,15569,15570,15575,15580,15582],{},[5885,15571,15572],{},[894,15573,15574],{},"contentProps",[5885,15576,15577],{},[894,15578,15579],{},"Record\u003Cstring, any>",[5885,15581,15545],{},[5885,15583,15584,15585,7616],{},"Props passed to the ",[894,15586,15458],{},[3549,15588,15589],{"v-slot:credits":613},[751,15590,15591,15598],{},[754,15592,6969,15593,880],{},[696,15594,15597],{"href":15595,"rel":15596},"https://ui.aceternity.com/components/tabs",[700],"Aceternity UI Tabs",[754,15599,15240,15600,880],{},[696,15601,1023],{"href":1027,"rel":15602},[700],{"title":613,"searchDepth":847,"depth":847,"links":15604},[],"A tabs component with a shared-layout active pill and a stacked content transition.",{},{"title":288,"description":15605},[1067,5952,1051,5954,1023],"SE7xHRxYEqu9fiTwwIeYllbzVecFW5BTNRXfD2tmb_4",{"id":15611,"title":292,"badge":687,"body":15612,"category":267,"description":15677,"extension":856,"links":687,"meta":15678,"navigation":859,"path":293,"seo":15679,"stem":294,"tags":15680,"__hash__":15681},"docs_en/en/2.components/miscellaneous/animated-tooltip.md",{"type":689,"value":15613,"toc":15675},[15614],[5728,15615,15620,15659],{":component-files":15616,"component-id":15617,"config":15618,"demo-file":15619},"[\"AnimatedTooltip.vue\"]","animated-tooltip","AnimatedTooltipConfig","AnimatedTooltipDemo.vue",[3549,15621,15622,15624],{"v-slot:api":613},[882,15623,5856],{"id":5855},[5858,15625,15626,15638],{},[5861,15627,15628],{},[5864,15629,15630,15632,15634,15636],{},[5867,15631,5869],{},[5867,15633,5872],{},[5867,15635,5875],{},[5867,15637,5878],{},[5880,15639,15640],{},[5864,15641,15642,15647,15652,15656],{},[5885,15643,15644],{},[894,15645,15646],{},"items",[5885,15648,15649],{},[894,15650,15651],{},"Array\u003C{id: number, name: string, designation: string, image: string}>",[5885,15653,15654],{},[894,15655,3932],{},[5885,15657,15658],{},"An array of objects, each representing an item. Each object in the array should have the following properties: id, name, designation, image",[3549,15660,15661],{"v-slot:credits":613},[751,15662,15663,15668],{},[754,15664,5929,15665,6725],{},[696,15666,8458],{"href":8456,"rel":15667},[700],[754,15669,6176,15670,880],{},[696,15671,15674],{"href":15672,"rel":15673},"https://ui.aceternity.com/components/animated-tooltip",[700],"Aceternity UI's Animated Tooltip",{"title":613,"searchDepth":847,"depth":847,"links":15676},[],"A cool tooltip that reveals on hover, follows mouse pointer",{},{"title":292,"description":15677},[1067,5952,5954],"APYp2PvHP78b3vZuQUupgMpabB4iwJMDTYSbkoPtR0M",{"id":15683,"title":296,"badge":687,"body":15684,"category":267,"description":15879,"extension":856,"links":687,"meta":15880,"navigation":859,"path":297,"seo":15881,"stem":298,"tags":15882,"__hash__":15884},"docs_en/en/2.components/miscellaneous/bento-grid.md",{"type":689,"value":15685,"toc":15877},[15686],[5728,15687,15692,15863],{":component-files":15688,"component-id":15689,"config":15690,"demo-file":15691},"[\"BentoGrid.vue\", \"BentoGridCard.vue\", \"BentoGridItem.vue\"]","bento-grid","BentoGridConfig","BentoGridDemo.vue",[3549,15693,15694,15696,15702,15752,15758,15779],{"v-slot:api":613},[882,15695,5856],{"id":5855},[3097,15697,15699],{"id":15698},"bentogriditem",[894,15700,15701],{},"BentoGridItem",[5858,15703,15704,15712],{},[5861,15705,15706],{},[5864,15707,15708,15710],{},[5867,15709,11928],{},[5867,15711,5878],{},[5880,15713,15714,15723,15732,15742],{},[5864,15715,15716,15720],{},[5885,15717,15718],{},[894,15719,4382],{},[5885,15721,15722],{},"Component to show as title.",[5864,15724,15725,15729],{},[5885,15726,15727],{},[894,15728,4385],{},[5885,15730,15731],{},"Component to show as description.",[5864,15733,15734,15739],{},[5885,15735,15736],{},[894,15737,15738],{},"icon",[5885,15740,15741],{},"Component to show as icon.",[5864,15743,15744,15749],{},[5885,15745,15746],{},[894,15747,15748],{},"header",[5885,15750,15751],{},"Component to show as header.",[3097,15753,15755],{"id":15754},"bentogridcard",[894,15756,15757],{},"BentoGridCard",[5858,15759,15760,15768],{},[5861,15761,15762],{},[5864,15763,15764,15766],{},[5867,15765,11928],{},[5867,15767,5878],{},[5880,15769,15770],{},[5864,15771,15772,15776],{},[5885,15773,15774],{},[894,15775,5953],{},[5885,15777,15778],{},"Component to show in background.",[5858,15780,15781,15792],{},[5861,15782,15783],{},[5864,15784,15785,15788,15790],{},[5867,15786,15787],{},"Props Name",[5867,15789,5872],{},[5867,15791,5878],{},[5880,15793,15794,15808,15822,15835,15849],{},[5864,15795,15796,15801,15805],{},[5885,15797,15798],{},[894,15799,15800],{},"name",[5885,15802,15803],{},[894,15804,5894],{},[5885,15806,15807],{},"Name or title to show on card.",[5864,15809,15810,15814,15819],{},[5885,15811,15812],{},[894,15813,15738],{},[5885,15815,15816],{},[894,15817,15818],{},"?string",[5885,15820,15821],{},"Icon component to show on card.",[5864,15823,15824,15828,15832],{},[5885,15825,15826],{},[894,15827,4385],{},[5885,15829,15830],{},[894,15831,5894],{},[5885,15833,15834],{},"Description content to show on card.",[5864,15836,15837,15842,15846],{},[5885,15838,15839],{},[894,15840,15841],{},"href",[5885,15843,15844],{},[894,15845,5894],{},[5885,15847,15848],{},"Link to the url for CTA.",[5864,15850,15851,15856,15860],{},[5885,15852,15853],{},[894,15854,15855],{},"cta",[5885,15857,15858],{},[894,15859,5894],{},[5885,15861,15862],{},"Text to show on CTA.",[3549,15864,15865],{"v-slot:credits":613},[751,15866,15867],{},[754,15868,5929,15869,720,15873,7387],{},[696,15870,719],{"href":15871,"rel":15872},"https://ui.aceternity.com/components/bento-grid",[700],[696,15874,725],{"href":15875,"rel":15876},"https://magicui.design/docs/components/bento-grid",[700],{"title":613,"searchDepth":847,"depth":847,"links":15878},[],"A cool grid layout with different child component.",{},{"title":296,"description":15879},[1067,5952,15883,5954],"bento","NXjGZ6V8fIU_GRNeL-Bk88NWMOQ9P_MmSuOxnKkXyuQ",{"id":15886,"title":300,"badge":687,"body":15887,"category":267,"description":16139,"extension":856,"links":687,"meta":16140,"navigation":859,"path":301,"seo":16141,"stem":302,"tags":16142,"__hash__":16144},"docs_en/en/2.components/miscellaneous/book.md",{"type":689,"value":15888,"toc":16137},[15889],[5728,15890,15895,16120],{":component-files":15891,"component-id":15892,"config":15893,"demo-file":15894},"[\"Book.vue\", \"BookHeader.vue\", \"BookTitle.vue\", \"BookDescription.vue\", \"index.ts\"]","book","BookConfig","BookDemo.vue",[3549,15896,15897,15899,15903,16018,16024,16052,16058,16086,16092],{"v-slot:api":613},[882,15898,5856],{"id":5855},[3097,15900,15901],{"id":15892},[894,15902,300],{},[5858,15904,15905,15917],{},[5861,15906,15907],{},[5864,15908,15909,15911,15913,15915],{},[5867,15910,5869],{},[5867,15912,5872],{},[5867,15914,5875],{},[5867,15916,5878],{},[5880,15918,15919,15931,15946,15960,15975,15989,16003],{},[5864,15920,15921,15925,15927,15929],{},[5885,15922,15923],{},[894,15924,5889],{},[5885,15926,13999],{},[5885,15928,5899],{},[5885,15930,6779],{},[5864,15932,15933,15937,15940,15943],{},[5885,15934,15935],{},[894,15936,6933],{},[5885,15938,15939],{},"Number",[5885,15941,15942],{},"1000",[5885,15944,15945],{},"Animation duration in milliseconds.",[5864,15947,15948,15952,15954,15957],{},[5885,15949,15950],{},[894,15951,6485],{},[5885,15953,13999],{},[5885,15955,15956],{},"\"zinc\"",[5885,15958,15959],{},"Color theme for the book gradient.",[5864,15961,15962,15967,15970,15972],{},[5885,15963,15964],{},[894,15965,15966],{},"isStatic",[5885,15968,15969],{},"Boolean",[5885,15971,7446],{},[5885,15973,15974],{},"Disables hover animations when true.",[5864,15976,15977,15981,15983,15986],{},[5885,15978,15979],{},[894,15980,7525],{},[5885,15982,13999],{},[5885,15984,15985],{},"\"md\"",[5885,15987,15988],{},"Size variant of the book.",[5864,15990,15991,15996,15998,16000],{},[5885,15992,15993],{},[894,15994,15995],{},"radius",[5885,15997,13999],{},[5885,15999,15985],{},[5885,16001,16002],{},"Border radius variant of the book.",[5864,16004,16005,16010,16012,16015],{},[5885,16006,16007],{},[894,16008,16009],{},"shadowSize",[5885,16011,13999],{},[5885,16013,16014],{},"\"lg\"",[5885,16016,16017],{},"Shadow size variant of the book.",[3097,16019,16021],{"id":16020},"bookheader",[894,16022,16023],{},"BookHeader",[5858,16025,16026,16038],{},[5861,16027,16028],{},[5864,16029,16030,16032,16034,16036],{},[5867,16031,5869],{},[5867,16033,5872],{},[5867,16035,5875],{},[5867,16037,5878],{},[5880,16039,16040],{},[5864,16041,16042,16046,16048,16050],{},[5885,16043,16044],{},[894,16045,5889],{},[5885,16047,13999],{},[5885,16049,5899],{},[5885,16051,10719],{},[3097,16053,16055],{"id":16054},"booktitle",[894,16056,16057],{},"BookTitle",[5858,16059,16060,16072],{},[5861,16061,16062],{},[5864,16063,16064,16066,16068,16070],{},[5867,16065,5869],{},[5867,16067,5872],{},[5867,16069,5875],{},[5867,16071,5878],{},[5880,16073,16074],{},[5864,16075,16076,16080,16082,16084],{},[5885,16077,16078],{},[894,16079,5889],{},[5885,16081,13999],{},[5885,16083,5899],{},[5885,16085,10719],{},[3097,16087,16089],{"id":16088},"bookdescription",[894,16090,16091],{},"BookDescription",[5858,16093,16094,16106],{},[5861,16095,16096],{},[5864,16097,16098,16100,16102,16104],{},[5867,16099,5869],{},[5867,16101,5872],{},[5867,16103,5875],{},[5867,16105,5878],{},[5880,16107,16108],{},[5864,16109,16110,16114,16116,16118],{},[5885,16111,16112],{},[894,16113,5889],{},[5885,16115,13999],{},[5885,16117,5899],{},[5885,16119,10719],{},[3549,16121,16122],{"v-slot:credits":613},[751,16123,16124,16132],{},[754,16125,5929,16126,16131],{},[696,16127,16130],{"href":16128,"rel":16129},"https://ui.3x.gl/docs/book",[700],"x/UI"," for inspiring this component.",[754,16133,5929,16134,5941],{},[696,16135,6869],{"href":6867,"rel":16136},[700],{"title":613,"searchDepth":847,"depth":847,"links":16138},[],"A 3D book component featuring customizable sizes and color gradients.",{},{"title":300,"description":16139},[1067,5952,16143],"x-ui","HFZCB6SWo8cuFUIm_uF1ctXf3tLm_sxdheDCy3fETfs",{"id":16146,"title":304,"badge":687,"body":16147,"category":267,"description":16556,"extension":856,"links":687,"meta":16557,"navigation":859,"path":305,"seo":16558,"stem":306,"tags":16559,"__hash__":16560},"docs_en/en/2.components/miscellaneous/compare.md",{"type":689,"value":16148,"toc":16554},[16149],[5728,16150,16155,16538],{":component-files":16151,"component-id":16152,"config":16153,"demo-file":16154},"[\"Compare.vue\", \"StarField.vue\"]","compare","CompareConfig","CompareDemo.vue",[3549,16156,16157,16159,16161,16396,16398,16474,16476],{"v-slot:api":613},[882,16158,5856],{"id":5855},[728,16160,3696],{"id":10623},[5858,16162,16163,16175],{},[5861,16164,16165],{},[5864,16166,16167,16169,16171,16173],{},[5867,16168,5869],{},[5867,16170,5872],{},[5867,16172,5875],{},[5867,16174,5878],{},[5880,16176,16177,16195,16213,16232,16251,16268,16286,16304,16322,16342,16360,16378],{},[5864,16178,16179,16184,16188,16192],{},[5885,16180,16181],{},[894,16182,16183],{},"firstImage",[5885,16185,16186],{},[894,16187,5894],{},[5885,16189,16190],{},[894,16191,6077],{},[5885,16193,16194],{},"URL of the first image",[5864,16196,16197,16202,16206,16210],{},[5885,16198,16199],{},[894,16200,16201],{},"secondImage",[5885,16203,16204],{},[894,16205,5894],{},[5885,16207,16208],{},[894,16209,6077],{},[5885,16211,16212],{},"URL of the second image",[5864,16214,16215,16220,16224,16229],{},[5885,16216,16217],{},[894,16218,16219],{},"firstImageAlt",[5885,16221,16222],{},[894,16223,5894],{},[5885,16225,16226],{},[894,16227,16228],{},"\"First image\"",[5885,16230,16231],{},"Alt text for first image",[5864,16233,16234,16239,16243,16248],{},[5885,16235,16236],{},[894,16237,16238],{},"secondImageAlt",[5885,16240,16241],{},[894,16242,5894],{},[5885,16244,16245],{},[894,16246,16247],{},"\"Second image\"",[5885,16249,16250],{},"Alt text for second image",[5864,16252,16253,16257,16261,16265],{},[5885,16254,16255],{},[894,16256,5889],{},[5885,16258,16259],{},[894,16260,5894],{},[5885,16262,16263],{},[894,16264,6077],{},[5885,16266,16267],{},"Additional classes for the component",[5864,16269,16270,16275,16279,16283],{},[5885,16271,16272],{},[894,16273,16274],{},"firstContentClass",[5885,16276,16277],{},[894,16278,5894],{},[5885,16280,16281],{},[894,16282,6077],{},[5885,16284,16285],{},"Classes applied to first content wrapper",[5864,16287,16288,16293,16297,16301],{},[5885,16289,16290],{},[894,16291,16292],{},"secondContentClass",[5885,16294,16295],{},[894,16296,5894],{},[5885,16298,16299],{},[894,16300,6077],{},[5885,16302,16303],{},"Classes applied to second content wrapper",[5864,16305,16306,16311,16315,16319],{},[5885,16307,16308],{},[894,16309,16310],{},"initialSliderPercentage",[5885,16312,16313],{},[894,16314,6016],{},[5885,16316,16317],{},[894,16318,6021],{},[5885,16320,16321],{},"Initial position of slider (0-100)",[5864,16323,16324,16329,16334,16339],{},[5885,16325,16326],{},[894,16327,16328],{},"slideMode",[5885,16330,16331],{},[894,16332,16333],{},"\"hover\" | \"drag\"",[5885,16335,16336],{},[894,16337,16338],{},"\"hover\"",[5885,16340,16341],{},"Interaction mode for the slider",[5864,16343,16344,16349,16353,16357],{},[5885,16345,16346],{},[894,16347,16348],{},"showHandlebar",[5885,16350,16351],{},[894,16352,5914],{},[5885,16354,16355],{},[894,16356,5919],{},[5885,16358,16359],{},"Show/hide the handle bar",[5864,16361,16362,16367,16371,16375],{},[5885,16363,16364],{},[894,16365,16366],{},"autoplay",[5885,16368,16369],{},[894,16370,5914],{},[5885,16372,16373],{},[894,16374,7446],{},[5885,16376,16377],{},"Enable/disable autoplay",[5864,16379,16380,16385,16389,16393],{},[5885,16381,16382],{},[894,16383,16384],{},"autoplayDuration",[5885,16386,16387],{},[894,16388,6016],{},[5885,16390,16391],{},[894,16392,7600],{},[5885,16394,16395],{},"Duration of autoplay cycle in ms",[728,16397,14952],{"id":14951},[5858,16399,16400,16410],{},[5861,16401,16402],{},[5864,16403,16404,16406,16408],{},[5867,16405,10393],{},[5867,16407,14963],{},[5867,16409,5878],{},[5880,16411,16412,16426,16438,16450,16462],{},[5864,16413,16414,16419,16423],{},[5885,16415,16416],{},[894,16417,16418],{},"update:percentage",[5885,16420,16421],{},[894,16422,6016],{},[5885,16424,16425],{},"Emitted when slider position changes (0-100)",[5864,16427,16428,16433,16435],{},[5885,16429,16430],{},[894,16431,16432],{},"drag:start",[5885,16434,5899],{},[5885,16436,16437],{},"Emitted when dragging starts",[5864,16439,16440,16445,16447],{},[5885,16441,16442],{},[894,16443,16444],{},"drag:end",[5885,16446,5899],{},[5885,16448,16449],{},"Emitted when dragging ends",[5864,16451,16452,16457,16459],{},[5885,16453,16454],{},[894,16455,16456],{},"hover:enter",[5885,16458,5899],{},[5885,16460,16461],{},"Emitted when mouse enters component",[5864,16463,16464,16469,16471],{},[5885,16465,16466],{},[894,16467,16468],{},"hover:leave",[5885,16470,5899],{},[5885,16472,16473],{},"Emitted when mouse leaves component",[728,16475,11051],{"id":11050},[5858,16477,16478,16489],{},[5861,16479,16480],{},[5864,16481,16482,16484,16487],{},[5867,16483,11928],{},[5867,16485,16486],{},"Default Content",[5867,16488,5878],{},[5880,16490,16491,16509,16525],{},[5864,16492,16493,16498,16506],{},[5885,16494,16495],{},[894,16496,16497],{},"first-content",[5885,16499,16500,16502,16503,16505],{},[894,16501,11001],{}," element if ",[894,16504,16183],{}," prop is provided",[5885,16507,16508],{},"Content shown on the left/first side of the comparison. Has full access to component width/height.",[5864,16510,16511,16516,16522],{},[5885,16512,16513],{},[894,16514,16515],{},"second-content",[5885,16517,16518,16502,16520,16505],{},[894,16519,11001],{},[894,16521,16201],{},[5885,16523,16524],{},"Content shown on the right/second side of the comparison. Has full access to component width/height.",[5864,16526,16527,16532,16535],{},[5885,16528,16529],{},[894,16530,16531],{},"handle",[5885,16533,16534],{},"Default slider handle with dots icon",[5885,16536,16537],{},"Custom handle for the slider. Automatically positioned at the dividing line. Should handle positioning with absolute positioning.",[3549,16539,16540],{"v-slot:credits":613},[751,16541,16542,16547],{},[754,16543,5929,16544,6725],{},[696,16545,8458],{"href":8456,"rel":16546},[700],[754,16548,6176,16549,880],{},[696,16550,16553],{"href":16551,"rel":16552},"https://ui.aceternity.com/components/compare",[700],"Aceternity UI's Compare",{"title":613,"searchDepth":847,"depth":847,"links":16555},[],"Slide to compare any two pieces of content - images, designs, code, or custom elements",{},{"title":304,"description":16556},[1067,5952,5954],"JGrfcHBT9rc2kxdzk-B09NkJAkrv-faBpVRe7G6v2Qs",{"id":16562,"title":308,"badge":687,"body":16563,"category":267,"description":16800,"extension":856,"links":687,"meta":16801,"navigation":859,"path":309,"seo":16802,"stem":310,"tags":16803,"__hash__":16804},"docs_en/en/2.components/miscellaneous/container-scroll.md",{"type":689,"value":16564,"toc":16798},[16565],[5728,16566,16571,16789],{":component-files":16567,"component-id":16568,"config":16569,"demo-file":16570},"[\"ContainerScroll.vue\", \"ContainerScrollTitle.vue\", \"ContainerScrollCard.vue\"]","container-scroll","ContainerScrollConfig","ContainerScrollDemo.vue",[3549,16572,16573,16575,16581,16586,16648,16654,16659,16691,16697,16702,16748,16752,16755],{"v-slot:api":613},[882,16574,5856],{"id":5855},[728,16576,16578],{"id":16577},"containerscroll",[894,16579,16580],{},"ContainerScroll",[692,16582,10617,16583,16585],{},[894,16584,16580],{}," component creates a 3D scroll effect. As the user scrolls, the content inside the container is transformed with scale, rotation, and translation effects.",[5858,16587,16588,16600],{},[5861,16589,16590],{},[5864,16591,16592,16594,16596,16598],{},[5867,16593,5869],{},[5867,16595,5872],{},[5867,16597,5875],{},[5867,16599,5878],{},[5880,16601,16602,16617,16633],{},[5864,16603,16604,16608,16610,16614],{},[5885,16605,16606],{},[894,16607,11906],{},[5885,16609,15939],{},[5885,16611,16612],{},[894,16613,6157],{},[5885,16615,16616],{},"Controls the rotation of the inner content based on the scroll progress.",[5864,16618,16619,16624,16626,16630],{},[5885,16620,16621],{},[894,16622,16623],{},"scale",[5885,16625,15939],{},[5885,16627,16628],{},[894,16629,1758],{},[5885,16631,16632],{},"Controls the scaling transformation applied to the content during the scroll.",[5864,16634,16635,16639,16641,16645],{},[5885,16636,16637],{},[894,16638,10806],{},[5885,16640,15939],{},[5885,16642,16643],{},[894,16644,6157],{},[5885,16646,16647],{},"Controls the vertical translation of the title during the scroll.",[728,16649,16651],{"id":16650},"containerscrolltitle",[894,16652,16653],{},"ContainerScrollTitle",[692,16655,10617,16656,16658],{},[894,16657,16653],{}," component handles the title's transformation as the user scrolls, applying a vertical translation effect.",[5858,16660,16661,16673],{},[5861,16662,16663],{},[5864,16664,16665,16667,16669,16671],{},[5867,16666,5869],{},[5867,16668,5872],{},[5867,16670,5875],{},[5867,16672,5878],{},[5880,16674,16675],{},[5864,16676,16677,16682,16684,16688],{},[5885,16678,16679],{},[894,16680,16681],{},"translate",[5885,16683,15939],{},[5885,16685,16686],{},[894,16687,6157],{},[5885,16689,16690],{},"Controls the vertical translation of the title.",[728,16692,16694],{"id":16693},"containerscrollcard",[894,16695,16696],{},"ContainerScrollCard",[692,16698,10617,16699,16701],{},[894,16700,16696],{}," component applies scale and rotation effects to the card content as the user scrolls through the page.",[5858,16703,16704,16716],{},[5861,16705,16706],{},[5864,16707,16708,16710,16712,16714],{},[5867,16709,5869],{},[5867,16711,5872],{},[5867,16713,5875],{},[5867,16715,5878],{},[5880,16717,16718,16733],{},[5864,16719,16720,16724,16726,16730],{},[5885,16721,16722],{},[894,16723,11906],{},[5885,16725,15939],{},[5885,16727,16728],{},[894,16729,6157],{},[5885,16731,16732],{},"Controls the rotation effect of the card.",[5864,16734,16735,16739,16741,16745],{},[5885,16736,16737],{},[894,16738,16623],{},[5885,16740,15939],{},[5885,16742,16743],{},[894,16744,1758],{},[5885,16746,16747],{},"Controls the scaling effect applied to the card.",[882,16749,16751],{"id":16750},"css-variables","CSS Variables",[692,16753,16754],{},"To customize the scroll animations and responsiveness, you can set the following CSS variables:",[751,16756,16757,16765,16773,16781],{},[754,16758,16759,16764],{},[702,16760,16761],{},[894,16762,16763],{},"--scale-start",": Initial scale value for the card.",[754,16766,16767,16772],{},[702,16768,16769],{},[894,16770,16771],{},"--scale-end",": Final scale value for the card as the scroll progresses.",[754,16774,16775,16780],{},[702,16776,16777],{},[894,16778,16779],{},"--rotate-start",": Initial rotation value for the card.",[754,16782,16783,16788],{},[702,16784,16785],{},[894,16786,16787],{},"--rotate-end",": Final rotation value for the card as the scroll progresses.",[3549,16790,16791],{"v-slot:credits":613},[754,16792,6857,16793,880],{},[696,16794,16797],{"href":16795,"rel":16796},"https://ui.aceternity.com/components/container-scroll-animation",[700],"Aceternity UI Container Scroll Animation",{"title":613,"searchDepth":847,"depth":847,"links":16799},[],"A container scrolling effect that transforms the content inside based on scroll progress. Features smooth transitions with scaling and rotating effects on scroll.",{},{"title":308,"description":16800},[1067,5952,5954],"-U8l5_eXEnJNM1GZh3gJ2vicR44pc-z9U4_wE-EjDyo",{"id":16806,"title":312,"badge":687,"body":16807,"category":267,"description":16977,"extension":856,"links":687,"meta":16978,"navigation":859,"path":313,"seo":16979,"stem":314,"tags":16980,"__hash__":16981},"docs_en/en/2.components/miscellaneous/dock.md",{"type":689,"value":16808,"toc":16975},[16809],[5728,16810,16815,16968],{":component-files":16811,"component-id":16812,"config":16813,"demo-file":16814},"[\"Dock.vue\", \"DockIcon.vue\", \"DockSeparator.vue\", \"index.ts\", \"types.ts\", \"injectionKeys.ts\"]","dock","DockConfig","DockDemo.vue",[3549,16816,16817,16819,16823,16920,16941,16947],{"v-slot:api":613},[882,16818,5856],{"id":5855},[728,16820,16821],{"id":16812},[894,16822,312],{},[5858,16824,16825,16835],{},[5861,16826,16827],{},[5864,16828,16829,16831,16833],{},[5867,16830,5869],{},[5867,16832,5872],{},[5867,16834,5878],{},[5880,16836,16837,16850,16864,16878,16899],{},[5864,16838,16839,16843,16847],{},[5885,16840,16841],{},[894,16842,5889],{},[5885,16844,16845],{},[894,16846,5894],{},[5885,16848,16849],{},"Additional classes to apply to the dock container.",[5864,16851,16852,16857,16861],{},[5885,16853,16854],{},[894,16855,16856],{},"magnification",[5885,16858,16859],{},[894,16860,6016],{},[5885,16862,16863],{},"Magnification factor for the dock icons on hover (default: 60).",[5864,16865,16866,16871,16875],{},[5885,16867,16868],{},[894,16869,16870],{},"distance",[5885,16872,16873],{},[894,16874,6016],{},[5885,16876,16877],{},"Distance from the icon center where magnification applies.",[5864,16879,16880,16884,16888],{},[5885,16881,16882],{},[894,16883,7459],{},[5885,16885,16886],{},[894,16887,5894],{},[5885,16889,16890,16891,4270,16893,4270,16896,16898],{},"Alignment of icons (",[894,16892,4005],{},[894,16894,16895],{},"middle",[894,16897,4146],{},") (default: middle).",[5864,16900,16901,16906,16910],{},[5885,16902,16903],{},[894,16904,16905],{},"orientation",[5885,16907,16908],{},[894,16909,5894],{},[5885,16911,16912,16913,4270,16916,16919],{},"Orientation of Dock (",[894,16914,16915],{},"vertical",[894,16917,16918],{},"horizontal",") (default: horizontal).",[5858,16921,16922,16930],{},[5861,16923,16924],{},[5864,16925,16926,16928],{},[5867,16927,11928],{},[5867,16929,5878],{},[5880,16931,16932],{},[5864,16933,16934,16938],{},[5885,16935,16936],{},[894,16937,3785],{},[5885,16939,16940],{},"Dock Dock or other child components to be displayed.",[728,16942,16944],{"id":16943},"dockicon",[894,16945,16946],{},"DockIcon",[5858,16948,16949,16957],{},[5861,16950,16951],{},[5864,16952,16953,16955],{},[5867,16954,11928],{},[5867,16956,5878],{},[5880,16958,16959],{},[5864,16960,16961,16965],{},[5885,16962,16963],{},[894,16964,3785],{},[5885,16966,16967],{},"Component or icon to be displayed inside the dock icon.",[3549,16969,16970],{"v-slot:credits":613},[751,16971,16972],{},[754,16973,16974],{},"Credits to macOS Dock for the design inspiration and the fantastic hover magnification effect.",{"title":613,"searchDepth":847,"depth":847,"links":16976},[],"A macOS-style dock with magnifying icons as you hover over them.",{},{"title":312,"description":16977},[1067,5952],"9c-FkktU_sqkVnpBA0ELhA1S4tL4d_7hpaS_0wczmbo",{"id":16983,"title":316,"badge":687,"body":16984,"category":267,"description":17042,"extension":856,"links":687,"meta":17043,"navigation":859,"path":317,"seo":17044,"stem":318,"tags":17045,"__hash__":17047},"docs_en/en/2.components/miscellaneous/expandable-gallery.md",{"type":689,"value":16985,"toc":17040},[16986],[5728,16987,16992,17029],{":component-files":16988,"component-id":16989,"config":16990,"demo-file":16991},"[\"ExpandableGallery.vue\"]","expandable-gallery","ExpandableGalleryConfig","ExpandableGalleryDemo.vue",[3549,16993,16994,16996],{"v-slot:api":613},[882,16995,5856],{"id":5855},[5858,16997,16998,17010],{},[5861,16999,17000],{},[5864,17001,17002,17004,17006,17008],{},[5867,17003,5869],{},[5867,17005,5872],{},[5867,17007,5875],{},[5867,17009,5878],{},[5880,17011,17012],{},[5864,17013,17014,17018,17022,17026],{},[5885,17015,17016],{},[894,17017,12507],{},[5885,17019,17020],{},[894,17021,9806],{},[5885,17023,17024],{},[894,17025,3932],{},[5885,17027,17028],{},"Array of image URLs to display in the gallery.",[3549,17030,17031],{"v-slot:credits":613},[751,17032,17033],{},[754,17034,6176,17035],{},[696,17036,17039],{"href":17037,"rel":17038},"https://x.com/davidm_ml/status/1872319793124282653",[700],"Expandable Gallery Component by David Mráz",{"title":613,"searchDepth":847,"depth":847,"links":17041},[],"A responsive image gallery with an interactive hover effect that expands images dynamically.",{},{"title":316,"description":17042},[1067,5952,17046],"gallery","kdR6prpNkXXEGMscNzqnBJLn0vgKVBUv3YayaGkFLcU",{"id":17049,"title":320,"badge":687,"body":17050,"category":267,"description":17300,"extension":856,"links":687,"meta":17301,"navigation":859,"path":321,"seo":17302,"stem":322,"tags":17303,"__hash__":17304},"docs_en/en/2.components/miscellaneous/images-slider.md",{"type":689,"value":17051,"toc":17298},[17052],[5728,17053,17058,17280],{":component-files":17054,"component-id":17055,"config":17056,"demo-file":17057},"[\"ImagesSlider.vue\"]","images-slider","ImagesSliderConfig","ImagesSliderDemo.vue",[3549,17059,17060,17062],{"v-slot:api":613},[882,17061,5856],{"id":5855},[5858,17063,17064,17076],{},[5861,17065,17066],{},[5864,17067,17068,17070,17072,17074],{},[5867,17069,5869],{},[5867,17071,5872],{},[5867,17073,5875],{},[5867,17075,5878],{},[5880,17077,17078,17095,17113,17131,17149,17168,17187,17205,17226,17245,17263],{},[5864,17079,17080,17084,17088,17092],{},[5885,17081,17082],{},[894,17083,12507],{},[5885,17085,17086],{},[894,17087,9806],{},[5885,17089,17090],{},[894,17091,3932],{},[5885,17093,17094],{},"An array of image URLs to show in the slider.",[5864,17096,17097,17102,17106,17110],{},[5885,17098,17099],{},[894,17100,17101],{},"hideOverlay",[5885,17103,17104],{},[894,17105,5914],{},[5885,17107,17108],{},[894,17109,7446],{},[5885,17111,17112],{},"Don't create an overlay for the image slider. Slot won't be rendered.",[5864,17114,17115,17119,17123,17128],{},[5885,17116,17117],{},[894,17118,15105],{},[5885,17120,17121],{},[894,17122,5894],{},[5885,17124,17125],{},[894,17126,17127],{},"''",[5885,17129,17130],{},"A class string to be applied to the overlay container.",[5864,17132,17133,17137,17141,17146],{},[5885,17134,17135],{},[894,17136,11587],{},[5885,17138,17139],{},[894,17140,5894],{},[5885,17142,17143],{},[894,17144,17145],{},"'bg-cover bg-center bg-no-repeat'",[5885,17147,17148],{},"Class string to apply to each of the images.",[5864,17150,17151,17156,17160,17165],{},[5885,17152,17153],{},[894,17154,17155],{},"enterFromClass",[5885,17157,17158],{},[894,17159,5894],{},[5885,17161,17162],{},[894,17163,17164],{},"'scale-0 origin-center'",[5885,17166,17167],{},"Class string applied to the 'enter-from-class' prop on the image transition.",[5864,17169,17170,17175,17179,17184],{},[5885,17171,17172],{},[894,17173,17174],{},"enterActiveClass",[5885,17176,17177],{},[894,17178,5894],{},[5885,17180,17181],{},[894,17182,17183],{},"'transition-transform duration-300 ease-in-out'",[5885,17185,17186],{},"Class string applied to the 'enter-active-class' prop on the image transition.",[5864,17188,17189,17194,17198,17202],{},[5885,17190,17191],{},[894,17192,17193],{},"leaveActiveClass",[5885,17195,17196],{},[894,17197,5894],{},[5885,17199,17200],{},[894,17201,17183],{},[5885,17203,17204],{},"Class string applied to the 'leave-active-class' prop on the image transition.",[5864,17206,17207,17211,17216,17220],{},[5885,17208,17209],{},[894,17210,16366],{},[5885,17212,17213],{},[894,17214,17215],{},"boolean|number",[5885,17217,17218],{},[894,17219,7446],{},[5885,17221,17222,17223,17225],{},"Autoplay interval in ms, or ",[894,17224,7446],{}," to disable.",[5864,17227,17228,17232,17237,17242],{},[5885,17229,17230],{},[894,17231,7459],{},[5885,17233,17234],{},[894,17235,17236],{},"'vertical'|'horizontal'",[5885,17238,17239],{},[894,17240,17241],{},"'vertical'",[5885,17243,17244],{},"The axis on which the slider should operate.",[5864,17246,17247,17251,17255,17260],{},[5885,17248,17249],{},[894,17250,9586],{},[5885,17252,17253],{},[894,17254,5894],{},[5885,17256,17257],{},[894,17258,17259],{},"'1000px'",[5885,17261,17262],{},"The perspective to apply to the slider container.",[5864,17264,17265,17269,17273,17277],{},[5885,17266,17267],{},[894,17268,15322],{},[5885,17270,17271],{},[894,17272,6016],{},[5885,17274,17275],{},[894,17276,6157],{},[5885,17278,17279],{},"Two-way binding for the current slide image index.",[3549,17281,17282],{"v-slot:credits":613},[751,17283,17284,17292],{},[754,17285,17286,17287,5941],{},"Component by ",[696,17288,17291],{"href":17289,"rel":17290},"https://github.com/craigrileyuk",[700],"Craig Riley",[754,17293,5929,17294,16131],{},[696,17295,719],{"href":17296,"rel":17297},"https://ui.aceternity.com/components/images-slider",[700],{"title":613,"searchDepth":847,"depth":847,"links":17299},[],"A full page slider with images that can be navigated with the keyboard.",{},{"title":320,"description":17300},[1067,5952,12507,5954],"T1jjIGnlRI70nxjqX0PcOzsIOBGGHop-cbkTZyFZx4k",{"id":17306,"title":324,"badge":687,"body":17307,"category":267,"description":17444,"extension":856,"links":687,"meta":17445,"navigation":859,"path":325,"seo":17446,"stem":326,"tags":17447,"__hash__":17448},"docs_en/en/2.components/miscellaneous/lens.md",{"type":689,"value":17308,"toc":17442},[17309],[5728,17310,17315,17427],{":component-files":17311,"component-id":17312,"config":17313,"demo-file":17314},"[\"Lens.vue\", \"Rays.vue\", \"Beams.vue\"]","lens","LensConfig","LensDemo.vue",[3549,17316,17317,17319],{"v-slot:api":613},[882,17318,5856],{"id":5855},[5858,17320,17321,17333],{},[5861,17322,17323],{},[5864,17324,17325,17327,17329,17331],{},[5867,17326,5869],{},[5867,17328,5872],{},[5867,17330,5875],{},[5867,17332,5878],{},[5880,17334,17335,17353,17372,17392,17409],{},[5864,17336,17337,17342,17346,17350],{},[5885,17338,17339],{},[894,17340,17341],{},"zoomFactor",[5885,17343,17344],{},[894,17345,6016],{},[5885,17347,17348],{},[894,17349,9469],{},[5885,17351,17352],{},"The magnification factor for the lens.",[5864,17354,17355,17360,17364,17369],{},[5885,17356,17357],{},[894,17358,17359],{},"lensSize",[5885,17361,17362],{},[894,17363,6016],{},[5885,17365,17366],{},[894,17367,17368],{},"170",[5885,17370,17371],{},"The diameter of the lens in pixels.",[5864,17373,17374,17379,17384,17389],{},[5885,17375,17376],{},[894,17377,17378],{},"position",[5885,17380,17381],{},[894,17382,17383],{},"{ x: number, y: number }",[5885,17385,17386],{},[894,17387,17388],{},"{ x: 200, y: 150 }",[5885,17390,17391],{},"The static position of the lens (when isStatic is true).",[5864,17393,17394,17398,17402,17406],{},[5885,17395,17396],{},[894,17397,15966],{},[5885,17399,17400],{},[894,17401,5914],{},[5885,17403,17404],{},[894,17405,7446],{},[5885,17407,17408],{},"If true, the lens stays in a fixed position; if false, it follows the mouse.",[5864,17410,17411,17415,17419,17424],{},[5885,17412,17413],{},[894,17414,15469],{},[5885,17416,17417],{},[894,17418,5914],{},[5885,17420,17421],{},[894,17422,17423],{},"\"false\"",[5885,17425,17426],{},"External control for the hover state.",[3549,17428,17429],{"v-slot:credits":613},[751,17430,17431,17437],{},[754,17432,5929,17433,880],{},[696,17434,719],{"href":17435,"rel":17436},"https://ui.aceternity.com/components/lens",[700],[754,17438,5929,17439,5941],{},[696,17440,5940],{"href":5938,"rel":17441},[700],{"title":613,"searchDepth":847,"depth":847,"links":17443},[],"A lens component to zoom into images, videos, or practically anything.",{},{"title":324,"description":17444},[1067,5952,5954],"m1lWk9rd8ue9nSAQO2AS0hk6CSIVCiK1oE9kHkEDoHc",{"id":17450,"title":328,"badge":687,"body":17451,"category":267,"description":17631,"extension":856,"links":687,"meta":17632,"navigation":859,"path":329,"seo":17633,"stem":330,"tags":17634,"__hash__":17635},"docs_en/en/2.components/miscellaneous/link-preview.md",{"type":689,"value":17452,"toc":17629},[17453],[5728,17454,17460,17613],{":component-files":17455,"component-id":17456,"config":17457,"demo-file":17458,"dependencies":17459},"[\"LinkPreview.vue\"]","link-preview","LinkPreviewConfig","LinkPreviewDemo.vue","qss",[3549,17461,17462,17464],{"v-slot:api":613},[882,17463,5856],{"id":5855},[5858,17465,17466,17478],{},[5861,17467,17468],{},[5864,17469,17470,17472,17474,17476],{},[5867,17471,5869],{},[5867,17473,5872],{},[5867,17475,5875],{},[5867,17477,5878],{},[5880,17479,17480,17497,17515,17532,17550,17570,17592],{},[5864,17481,17482,17486,17490,17494],{},[5885,17483,17484],{},[894,17485,5889],{},[5885,17487,17488],{},[894,17489,5894],{},[5885,17491,17492],{},[894,17493,6077],{},[5885,17495,17496],{},"Custom class applied to the main element.",[5864,17498,17499,17504,17508,17512],{},[5885,17500,17501],{},[894,17502,17503],{},"linkClass",[5885,17505,17506],{},[894,17507,5894],{},[5885,17509,17510],{},[894,17511,6077],{},[5885,17513,17514],{},"Custom class applied to the link element.",[5864,17516,17517,17521,17525,17529],{},[5885,17518,17519],{},[894,17520,6649],{},[5885,17522,17523],{},[894,17524,6016],{},[5885,17526,17527],{},[894,17528,6513],{},[5885,17530,17531],{},"Width of the preview image.",[5864,17533,17534,17538,17542,17547],{},[5885,17535,17536],{},[894,17537,6667],{},[5885,17539,17540],{},[894,17541,6016],{},[5885,17543,17544],{},[894,17545,17546],{},"125",[5885,17548,17549],{},"Height of the preview image.",[5864,17551,17552,17556,17560,17564],{},[5885,17553,17554],{},[894,17555,15966],{},[5885,17557,17558],{},[894,17559,5914],{},[5885,17561,17562],{},[894,17563,7446],{},[5885,17565,17566,17567,17569],{},"Determines if the preview image is static or a URL preview (set to ",[894,17568,5919],{}," for static mode).",[5864,17571,17572,17577,17581,17585],{},[5885,17573,17574],{},[894,17575,17576],{},"imageSrc",[5885,17578,17579],{},[894,17580,5894],{},[5885,17582,17583],{},[894,17584,6077],{},[5885,17586,17587,17588,4776,17590,3001],{},"The source of the image to display (required if ",[894,17589,15966],{},[894,17591,5919],{},[5864,17593,17594,17598,17602,17606],{},[5885,17595,17596],{},[894,17597,13313],{},[5885,17599,17600],{},[894,17601,5894],{},[5885,17603,17604],{},[894,17605,6077],{},[5885,17607,17608,17609,4776,17611,3001],{},"URL for the link and for generating the preview image (required if ",[894,17610,15966],{},[894,17612,7446],{},[3549,17614,17615],{"v-slot:credits":613},[751,17616,17617,17622],{},[754,17618,5929,17619,5941],{},[696,17620,8458],{"href":8456,"rel":17621},[700],[754,17623,6969,17624,880],{},[696,17625,17628],{"href":17626,"rel":17627},"https://ui.aceternity.com/components/link-preview",[700],"Aceternity UI's Link Preview",{"title":613,"searchDepth":847,"depth":847,"links":17630},[],"Dynamic link previews for your anchor tags",{},{"title":328,"description":17631},[1067,5952,5954],"qWOGlE_X07dPqRf2lhVSyLvKTDKl8h84tPNuxrOgPAk",{"id":17637,"title":332,"badge":687,"body":17638,"category":267,"description":17787,"extension":856,"links":687,"meta":17788,"navigation":859,"path":333,"seo":17789,"stem":334,"tags":17790,"__hash__":17791},"docs_en/en/2.components/miscellaneous/marquee.md",{"type":689,"value":17639,"toc":17785},[17640],[5728,17641,17646,17777],{":component-files":17642,"component-id":17643,"config":17644,"demo-file":17645},"[\"Marquee.vue\", \"ReviewCard.vue\"]","marquee","MarqueeConfig","MarqueeDemo.vue",[3549,17647,17648,17650,17754,17756,17759],{"v-slot:api":613},[882,17649,5856],{"id":5855},[5858,17651,17652,17664],{},[5861,17653,17654],{},[5864,17655,17656,17658,17660,17662],{},[5867,17657,5869],{},[5867,17659,5872],{},[5867,17661,5875],{},[5867,17663,5878],{},[5880,17665,17666,17683,17701,17719,17736],{},[5864,17667,17668,17672,17676,17680],{},[5885,17669,17670],{},[894,17671,5889],{},[5885,17673,17674],{},[894,17675,5894],{},[5885,17677,17678],{},[894,17679,17127],{},[5885,17681,17682],{},"Custom CSS classes to apply to the outermost container of the marquee.",[5864,17684,17685,17690,17694,17698],{},[5885,17686,17687],{},[894,17688,17689],{},"reverse",[5885,17691,17692],{},[894,17693,5914],{},[5885,17695,17696],{},[894,17697,7446],{},[5885,17699,17700],{},"Sets the scrolling direction to reverse (right to left or bottom to top).",[5864,17702,17703,17708,17712,17716],{},[5885,17704,17705],{},[894,17706,17707],{},"pauseOnHover",[5885,17709,17710],{},[894,17711,5914],{},[5885,17713,17714],{},[894,17715,7446],{},[5885,17717,17718],{},"Pauses the marquee animation when hovered.",[5864,17720,17721,17725,17729,17733],{},[5885,17722,17723],{},[894,17724,16915],{},[5885,17726,17727],{},[894,17728,5914],{},[5885,17730,17731],{},[894,17732,7446],{},[5885,17734,17735],{},"Sets the scrolling direction to vertical instead of horizontal.",[5864,17737,17738,17743,17747,17751],{},[5885,17739,17740],{},[894,17741,17742],{},"repeat",[5885,17744,17745],{},[894,17746,6016],{},[5885,17748,17749],{},[894,17750,6236],{},[5885,17752,17753],{},"Number of times the content inside the marquee should be repeated.",[882,17755,16751],{"id":16750},[692,17757,17758],{},"You can customize the speed and gap between the items by setting the following CSS variables:",[751,17760,17761,17769],{},[754,17762,17763,17768],{},[702,17764,17765],{},[894,17766,17767],{},"--duration",": Controls the speed of the marquee animation.",[754,17770,17771,17776],{},[702,17772,17773],{},[894,17774,17775],{},"--gap",": Sets the space between repeated items in the marquee.",[3549,17778,17779],{"v-slot:credits":613},[754,17780,6857,17781,880],{},[696,17782,725],{"href":17783,"rel":17784},"https://magicui.design/docs/components/marquee",[700],{"title":613,"searchDepth":847,"depth":847,"links":17786},[],"A customizable scrolling component that loops its content horizontally or vertically, with configurable direction, hover pause, and repeat options.",{},{"title":332,"description":17787},[1067,5952,6732],"Eo5SXXx1PoPzyCpGkkCmv0owxLgsbLXAkcK_VQHG5gc",{"id":17793,"title":336,"badge":687,"body":17794,"category":267,"description":17927,"extension":856,"links":687,"meta":17928,"navigation":859,"path":337,"seo":17929,"stem":338,"tags":17930,"__hash__":17931},"docs_en/en/2.components/miscellaneous/morphing-tabs.md",{"type":689,"value":17795,"toc":17925},[17796],[5728,17797,17802,17909],{":component-files":17798,"component-id":17799,"config":17800,"demo-file":17801},"[\"MorphingTabs.vue\"]","morphing-tabs","MorphingTabsConfig","MorphingTabsDemo.vue",[3549,17803,17804,17806],{"v-slot:api":613},[882,17805,5856],{"id":5855},[5858,17807,17808,17820],{},[5861,17809,17810],{},[5864,17811,17812,17814,17816,17818],{},[5867,17813,5869],{},[5867,17815,5872],{},[5867,17817,5875],{},[5867,17819,5878],{},[5880,17821,17822,17838,17855,17873,17891],{},[5864,17823,17824,17828,17832,17836],{},[5885,17825,17826],{},[894,17827,5889],{},[5885,17829,17830],{},[894,17831,5894],{},[5885,17833,17834],{},[894,17835,6077],{},[5885,17837,8834],{},[5864,17839,17840,17844,17848,17852],{},[5885,17841,17842],{},[894,17843,1051],{},[5885,17845,17846],{},[894,17847,9806],{},[5885,17849,17850],{},[894,17851,3932],{},[5885,17853,17854],{},"Tabs.",[5864,17856,17857,17862,17866,17870],{},[5885,17858,17859],{},[894,17860,17861],{},"activeTab",[5885,17863,17864],{},[894,17865,5894],{},[5885,17867,17868],{},[894,17869,6077],{},[5885,17871,17872],{},"Current active Tab.",[5864,17874,17875,17880,17884,17888],{},[5885,17876,17877],{},[894,17878,17879],{},"margin",[5885,17881,17882],{},[894,17883,6016],{},[5885,17885,17886],{},[894,17887,12032],{},[5885,17889,17890],{},"Active tab margin left and right.",[5864,17892,17893,17898,17902,17906],{},[5885,17894,17895],{},[894,17896,17897],{},"blurStdDeviation",[5885,17899,17900],{},[894,17901,6016],{},[5885,17903,17904],{},[894,17905,6603],{},[5885,17907,17908],{},"Svg blur stdDeviation, tab rounded use it.",[3549,17910,17911],{"v-slot:credits":613},[751,17912,17913,17918],{},[754,17914,5929,17915,6725],{},[696,17916,8882],{"href":8880,"rel":17917},[700],[754,17919,6435,17920,880],{},[696,17921,17924],{"href":17922,"rel":17923},"https://x.com/wickedmishra/status/1823026659894940124",[700],"@Preet \"Exclusion tabs\"",{"title":613,"searchDepth":847,"depth":847,"links":17926},[],"This is a morphing tabs interaction, recreated by Preet's work and featuring the gooey effect component.",{},{"title":336,"description":17927},[1067,5952],"j0rc3PDSRql-n-WDdvb_r3Ew4F37PN2FfoVBOzUvDSw",{"id":17933,"title":340,"badge":687,"body":17934,"category":267,"description":18115,"extension":856,"links":687,"meta":18116,"navigation":859,"path":341,"seo":18117,"stem":342,"tags":18118,"__hash__":18119},"docs_en/en/2.components/miscellaneous/multi-step-loader.md",{"type":689,"value":17935,"toc":18113},[17936],[5728,17937,17942,18097],{":component-files":17938,"component-id":17939,"config":17940,"demo-file":17941},"[\"MultiStepLoader.vue\"]","multi-step-loader","MultiStepLoaderConfig","MultiStepLoaderDemo.vue",[3549,17943,17944,17946,18040],{"v-slot:api":613},[882,17945,5856],{"id":5855},[5858,17947,17948,17960],{},[5861,17949,17950],{},[5864,17951,17952,17954,17956,17958],{},[5867,17953,5869],{},[5867,17955,5872],{},[5867,17957,5875],{},[5867,17959,5878],{},[5880,17961,17962,17983,18001,18020],{},[5864,17963,17964,17969,17973,17977],{},[5885,17965,17966],{},[894,17967,17968],{},"loading",[5885,17970,17971],{},[894,17972,5914],{},[5885,17974,17975],{},[894,17976,7446],{},[5885,17978,17979,17980,17982],{},"Controls the visibility of the loader. When ",[894,17981,5919],{},", the loader is displayed.",[5864,17984,17985,17989,17994,17998],{},[5885,17986,17987],{},[894,17988,887],{},[5885,17990,17991],{},[894,17992,17993],{},"Step[]",[5885,17995,17996],{},[894,17997,3932],{},[5885,17999,18000],{},"Array of step objects defining the loading sequence.",[5864,18002,18003,18008,18012,18017],{},[5885,18004,18005],{},[894,18006,18007],{},"defaultDuration",[5885,18009,18010],{},[894,18011,6016],{},[5885,18013,18014],{},[894,18015,18016],{},"1500",[5885,18018,18019],{},"The duration of each step in milliseconds.",[5864,18021,18022,18027,18031,18035],{},[5885,18023,18024],{},[894,18025,18026],{},"preventClose",[5885,18028,18029],{},[894,18030,5914],{},[5885,18032,18033],{},[894,18034,7446],{},[5885,18036,11338,18037,18039],{},[894,18038,5919],{},", the close button will not be shown.",[5858,18041,18042,18053],{},[5861,18043,18044],{},[5864,18045,18046,18048,18051],{},[5867,18047,10393],{},[5867,18049,18050],{},"Payload Type",[5867,18052,5878],{},[5880,18054,18055,18069,18084],{},[5864,18056,18057,18062,18066],{},[5885,18058,18059],{},[894,18060,18061],{},"state-change",[5885,18063,18064],{},[894,18065,6016],{},[5885,18067,18068],{},"Emitted when the current step changes, providing the new step index.",[5864,18070,18071,18076,18081],{},[5885,18072,18073],{},[894,18074,18075],{},"complete",[5885,18077,18078],{},[894,18079,18080],{},"void",[5885,18082,18083],{},"Emitted when all steps have been completed.",[5864,18085,18086,18090,18094],{},[5885,18087,18088],{},[894,18089,15002],{},[5885,18091,18092],{},[894,18093,18080],{},[5885,18095,18096],{},"Emitted when the loader is closed by button.",[3549,18098,18099],{"v-slot:credits":613},[751,18100,18101,18106],{},[754,18102,5929,18103,6725],{},[696,18104,8458],{"href":8456,"rel":18105},[700],[754,18107,6176,18108,880],{},[696,18109,18112],{"href":18110,"rel":18111},"https://ui.aceternity.com/components/multi-step-loader",[700],"Aceternity UI's Multi Step Loader",{"title":613,"searchDepth":847,"depth":847,"links":18114},[],"A step loader for screens that works with async conditions too.",{},{"title":340,"description":18115},[1067,5952,5954],"FqNSuw3xfO64tAjYnuPyL7yipyclyBYlxQv4LjsTo0Q",{"id":18121,"title":344,"badge":687,"body":18122,"category":267,"description":18220,"extension":856,"links":687,"meta":18221,"navigation":859,"path":345,"seo":18222,"stem":346,"tags":18223,"__hash__":18224},"docs_en/en/2.components/miscellaneous/photo-gallery.md",{"type":689,"value":18123,"toc":18218},[18124],[5728,18125,18130,18201],{":component-files":18126,"component-id":18127,"config":18128,"demo-file":18129},"[\"PhotoGallery.vue\"]","photo-gallery","PhotoGalleryConfig","PhotoGalleryDemo.vue",[3549,18131,18132,18134],{"v-slot:api":613},[882,18133,5856],{"id":5855},[5858,18135,18136,18148],{},[5861,18137,18138],{},[5864,18139,18140,18142,18144,18146],{},[5867,18141,5869],{},[5867,18143,5872],{},[5867,18145,5875],{},[5867,18147,5878],{},[5880,18149,18150,18168,18185],{},[5864,18151,18152,18156,18161,18165],{},[5885,18153,18154],{},[894,18155,15646],{},[5885,18157,18158],{},[894,18159,18160],{},"\"[{src: string}]\"",[5885,18162,18163],{},[894,18164,3932],{},[5885,18166,18167],{},"Pass items / image src to animate",[5864,18169,18170,18174,18178,18182],{},[5885,18171,18172],{},[894,18173,9370],{},[5885,18175,18176],{},[894,18177,5894],{},[5885,18179,18180],{},[894,18181,6077],{},[5885,18183,18184],{},"Additional tailwind CSS classes for container styling.",[5864,18186,18187,18191,18195,18199],{},[5885,18188,18189],{},[894,18190,5889],{},[5885,18192,18193],{},[894,18194,5894],{},[5885,18196,18197],{},[894,18198,6077],{},[5885,18200,14559],{},[3549,18202,18203],{"v-slot:credits":613},[751,18204,18205,18213],{},[754,18206,18207,18208],{},"All images from ",[696,18209,18212],{"href":18210,"rel":18211},"https://www.pexels.com/@soldiervip/",[700],"Pexels",[754,18214,14566,18215,14570],{},[696,18216,5940],{"href":5938,"rel":18217},[700],{"title":613,"searchDepth":847,"depth":847,"links":18219},[],"Showcase your team with pride using our stunning Photo Gallery Component.",{},{"title":344,"description":18220},[1067,5952,17046],"yxpxELl_OQvg0Cl5clqC-tGoIl-ufHG6w8c9oDLAu1E",{"id":18226,"title":348,"badge":687,"body":18227,"category":267,"description":18336,"extension":856,"links":687,"meta":18337,"navigation":859,"path":349,"seo":18338,"stem":350,"tags":18339,"__hash__":18341},"docs_en/en/2.components/miscellaneous/scroll-island.md",{"type":689,"value":18228,"toc":18334},[18229],[5728,18230,18236,18308],{":component-files":18231,"component-id":18232,"config":18233,"demo-file":18234,"dependencies":18235},"[\"ScrollIsland.vue\"]","scroll-island","ScrollIslandConfig","ScrollIslandDemo.vue","@number-flow/vue",[3549,18237,18238,18240],{"v-slot:api":613},[882,18239,5856],{"id":5855},[5858,18241,18242,18254],{},[5861,18243,18244],{},[5864,18245,18246,18248,18250,18252],{},[5867,18247,5869],{},[5867,18249,5872],{},[5867,18251,5875],{},[5867,18253,5878],{},[5880,18255,18256,18272,18290],{},[5864,18257,18258,18262,18266,18270],{},[5885,18259,18260],{},[894,18261,5889],{},[5885,18263,18264],{},[894,18265,5894],{},[5885,18267,18268],{},[894,18269,6077],{},[5885,18271,6962],{},[5864,18273,18274,18278,18282,18287],{},[5885,18275,18276],{},[894,18277,4382],{},[5885,18279,18280],{},[894,18281,5894],{},[5885,18283,18284],{},[894,18285,18286],{},"\"Progress\"",[5885,18288,18289],{},"Title displayed in the header of the component.",[5864,18291,18292,18296,18300,18305],{},[5885,18293,18294],{},[894,18295,6667],{},[5885,18297,18298],{},[894,18299,5894],{},[5885,18301,18302],{},[894,18303,18304],{},"44",[5885,18306,18307],{},"Height of the component.",[3549,18309,18310],{"v-slot:credits":613},[751,18311,18312,18326],{},[754,18313,18314,18315,18320,18321],{},"Inspired by the work of ",[696,18316,18319],{"href":18317,"rel":18318},"https://x.com/alisamadi__/status/1854312982559502556",[700],"Ali Samadi"," & ",[696,18322,18325],{"href":18323,"rel":18324},"https://x.com/nitishkmrk",[700],"Nitish Khagwal",[754,18327,18328,18333],{},[696,18329,18332],{"href":18330,"rel":18331},"https://number-flow.barvian.me/vue",[700],"NumberFlow by Maxwell Barvian"," for number formatting and animations.",{"title":613,"searchDepth":847,"depth":847,"links":18335},[],"A dynamic and interactive component that displays scroll progress with animated visuals and an expandable area for additional content.",{},{"title":348,"description":18336},[1067,5952,18340],"number-flow","XAwztiau6vFjY_5LtWawv-GHxVpU-ZXN5oS_-m4fPr8",{"id":18343,"title":352,"badge":687,"body":18344,"category":267,"description":18513,"extension":856,"links":687,"meta":18514,"navigation":859,"path":353,"seo":18515,"stem":354,"tags":18516,"__hash__":18517},"docs_en/en/2.components/miscellaneous/shader-toy.md",{"type":689,"value":18345,"toc":18511},[18346],[5728,18347,18351,18494],{":component-files":18348,"component-id":7987,"config":18349,"demo-file":18350,"dependencies":6991},"[\"ShaderToy.vue\", \"InspiraShaderToy.ts\"]","ShaderToyConfig","ShaderToyDemo.vue",[3549,18352,18353,18355],{"v-slot:api":613},[882,18354,5856],{"id":5855},[5858,18356,18357,18369],{},[5861,18358,18359],{},[5864,18360,18361,18363,18365,18367],{},[5867,18362,5869],{},[5867,18364,5872],{},[5867,18366,5875],{},[5867,18368,5878],{},[5880,18370,18371,18389,18409,18426,18443,18460,18477],{},[5864,18372,18373,18378,18382,18386],{},[5885,18374,18375],{},[894,18376,18377],{},"shaderCode",[5885,18379,18380],{},[894,18381,5894],{},[5885,18383,18384],{},[894,18385,5899],{},[5885,18387,18388],{},"GLSL fragment shader source code from ShaderToy.",[5864,18390,18391,18396,18401,18406],{},[5885,18392,18393],{},[894,18394,18395],{},"mouseMode",[5885,18397,18398],{},[894,18399,18400],{},"'click' | 'hover'",[5885,18402,18403],{},[894,18404,18405],{},"'click'",[5885,18407,18408],{},"Mouse tracking mode: either on click or continuous hover.",[5864,18410,18411,18415,18419,18423],{},[5885,18412,18413],{},[894,18414,7061],{},[5885,18416,18417],{},[894,18418,6016],{},[5885,18420,18421],{},[894,18422,6157],{},[5885,18424,18425],{},"Adjust the hue of the shader output.",[5864,18427,18428,18432,18436,18440],{},[5885,18429,18430],{},[894,18431,7079],{},[5885,18433,18434],{},[894,18435,6016],{},[5885,18437,18438],{},[894,18439,1758],{},[5885,18441,18442],{},"Adjust the saturation of the shader output.",[5864,18444,18445,18449,18453,18457],{},[5885,18446,18447],{},[894,18448,7907],{},[5885,18450,18451],{},[894,18452,6016],{},[5885,18454,18455],{},[894,18456,1758],{},[5885,18458,18459],{},"Adjust the brightness of the shader output.",[5864,18461,18462,18466,18470,18474],{},[5885,18463,18464],{},[894,18465,7577],{},[5885,18467,18468],{},[894,18469,6016],{},[5885,18471,18472],{},[894,18473,1758],{},[5885,18475,18476],{},"Adjust the speed of the shader output.",[5864,18478,18479,18483,18487,18491],{},[5885,18480,18481],{},[894,18482,5889],{},[5885,18484,18485],{},[894,18486,5894],{},[5885,18488,18489],{},[894,18490,5899],{},[5885,18492,18493],{},"Custom classes to apply to the container.",[3549,18495,18496],{"v-slot:credits":613},[751,18497,18498,18503],{},[754,18499,13157,18500,880],{},[696,18501,7009],{"href":7007,"rel":18502},[700],[754,18504,6857,18505,18510],{},[696,18506,18509],{"href":18507,"rel":18508},"https://shadertoy.com/",[700],"Shadertoy"," and adapted for Vue compatibility.",{"title":613,"searchDepth":847,"depth":847,"links":18512},[],"A powerful and flexible component to render interactive GLSL shaders from ShaderToy in the browser.",{},{"title":352,"description":18513},[1067,5952,7987,6991,7023],"QXasRlANrv3Bw_lo4I6n_yUwglaG1zeKGbDyoxmtH0Y",{"id":18519,"title":356,"badge":687,"body":18520,"category":267,"description":18612,"extension":856,"links":687,"meta":18613,"navigation":859,"path":357,"seo":18614,"stem":358,"tags":18615,"__hash__":18616},"docs_en/en/2.components/miscellaneous/svg-mask.md",{"type":689,"value":18521,"toc":18610},[18522],[5728,18523,18528,18599],{":component-files":18524,"component-id":18525,"config":18526,"demo-file":18527},"[\"SVGMask.vue\"]","svg-mask","SvgMaskConfig","SvgMaskDemo.vue",[3549,18529,18530,18532],{"v-slot:api":613},[882,18531,5856],{"id":5855},[5858,18533,18534,18546],{},[5861,18535,18536],{},[5864,18537,18538,18540,18542,18544],{},[5867,18539,5869],{},[5867,18541,5872],{},[5867,18543,5875],{},[5867,18545,5878],{},[5880,18547,18548,18564,18581],{},[5864,18549,18550,18554,18558,18562],{},[5885,18551,18552],{},[894,18553,5889],{},[5885,18555,18556],{},[894,18557,5894],{},[5885,18559,18560],{},[894,18561,6077],{},[5885,18563,6962],{},[5864,18565,18566,18570,18574,18578],{},[5885,18567,18568],{},[894,18569,7525],{},[5885,18571,18572],{},[894,18573,6016],{},[5885,18575,18576],{},[894,18577,8850],{},[5885,18579,18580],{},"Initial size of the mask in pixels.",[5864,18582,18583,18588,18592,18596],{},[5885,18584,18585],{},[894,18586,18587],{},"revealSize",[5885,18589,18590],{},[894,18591,6016],{},[5885,18593,18594],{},[894,18595,10377],{},[5885,18597,18598],{},"Size of the mask during hover in pixels.",[3549,18600,18601],{"v-slot:credits":613},[751,18602,18603],{},[754,18604,6969,18605,880],{},[696,18606,18609],{"href":18607,"rel":18608},"https://ui.aceternity.com/components/text-generate-effect",[700],"Aceternity UI's SVG Mask Effect",{"title":613,"searchDepth":847,"depth":847,"links":18611},[],"A dynamic SVG mask component that reveals content with hover and mouse movement.",{},{"title":356,"description":18612},[1067,5952,5954],"3pd9628BhCPIVFhJ75U4JGYQKZp071LtBfC1bF5uJYc",{"id":18618,"title":360,"badge":687,"body":18619,"category":267,"description":18746,"extension":856,"links":687,"meta":18747,"navigation":859,"path":361,"seo":18748,"stem":362,"tags":18749,"__hash__":18750},"docs_en/en/2.components/miscellaneous/timeline.md",{"type":689,"value":18620,"toc":18744},[18621],[5728,18622,18627,18733],{":component-files":18623,"component-id":18624,"config":18625,"demo-file":18626},"[\"Timeline.vue\"]","timeline","TimelineConfig","TimelineDemo.vue",[3549,18628,18629,18631],{"v-slot:api":613},[882,18630,5856],{"id":5855},[5858,18632,18633,18645],{},[5861,18634,18635],{},[5864,18636,18637,18639,18641,18643],{},[5867,18638,5869],{},[5867,18640,5872],{},[5867,18642,5875],{},[5867,18644,5878],{},[5880,18646,18647,18664,18681,18699,18716],{},[5864,18648,18649,18653,18657,18661],{},[5885,18650,18651],{},[894,18652,9370],{},[5885,18654,18655],{},[894,18656,5894],{},[5885,18658,18659],{},[894,18660,6077],{},[5885,18662,18663],{},"Additional CSS classes for the timeline container.",[5864,18665,18666,18670,18674,18678],{},[5885,18667,18668],{},[894,18669,5889],{},[5885,18671,18672],{},[894,18673,5894],{},[5885,18675,18676],{},[894,18677,6077],{},[5885,18679,18680],{},"Additional CSS classes for styling.",[5864,18682,18683,18687,18692,18696],{},[5885,18684,18685],{},[894,18686,15646],{},[5885,18688,18689],{},[894,18690,18691],{},"{ id: string; label: string; }[]",[5885,18693,18694],{},[894,18695,3932],{},[5885,18697,18698],{},"List of timeline items, each with an ID and label.",[5864,18700,18701,18705,18709,18713],{},[5885,18702,18703],{},[894,18704,4382],{},[5885,18706,18707],{},[894,18708,5894],{},[5885,18710,18711],{},[894,18712,6077],{},[5885,18714,18715],{},"Title of the timeline section.",[5864,18717,18718,18722,18726,18730],{},[5885,18719,18720],{},[894,18721,4385],{},[5885,18723,18724],{},[894,18725,5894],{},[5885,18727,18728],{},[894,18729,6077],{},[5885,18731,18732],{},"Description text displayed below the title.",[3549,18734,18735],{"v-slot:credits":613},[751,18736,18737],{},[754,18738,6435,18739,880],{},[696,18740,18743],{"href":18741,"rel":18742},"https://ui.aceternity.com/components/timeline",[700],"Aceternity UI's Timeline",{"title":613,"searchDepth":847,"depth":847,"links":18745},[],"A visually appealing and interactive timeline component with smooth animations, sticky labels, and a gradient scrolling effect.",{},{"title":360,"description":18746},[1067,5952,5954],"0T3kg5romhqC2weV1NfvBWcLjahJ8UuHYlwLepyqoDc",{"id":18752,"title":364,"badge":687,"body":18753,"category":267,"description":18809,"extension":856,"links":687,"meta":18810,"navigation":859,"path":365,"seo":18811,"stem":366,"tags":18812,"__hash__":18813},"docs_en/en/2.components/miscellaneous/tracing-beam.md",{"type":689,"value":18754,"toc":18807},[18755],[5728,18756,18761,18797],{":component-files":18757,"component-id":18758,"config":18759,"demo-file":18760},"[\"TracingBeam.vue\"]","tracing-beam","TracingBeamConfig","TracingBeamDemo.vue",[3549,18762,18763,18765],{"v-slot:api":613},[882,18764,5856],{"id":5855},[5858,18766,18767,18779],{},[5861,18768,18769],{},[5864,18770,18771,18773,18775,18777],{},[5867,18772,5869],{},[5867,18774,5872],{},[5867,18776,5875],{},[5867,18778,5878],{},[5880,18780,18781],{},[5864,18782,18783,18787,18791,18795],{},[5885,18784,18785],{},[894,18786,5889],{},[5885,18788,18789],{},[894,18790,5894],{},[5885,18792,18793],{},[894,18794,6077],{},[5885,18796,6962],{},[3549,18798,18799],{"v-slot:credits":613},[751,18800,18801],{},[754,18802,6969,18803,4207],{},[696,18804,719],{"href":18805,"rel":18806},"https://ui.aceternity.com/components/tracing-beam",[700],{"title":613,"searchDepth":847,"depth":847,"links":18808},[],"A component that renders a tracing beam effect with dynamic scrolling animations and gradient strokes.",{},{"title":364,"description":18809},[1067,5952,5954],"WIhcphB_04zOtyzQWu4NdCACCj5kuVn2CczBFV6BNTM",{"id":18815,"title":373,"badge":687,"body":18816,"category":368,"description":19161,"extension":856,"links":687,"meta":19162,"navigation":859,"path":374,"seo":19163,"stem":375,"tags":19164,"__hash__":19165},"docs_en/en/2.components/special-effects/animated-beam.md",{"type":689,"value":18817,"toc":19159},[18818],[5728,18819,18824,19148],{":component-files":18820,"component-id":18821,"config":18822,"demo-file":18823},"[\"AnimatedBeam.vue\"]","animated-beam","AnimatedBeamConfig","AnimatedBeamDemo.vue",[3549,18825,18826,18828],{"v-slot:api":613},[882,18827,5856],{"id":5855},[5858,18829,18830,18842],{},[5861,18831,18832],{},[5864,18833,18834,18836,18838,18840],{},[5867,18835,5869],{},[5867,18837,5872],{},[5867,18839,5875],{},[5867,18841,5878],{},[5880,18843,18844,18861,18879,18895,18911,18929,18948,18967,18985,19003,19022,19041,19058,19076,19094,19112,19130],{},[5864,18845,18846,18850,18854,18858],{},[5885,18847,18848],{},[894,18849,5889],{},[5885,18851,18852],{},[894,18853,5894],{},[5885,18855,18856],{},[894,18857,6077],{},[5885,18859,18860],{},"Additional CSS classes to apply to the component for customization.",[5864,18862,18863,18868,18873,18876],{},[5885,18864,18865],{},[894,18866,18867],{},"containerRef",[5885,18869,18870],{},[894,18871,18872],{},"HTMLElement",[5885,18874,18875],{},"N/A",[5885,18877,18878],{},"Reference to the container element where the beam is rendered.",[5864,18880,18881,18886,18890,18892],{},[5885,18882,18883],{},[894,18884,18885],{},"fromRef",[5885,18887,18888],{},[894,18889,18872],{},[5885,18891,18875],{},[5885,18893,18894],{},"Reference to the starting element from which the beam originates.",[5864,18896,18897,18902,18906,18908],{},[5885,18898,18899],{},[894,18900,18901],{},"toRef",[5885,18903,18904],{},[894,18905,18872],{},[5885,18907,18875],{},[5885,18909,18910],{},"Reference to the ending element where the beam points to.",[5864,18912,18913,18918,18922,18926],{},[5885,18914,18915],{},[894,18916,18917],{},"curvature",[5885,18919,18920],{},[894,18921,6016],{},[5885,18923,18924],{},[894,18925,6157],{},[5885,18927,18928],{},"Controls the curvature of the beam; higher values create a more curved path.",[5864,18930,18931,18935,18939,18943],{},[5885,18932,18933],{},[894,18934,17689],{},[5885,18936,18937],{},[894,18938,5914],{},[5885,18940,18941],{},[894,18942,7446],{},[5885,18944,18945,18946,880],{},"Reverses the animation direction of the beam if set to ",[894,18947,5919],{},[5864,18949,18950,18955,18959,18964],{},[5885,18951,18952],{},[894,18953,18954],{},"pathColor",[5885,18956,18957],{},[894,18958,5894],{},[5885,18960,18961],{},[894,18962,18963],{},"\"gray\"",[5885,18965,18966],{},"Color of the beam's path.",[5864,18968,18969,18974,18978,18982],{},[5885,18970,18971],{},[894,18972,18973],{},"pathWidth",[5885,18975,18976],{},[894,18977,6016],{},[5885,18979,18980],{},[894,18981,7938],{},[5885,18983,18984],{},"Stroke width of the beam's path.",[5864,18986,18987,18992,18996,19000],{},[5885,18988,18989],{},[894,18990,18991],{},"pathOpacity",[5885,18993,18994],{},[894,18995,6016],{},[5885,18997,18998],{},[894,18999,6407],{},[5885,19001,19002],{},"Opacity of the beam's path.",[5864,19004,19005,19010,19014,19019],{},[5885,19006,19007],{},[894,19008,19009],{},"gradientStartColor",[5885,19011,19012],{},[894,19013,5894],{},[5885,19015,19016],{},[894,19017,19018],{},"\"#FFAA40\"",[5885,19020,19021],{},"Starting color of the beam's gradient animation.",[5864,19023,19024,19029,19033,19038],{},[5885,19025,19026],{},[894,19027,19028],{},"gradientStopColor",[5885,19030,19031],{},[894,19032,5894],{},[5885,19034,19035],{},[894,19036,19037],{},"\"#9C40FF\"",[5885,19039,19040],{},"Ending color of the beam's gradient animation.",[5864,19042,19043,19047,19051,19055],{},[5885,19044,19045],{},[894,19046,6914],{},[5885,19048,19049],{},[894,19050,6016],{},[5885,19052,19053],{},[894,19054,6157],{},[5885,19056,19057],{},"Delay before the beam's animation starts, in seconds.",[5864,19059,19060,19064,19068,19073],{},[5885,19061,19062],{},[894,19063,6933],{},[5885,19065,19066],{},[894,19067,6016],{},[5885,19069,19070],{},[894,19071,19072],{},"Random between 4–7 s",[5885,19074,19075],{},"Duration of the beam's animation cycle, in seconds.",[5864,19077,19078,19083,19087,19091],{},[5885,19079,19080],{},[894,19081,19082],{},"startXOffset",[5885,19084,19085],{},[894,19086,6016],{},[5885,19088,19089],{},[894,19090,6157],{},[5885,19092,19093],{},"Horizontal offset for the beam's starting point.",[5864,19095,19096,19101,19105,19109],{},[5885,19097,19098],{},[894,19099,19100],{},"startYOffset",[5885,19102,19103],{},[894,19104,6016],{},[5885,19106,19107],{},[894,19108,6157],{},[5885,19110,19111],{},"Vertical offset for the beam's starting point.",[5864,19113,19114,19119,19123,19127],{},[5885,19115,19116],{},[894,19117,19118],{},"endXOffset",[5885,19120,19121],{},[894,19122,6016],{},[5885,19124,19125],{},[894,19126,6157],{},[5885,19128,19129],{},"Horizontal offset for the beam's ending point.",[5864,19131,19132,19137,19141,19145],{},[5885,19133,19134],{},[894,19135,19136],{},"endYOffset",[5885,19138,19139],{},[894,19140,6016],{},[5885,19142,19143],{},[894,19144,6157],{},[5885,19146,19147],{},"Vertical offset for the beam's ending point.",[3549,19149,19150],{"v-slot:credits":613},[751,19151,19152],{},[754,19153,6435,19154,880],{},[696,19155,19158],{"href":19156,"rel":19157},"https://magicui.design/docs/components/animated-beam",[700],"Magic UI Animated Beam",{"title":613,"searchDepth":847,"depth":847,"links":19160},[],"An SVG beam connecting elements with animation.",{},{"title":373,"description":19161},[1067,5952,6732],"5t4o7JRH34NFJMivl4XtxHV_BIYSn6xgfS3pBnfKAho",{"id":19167,"title":377,"badge":687,"body":19168,"category":368,"description":19348,"extension":856,"links":687,"meta":19349,"navigation":859,"path":378,"seo":19350,"stem":379,"tags":19351,"__hash__":19352},"docs_en/en/2.components/special-effects/border-beam.md",{"type":689,"value":19169,"toc":19346},[19170],[5728,19171,19176,19336],{":component-files":19172,"component-id":19173,"config":19174,"demo-file":19175},"[\"BorderBeam.vue\"]","border-beam","BorderBeamConfig","BorderBeamDemo.vue",[3549,19177,19178,19180],{"v-slot:api":613},[882,19179,5856],{"id":5855},[5858,19181,19182,19194],{},[5861,19183,19184],{},[5864,19185,19186,19188,19190,19192],{},[5867,19187,5869],{},[5867,19189,5872],{},[5867,19191,5875],{},[5867,19193,5878],{},[5880,19195,19196,19212,19229,19246,19263,19282,19301,19320],{},[5864,19197,19198,19202,19206,19210],{},[5885,19199,19200],{},[894,19201,5889],{},[5885,19203,19204],{},[894,19205,5894],{},[5885,19207,19208],{},[894,19209,6077],{},[5885,19211,6962],{},[5864,19213,19214,19218,19222,19226],{},[5885,19215,19216],{},[894,19217,7525],{},[5885,19219,19220],{},[894,19221,6016],{},[5885,19223,19224],{},[894,19225,6513],{},[5885,19227,19228],{},"Size of the animated border beam effect.",[5864,19230,19231,19235,19239,19244],{},[5885,19232,19233],{},[894,19234,6933],{},[5885,19236,19237],{},[894,19238,6016],{},[5885,19240,19241],{},[894,19242,19243],{},"15",[5885,19245,10275],{},[5864,19247,19248,19252,19256,19260],{},[5885,19249,19250],{},[894,19251,9980],{},[5885,19253,19254],{},[894,19255,6016],{},[5885,19257,19258],{},[894,19259,9469],{},[5885,19261,19262],{},"Width of the border around the beam effect.",[5864,19264,19265,19270,19274,19279],{},[5885,19266,19267],{},[894,19268,19269],{},"anchor",[5885,19271,19272],{},[894,19273,6016],{},[5885,19275,19276],{},[894,19277,19278],{},"90",[5885,19280,19281],{},"Anchor point for the beam, determining its position along the border.",[5864,19283,19284,19289,19293,19298],{},[5885,19285,19286],{},[894,19287,19288],{},"colorFrom",[5885,19290,19291],{},[894,19292,5894],{},[5885,19294,19295],{},[894,19296,19297],{},"\"#ffaa40\"",[5885,19299,19300],{},"Starting color for the gradient of the beam.",[5864,19302,19303,19308,19312,19317],{},[5885,19304,19305],{},[894,19306,19307],{},"colorTo",[5885,19309,19310],{},[894,19311,5894],{},[5885,19313,19314],{},[894,19315,19316],{},"\"#9c40ff\"",[5885,19318,19319],{},"Ending color for the gradient of the beam.",[5864,19321,19322,19326,19330,19334],{},[5885,19323,19324],{},[894,19325,6914],{},[5885,19327,19328],{},[894,19329,6016],{},[5885,19331,19332],{},[894,19333,6157],{},[5885,19335,6926],{},[3549,19337,19338],{"v-slot:credits":613},[751,19339,19340],{},[754,19341,6969,19342,880],{},[696,19343,725],{"href":19344,"rel":19345},"https://magicui.design/docs/components/border-beam",[700],{"title":613,"searchDepth":847,"depth":847,"links":19347},[],"A stylish animated border beam effect with customizable size, duration, colors, and delay.",{},{"title":377,"description":19348},[1067,5952,6732],"G6Tbc_1K7Ph_yqp-wqS7fK2vtYCbV-bYtnfBIIOe54w",{"id":19354,"title":381,"badge":687,"body":19355,"category":368,"description":19893,"extension":856,"links":687,"meta":19894,"navigation":859,"path":382,"seo":19895,"stem":383,"tags":19896,"__hash__":19897},"docs_en/en/2.components/special-effects/confetti.md",{"type":689,"value":19356,"toc":19891},[19357],[5728,19358,19365,19872],{":component-files":19359,"component-id":19360,"config":19361,"demo-file":19362,"dependencies":19363,"dev-dependencies":19364},"[\"Confetti.vue\", \"ConfettiButton.vue\"]","confetti","ConfettiConfig","ConfettiDemo.vue","canvas-confetti","@types/canvas-confetti",[3549,19366,19367,19369,19371,19375,19450,19455,19832,19838],{"v-slot:api":613},[882,19368,5856],{"id":5855},[728,19370,3696],{"id":10623},[3097,19372,19373],{"id":19360},[894,19374,381],{},[5858,19376,19377,19389],{},[5861,19378,19379],{},[5864,19380,19381,19383,19385,19387],{},[5867,19382,5869],{},[5867,19384,5872],{},[5867,19386,5875],{},[5867,19388,5878],{},[5880,19390,19391,19411,19430],{},[5864,19392,19393,19398,19403,19408],{},[5885,19394,19395],{},[894,19396,19397],{},"options",[5885,19399,19400],{},[894,19401,19402],{},"ConfettiOptions",[5885,19404,19405],{},[894,19406,19407],{},"{}",[5885,19409,19410],{},"Options for individual confetti bursts.",[5864,19412,19413,19418,19423,19427],{},[5885,19414,19415],{},[894,19416,19417],{},"globalOptions",[5885,19419,19420],{},[894,19421,19422],{},"ConfettiGlobalOptions",[5885,19424,19425],{},[894,19426,19407],{},[5885,19428,19429],{},"Global options for the confetti instance (e.g., resize behavior).",[5864,19431,19432,19437,19441,19445],{},[5885,19433,19434],{},[894,19435,19436],{},"manualstart",[5885,19438,19439],{},[894,19440,5914],{},[5885,19442,19443],{},[894,19444,7446],{},[5885,19446,11338,19447,19449],{},[894,19448,5919],{},", confetti won't start automatically on mount.",[3097,19451,19453],{"id":19452},"confettioptions",[894,19454,19402],{},[5858,19456,19457,19470],{},[5861,19458,19459],{},[5864,19460,19461,19464,19466,19468],{},[5867,19462,19463],{},"Property",[5867,19465,5872],{},[5867,19467,5875],{},[5867,19469,5878],{},[5880,19471,19472,19489,19507,19526,19544,19562,19580,19598,19616,19635,19653,19672,19690,19707,19725,19743,19761,19779,19795,19812],{},[5864,19473,19474,19478,19482,19486],{},[5885,19475,19476],{},[894,19477,7238],{},[5885,19479,19480],{},[894,19481,6016],{},[5885,19483,19484],{},[894,19485,6021],{},[5885,19487,19488],{},"The number of confetti particles to launch.",[5864,19490,19491,19496,19500,19504],{},[5885,19492,19493],{},[894,19494,19495],{},"angle",[5885,19497,19498],{},[894,19499,6016],{},[5885,19501,19502],{},[894,19503,19278],{},[5885,19505,19506],{},"The angle in degrees at which to launch the confetti.",[5864,19508,19509,19514,19518,19523],{},[5885,19510,19511],{},[894,19512,19513],{},"spread",[5885,19515,19516],{},[894,19517,6016],{},[5885,19519,19520],{},[894,19521,19522],{},"45",[5885,19524,19525],{},"The spread in degrees of the confetti.",[5864,19527,19528,19533,19537,19541],{},[5885,19529,19530],{},[894,19531,19532],{},"startVelocity",[5885,19534,19535],{},[894,19536,6016],{},[5885,19538,19539],{},[894,19540,19522],{},[5885,19542,19543],{},"The initial velocity of the confetti particles.",[5864,19545,19546,19551,19555,19559],{},[5885,19547,19548],{},[894,19549,19550],{},"decay",[5885,19552,19553],{},[894,19554,6016],{},[5885,19556,19557],{},[894,19558,12982],{},[5885,19560,19561],{},"The rate at which confetti particles slow down.",[5864,19563,19564,19569,19573,19577],{},[5885,19565,19566],{},[894,19567,19568],{},"gravity",[5885,19570,19571],{},[894,19572,6016],{},[5885,19574,19575],{},[894,19576,1758],{},[5885,19578,19579],{},"The gravity applied to confetti particles.",[5864,19581,19582,19587,19591,19595],{},[5885,19583,19584],{},[894,19585,19586],{},"drift",[5885,19588,19589],{},[894,19590,6016],{},[5885,19592,19593],{},[894,19594,6157],{},[5885,19596,19597],{},"The horizontal drift applied to confetti particles.",[5864,19599,19600,19605,19609,19613],{},[5885,19601,19602],{},[894,19603,19604],{},"ticks",[5885,19606,19607],{},[894,19608,6016],{},[5885,19610,19611],{},[894,19612,6513],{},[5885,19614,19615],{},"The number of animation frames the confetti should last.",[5864,19617,19618,19623,19627,19632],{},[5885,19619,19620],{},[894,19621,19622],{},"origin",[5885,19624,19625],{},[894,19626,17383],{},[5885,19628,19629],{},[894,19630,19631],{},"{ x: 0.5, y: 0.5 }",[5885,19633,19634],{},"The origin point (from 0 to 1) of the confetti emission.",[5864,19636,19637,19641,19645,19650],{},[5885,19638,19639],{},[894,19640,9801],{},[5885,19642,19643],{},[894,19644,9806],{},[5885,19646,19647],{},[894,19648,19649],{},"['#26ccff', '#a25afd', '#ff5e7e', '#88ff5a', '#fcff42', '#ffa62d', '#ff36ff']",[5885,19651,19652],{},"Array of color strings in HEX format for the confetti particles.",[5864,19654,19655,19660,19664,19669],{},[5885,19656,19657],{},[894,19658,19659],{},"shapes",[5885,19661,19662],{},[894,19663,9806],{},[5885,19665,19666],{},[894,19667,19668],{},"['square', 'circle']",[5885,19670,19671],{},"Array of shapes for the confetti particles.",[5864,19673,19674,19679,19683,19687],{},[5885,19675,19676],{},[894,19677,19678],{},"scalar",[5885,19680,19681],{},[894,19682,6016],{},[5885,19684,19685],{},[894,19686,1758],{},[5885,19688,19689],{},"Scaling factor for confetti particle sizes.",[5864,19691,19692,19696,19700,19704],{},[5885,19693,19694],{},[894,19695,15195],{},[5885,19697,19698],{},[894,19699,6016],{},[5885,19701,19702],{},[894,19703,7337],{},[5885,19705,19706],{},"The z-index value for the confetti canvas element.",[5864,19708,19709,19714,19718,19722],{},[5885,19710,19711],{},[894,19712,19713],{},"disableForReducedMotion",[5885,19715,19716],{},[894,19717,5914],{},[5885,19719,19720],{},[894,19721,7446],{},[5885,19723,19724],{},"Disables confetti for users who prefer reduced motion.",[5864,19726,19727,19732,19736,19740],{},[5885,19728,19729],{},[894,19730,19731],{},"useWorker",[5885,19733,19734],{},[894,19735,5914],{},[5885,19737,19738],{},[894,19739,5919],{},[5885,19741,19742],{},"Use a Web Worker for better performance.",[5864,19744,19745,19750,19754,19758],{},[5885,19746,19747],{},[894,19748,19749],{},"resize",[5885,19751,19752],{},[894,19753,5914],{},[5885,19755,19756],{},[894,19757,5919],{},[5885,19759,19760],{},"Whether to automatically resize the canvas when the window resizes.",[5864,19762,19763,19767,19772,19776],{},[5885,19764,19765],{},[894,19766,6108],{},[5885,19768,19769],{},[894,19770,19771],{},"HTMLCanvasElement | null",[5885,19773,19774],{},[894,19775,8291],{},[5885,19777,19778],{},"Custom canvas element to draw confetti on.",[5864,19780,19781,19785,19789,19793],{},[5885,19782,19783],{},[894,19784,19568],{},[5885,19786,19787],{},[894,19788,6016],{},[5885,19790,19791],{},[894,19792,1758],{},[5885,19794,19579],{},[5864,19796,19797,19801,19805,19809],{},[5885,19798,19799],{},[894,19800,19586],{},[5885,19802,19803],{},[894,19804,6016],{},[5885,19806,19807],{},[894,19808,6157],{},[5885,19810,19811],{},"The horizontal drift applied to particles.",[5864,19813,19814,19819,19823,19827],{},[5885,19815,19816],{},[894,19817,19818],{},"flat",[5885,19820,19821],{},[894,19822,5914],{},[5885,19824,19825],{},[894,19826,7446],{},[5885,19828,11338,19829,19831],{},[894,19830,5919],{},", confetti particles will be flat (no rotation or 3D effect).",[3097,19833,19835],{"id":19834},"confettibutton",[894,19836,19837],{},"ConfettiButton",[5858,19839,19840,19852],{},[5861,19841,19842],{},[5864,19843,19844,19846,19848,19850],{},[5867,19845,5869],{},[5867,19847,5872],{},[5867,19849,5875],{},[5867,19851,5878],{},[5880,19853,19854],{},[5864,19855,19856,19860,19865,19869],{},[5885,19857,19858],{},[894,19859,19397],{},[5885,19861,19862],{},[894,19863,19864],{},"ConfettiOptions & { canvas?: HTMLCanvasElement }",[5885,19866,19867],{},[894,19868,19407],{},[5885,19870,19871],{},"Options for confetti when the button is clicked.",[3549,19873,19874],{"v-slot:credits":613},[751,19875,19876,19884],{},[754,19877,19878,19879,19883],{},"Built using the ",[696,19880,19363],{"href":19881,"rel":19882},"https://www.npmjs.com/package/canvas-confetti",[700]," library.",[754,19885,6969,19886,880],{},[696,19887,19890],{"href":19888,"rel":19889},"https://magicui.design/docs/components/confetti",[700],"Magic UI Confetti",{"title":613,"searchDepth":847,"depth":847,"links":19892},[],"A Vue component for confetti animations.",{},{"title":381,"description":19893},[1067,5952,6108,6732],"bmS3RP5IjgnXILFcfZTFiNo60_9WGpMASoU4uk4Si4g",{"id":19899,"title":385,"badge":687,"body":19900,"category":368,"description":20251,"extension":856,"links":687,"meta":20252,"navigation":859,"path":386,"seo":20253,"stem":387,"tags":20254,"__hash__":20255},"docs_en/en/2.components/special-effects/dither-shader.md",{"type":689,"value":19901,"toc":20249},[19902],[5728,19903,19908,20238],{":component-files":19904,"component-id":19905,"config":19906,"demo-file":19907},"[\"DitherShader.vue\"]","dither-shader","DitherShaderConfig","DitherShaderDemo.vue",[3549,19909,19910,19912],{"v-slot:api":613},[882,19911,5856],{"id":5855},[5858,19913,19914,19926],{},[5861,19915,19916],{},[5864,19917,19918,19920,19922,19924],{},[5867,19919,11021],{},[5867,19921,5872],{},[5867,19923,5875],{},[5867,19925,5878],{},[5880,19927,19928,19946,19964,19984,20004,20022,20040,20057,20074,20093,20110,20128,20146,20166,20184,20202,20221],{},[5864,19929,19930,19934,19938,19943],{},[5885,19931,19932],{},[894,19933,9096],{},[5885,19935,19936],{},[894,19937,5894],{},[5885,19939,19940],{},[894,19941,19942],{},"–",[5885,19944,19945],{},"Source image URL",[5864,19947,19948,19953,19957,19961],{},[5885,19949,19950],{},[894,19951,19952],{},"gridSize",[5885,19954,19955],{},[894,19956,6016],{},[5885,19958,19959],{},[894,19960,6236],{},[5885,19962,19963],{},"Size of the dithering grid cells",[5864,19965,19966,19971,19976,19981],{},[5885,19967,19968],{},[894,19969,19970],{},"ditherMode",[5885,19972,19973],{},[894,19974,19975],{},"\"bayer\" | \"halftone\" | \"noise\" | \"crosshatch\"",[5885,19977,19978],{},[894,19979,19980],{},"\"bayer\"",[5885,19982,19983],{},"Type of dithering pattern",[5864,19985,19986,19991,19996,20001],{},[5885,19987,19988],{},[894,19989,19990],{},"colorMode",[5885,19992,19993],{},[894,19994,19995],{},"\"original\" | \"grayscale\" | \"duotone\" | \"custom\"",[5885,19997,19998],{},[894,19999,20000],{},"\"original\"",[5885,20002,20003],{},"Color processing mode",[5864,20005,20006,20011,20015,20019],{},[5885,20007,20008],{},[894,20009,20010],{},"invert",[5885,20012,20013],{},[894,20014,5914],{},[5885,20016,20017],{},[894,20018,7446],{},[5885,20020,20021],{},"Invert the dithered output colors",[5864,20023,20024,20029,20033,20037],{},[5885,20025,20026],{},[894,20027,20028],{},"pixelRatio",[5885,20030,20031],{},[894,20032,6016],{},[5885,20034,20035],{},[894,20036,1758],{},[5885,20038,20039],{},"Pixelation multiplier (1 = no pixelation, higher = more pixelated)",[5864,20041,20042,20046,20050,20054],{},[5885,20043,20044],{},[894,20045,6265],{},[5885,20047,20048],{},[894,20049,5894],{},[5885,20051,20052],{},[894,20053,9524],{},[5885,20055,20056],{},"Primary color for duotone mode",[5864,20058,20059,20063,20067,20071],{},[5885,20060,20061],{},[894,20062,6284],{},[5885,20064,20065],{},[894,20066,5894],{},[5885,20068,20069],{},[894,20070,10499],{},[5885,20072,20073],{},"Secondary color for duotone mode",[5864,20075,20076,20081,20085,20090],{},[5885,20077,20078],{},[894,20079,20080],{},"customPalette",[5885,20082,20083],{},[894,20084,9806],{},[5885,20086,20087],{},[894,20088,20089],{},"[\"#000000\", \"#ffffff\"]",[5885,20091,20092],{},"Custom color palette array for custom mode",[5864,20094,20095,20099,20103,20107],{},[5885,20096,20097],{},[894,20098,7907],{},[5885,20100,20101],{},[894,20102,6016],{},[5885,20104,20105],{},[894,20106,6157],{},[5885,20108,20109],{},"Brightness adjustment (-1 to 1)",[5864,20111,20112,20117,20121,20125],{},[5885,20113,20114],{},[894,20115,20116],{},"contrast",[5885,20118,20119],{},[894,20120,6016],{},[5885,20122,20123],{},[894,20124,1758],{},[5885,20126,20127],{},"Contrast adjustment (0 to 2, 1 = normal)",[5864,20129,20130,20134,20138,20143],{},[5885,20131,20132],{},[894,20133,9515],{},[5885,20135,20136],{},[894,20137,5894],{},[5885,20139,20140],{},[894,20141,20142],{},"\"transparent\"",[5885,20144,20145],{},"Background color behind the dithered image",[5864,20147,20148,20153,20158,20163],{},[5885,20149,20150],{},[894,20151,20152],{},"objectFit",[5885,20154,20155],{},[894,20156,20157],{},"\"cover\" | \"contain\" | \"fill\" | \"none\"",[5885,20159,20160],{},[894,20161,20162],{},"\"cover\"",[5885,20164,20165],{},"Object fit behavior",[5864,20167,20168,20173,20177,20181],{},[5885,20169,20170],{},[894,20171,20172],{},"threshold",[5885,20174,20175],{},[894,20176,6016],{},[5885,20178,20179],{},[894,20180,6923],{},[5885,20182,20183],{},"Threshold bias for dithering (0 to 1)",[5864,20185,20186,20191,20195,20199],{},[5885,20187,20188],{},[894,20189,20190],{},"animated",[5885,20192,20193],{},[894,20194,5914],{},[5885,20196,20197],{},[894,20198,7446],{},[5885,20200,20201],{},"Enable animation effect",[5864,20203,20204,20209,20213,20218],{},[5885,20205,20206],{},[894,20207,20208],{},"animationSpeed",[5885,20210,20211],{},[894,20212,6016],{},[5885,20214,20215],{},[894,20216,20217],{},"0.02",[5885,20219,20220],{},"Animation speed (lower = slower)",[5864,20222,20223,20227,20231,20235],{},[5885,20224,20225],{},[894,20226,5889],{},[5885,20228,20229],{},[894,20230,5894],{},[5885,20232,20233],{},[894,20234,19942],{},[5885,20236,20237],{},"Additional CSS classes for the container (use this to set size via Tailwind)",[3549,20239,20240],{"v-slot:credits":613},[751,20241,20242],{},[754,20243,6435,20244,880],{},[696,20245,20248],{"href":20246,"rel":20247},"https://ui.aceternity.com/components/dither-shader",[700],"Aceternity UI Dither Shader",{"title":613,"searchDepth":847,"depth":847,"links":20250},[],"A real-time ordered dithering effect for images, perfect for pixel art and retro aesthetics.",{},{"title":385,"description":20251},[5952,5953,10925,5954],"ME5ag8L9c4xlR_7MKpRSGUwxHzlnn4dz6KXTc0pupBY",{"id":20257,"title":389,"badge":687,"body":20258,"category":368,"description":20479,"extension":856,"links":687,"meta":20480,"navigation":859,"path":390,"seo":20481,"stem":391,"tags":20482,"__hash__":20483},"docs_en/en/2.components/special-effects/glow-border.md",{"type":689,"value":20259,"toc":20477},[20260,20475],[5728,20261,20266,20354,20465],{":component-files":20262,"component-id":20263,"config":20264,"demo-file":20265},"[\"GlowBorder.vue\"]","glow-border","GlowBorderConfig","GlowBorderDemo.vue",[3549,20267,20268,20270],{"v-slot:api":613},[882,20269,5856],{"id":5855},[5858,20271,20272,20284],{},[5861,20273,20274],{},[5864,20275,20276,20278,20280,20282],{},[5867,20277,5869],{},[5867,20279,5872],{},[5867,20281,5875],{},[5867,20283,5878],{},[5880,20285,20286,20303,20320,20337],{},[5864,20287,20288,20292,20296,20300],{},[5885,20289,20290],{},[894,20291,6933],{},[5885,20293,20294],{},[894,20295,6016],{},[5885,20297,20298],{},[894,20299,8850],{},[5885,20301,20302],{},"Duration of the glowing border animation.",[5864,20304,20305,20309,20313,20317],{},[5885,20306,20307],{},[894,20308,6485],{},[5885,20310,20311],{},[894,20312,12613],{},[5885,20314,20315],{},[894,20316,7318],{},[5885,20318,20319],{},"Color or array of colors to applied on the glowing border.",[5864,20321,20322,20326,20330,20334],{},[5885,20323,20324],{},[894,20325,10032],{},[5885,20327,20328],{},[894,20329,6016],{},[5885,20331,20332],{},[894,20333,8850],{},[5885,20335,20336],{},"Radius of the border.",[5864,20338,20339,20343,20347,20351],{},[5885,20340,20341],{},[894,20342,9980],{},[5885,20344,20345],{},[894,20346,6016],{},[5885,20348,20349],{},[894,20350,7938],{},[5885,20352,20353],{},"Width of the border.",[3549,20355,20356,20360],{"v-slot:instructions":613},[692,20357,5738,20358,5741],{},[894,20359,1036],{},[925,20361,20363],{"className":1065,"code":20362,"language":1067,"meta":613,"style":613},"@theme inline {\n  --animate-glow: glow var(--duration) infinite linear;\n  @keyframes glow {\n    0% {\n      background-position: 0% 0%;\n    }\n    50% {\n      background-position: 100% 100%;\n    }\n    to {\n      background-position: 0% 0%;\n    }\n  }\n}\n",[894,20364,20365,20373,20378,20387,20394,20407,20411,20418,20431,20435,20441,20453,20457,20461],{"__ignoreMap":613},[934,20366,20367,20369,20371],{"class":936,"line":937},[934,20368,1111],{"class":1074},[934,20370,2508],{"class":1114},[934,20372,1118],{"class":1078},[934,20374,20375],{"class":936,"line":847},[934,20376,20377],{"class":1114},"  --animate-glow: glow var(--duration) infinite linear;\n",[934,20379,20380,20382,20385],{"class":936,"line":850},[934,20381,5764],{"class":1074},[934,20383,20384],{"class":5767}," glow",[934,20386,1312],{"class":1078},[934,20388,20389,20392],{"class":936,"line":1108},[934,20390,20391],{"class":940},"    0%",[934,20393,1312],{"class":1078},[934,20395,20396,20398,20400,20403,20405],{"class":936,"line":1121},[934,20397,5782],{"class":2732},[934,20399,1305],{"class":1078},[934,20401,20402],{"class":1757}," 0%",[934,20404,20402],{"class":1757},[934,20406,1087],{"class":1078},[934,20408,20409],{"class":936,"line":1127},[934,20410,5808],{"class":1078},[934,20412,20413,20416],{"class":936,"line":1133},[934,20414,20415],{"class":940},"    50%",[934,20417,1312],{"class":1078},[934,20419,20420,20422,20424,20427,20429],{"class":936,"line":1138},[934,20421,5782],{"class":2732},[934,20423,1305],{"class":1078},[934,20425,20426],{"class":1757}," 100%",[934,20428,20426],{"class":1757},[934,20430,1087],{"class":1078},[934,20432,20433],{"class":936,"line":1144},[934,20434,5808],{"class":1078},[934,20436,20437,20439],{"class":936,"line":1150},[934,20438,5813],{"class":940},[934,20440,1312],{"class":1078},[934,20442,20443,20445,20447,20449,20451],{"class":936,"line":1155},[934,20444,5782],{"class":2732},[934,20446,1305],{"class":1078},[934,20448,20402],{"class":1757},[934,20450,20402],{"class":1757},[934,20452,1087],{"class":1078},[934,20454,20455],{"class":936,"line":1161},[934,20456,5808],{"class":1078},[934,20458,20459],{"class":936,"line":1167},[934,20460,2687],{"class":1078},[934,20462,20463],{"class":936,"line":1172},[934,20464,1294],{"class":1078},[3549,20466,20467],{"v-slot:credits":613},[751,20468,20469],{},[754,20470,5929,20471,7387],{},[696,20472,725],{"href":20473,"rel":20474},"https://magicui.design/docs/components/shine-border",[700],[2836,20476,5944],{},{"title":613,"searchDepth":847,"depth":847,"links":20478},[],"An animated border effect.",{},{"title":389,"description":20479},[1067,5952,6732],"qgqDu1UTnDU7QCEDK8I2lIvkVRQQ1BTQIxJjWbAABQ4",{"id":20485,"title":393,"badge":687,"body":20486,"category":368,"description":20707,"extension":856,"links":687,"meta":20708,"navigation":859,"path":394,"seo":20709,"stem":395,"tags":20710,"__hash__":20711},"docs_en/en/2.components/special-effects/glowing-effect.md",{"type":689,"value":20487,"toc":20705},[20488],[5728,20489,20494,20692],{":component-files":20490,"component-id":20491,"config":20492,"demo-file":20493},"[\"GlowingEffect.vue\"]","glowing-effect","GlowingEffectConfig","GlowingEffectDemo.vue",[3549,20495,20496,20498],{"v-slot:api":613},[882,20497,5856],{"id":5855},[5858,20499,20500,20512],{},[5861,20501,20502],{},[5864,20503,20504,20506,20508,20510],{},[5867,20505,5869],{},[5867,20507,5872],{},[5867,20509,5875],{},[5867,20511,5878],{},[5880,20513,20514,20531,20549,20567,20584,20603,20621,20637,20657,20675],{},[5864,20515,20516,20520,20524,20528],{},[5885,20517,20518],{},[894,20519,6148],{},[5885,20521,20522],{},[894,20523,6016],{},[5885,20525,20526],{},[894,20527,6157],{},[5885,20529,20530],{},"The blur radius applied to the glow layer.",[5864,20532,20533,20538,20542,20546],{},[5885,20534,20535],{},[894,20536,20537],{},"inactiveZone",[5885,20539,20540],{},[894,20541,6016],{},[5885,20543,20544],{},[894,20545,6388],{},[5885,20547,20548],{},"Defines the inner radius (as a fraction of the smallest dimension) within which the glow is inactive.",[5864,20550,20551,20556,20560,20564],{},[5885,20552,20553],{},[894,20554,20555],{},"proximity",[5885,20557,20558],{},[894,20559,6016],{},[5885,20561,20562],{},[894,20563,6157],{},[5885,20565,20566],{},"Additional proximity distance (in pixels) to trigger the glow when the cursor is near the element.",[5864,20568,20569,20573,20577,20581],{},[5885,20570,20571],{},[894,20572,19513],{},[5885,20574,20575],{},[894,20576,6016],{},[5885,20578,20579],{},[894,20580,12032],{},[5885,20582,20583],{},"Size of the spread of the glow effect around the element.",[5864,20585,20586,20590,20595,20600],{},[5885,20587,20588],{},[894,20589,12525],{},[5885,20591,20592],{},[894,20593,20594],{},"\"default\" | \"white\"",[5885,20596,20597],{},[894,20598,20599],{},"\"default\"",[5885,20601,20602],{},"Variant of the glow style (e.g., a white-themed version).",[5864,20604,20605,20610,20614,20618],{},[5885,20606,20607],{},[894,20608,20609],{},"glow",[5885,20611,20612],{},[894,20613,5914],{},[5885,20615,20616],{},[894,20617,7446],{},[5885,20619,20620],{},"Controls the visibility of the static glow border.",[5864,20622,20623,20627,20631,20635],{},[5885,20624,20625],{},[894,20626,5889],{},[5885,20628,20629],{},[894,20630,5894],{},[5885,20632,20633],{},[894,20634,6077],{},[5885,20636,6962],{},[5864,20638,20639,20644,20648,20652],{},[5885,20640,20641],{},[894,20642,20643],{},"disabled",[5885,20645,20646],{},[894,20647,5914],{},[5885,20649,20650],{},[894,20651,5919],{},[5885,20653,20654,20655,880],{},"Disables the proximity detection and glow animations when ",[894,20656,5919],{},[5864,20658,20659,20664,20668,20672],{},[5885,20660,20661],{},[894,20662,20663],{},"movementDuration",[5885,20665,20666],{},[894,20667,6016],{},[5885,20669,20670],{},[894,20671,7938],{},[5885,20673,20674],{},"Duration (in seconds) of the smooth rotation animation.",[5864,20676,20677,20681,20685,20689],{},[5885,20678,20679],{},[894,20680,9980],{},[5885,20682,20683],{},[894,20684,6016],{},[5885,20686,20687],{},[894,20688,1758],{},[5885,20690,20691],{},"Width (in pixels) of the border applied to the glow effect.",[3549,20693,20694],{"v-slot:credits":613},[751,20695,20696],{},[754,20697,20698,20699],{},"Ported from (Aceternity UI Glowing Effect)",[934,20700,20701],{},[696,20702,20703],{"href":20703,"rel":20704},"https://ui.aceternity.com/components/glowing-effect",[700],{"title":613,"searchDepth":847,"depth":847,"links":20706},[],"A dynamic proximity-based glow effect that reacts to mouse movements and scroll events, perfect for highlighting interactive elements.",{},{"title":393,"description":20707},[1067,5952,5954],"CWDS2H9AZL70uw7KBo-RsAOdOBCzOtNdw3YqVx9wiA8",{"id":20713,"title":397,"badge":687,"body":20714,"category":368,"description":20956,"extension":856,"links":687,"meta":20957,"navigation":859,"path":398,"seo":20958,"stem":399,"tags":20959,"__hash__":20960},"docs_en/en/2.components/special-effects/images-badge.md",{"type":689,"value":20715,"toc":20954},[20716],[5728,20717,20722,20943],{":component-files":20718,"component-id":20719,"config":20720,"demo-file":20721},"[\"ImagesBadge.vue\"]","images-badge","ImagesBadgeConfig","ImagesBadgeDemo.vue",[3549,20723,20724,20726],{"v-slot:api":613},[882,20725,5856],{"id":5855},[5858,20727,20728,20740],{},[5861,20729,20730],{},[5864,20731,20732,20734,20736,20738],{},[5867,20733,5869],{},[5867,20735,5872],{},[5867,20737,5875],{},[5867,20739,5878],{},[5880,20741,20742,20757,20772,20787,20810,20830,20850,20869,20888,20907,20925],{},[5864,20743,20744,20748,20752,20754],{},[5885,20745,20746],{},[894,20747,10142],{},[5885,20749,20750],{},[894,20751,5894],{},[5885,20753,7124],{},[5885,20755,20756],{},"Text label displayed next to the folder badge.",[5864,20758,20759,20763,20767,20769],{},[5885,20760,20761],{},[894,20762,12507],{},[5885,20764,20765],{},[894,20766,9806],{},[5885,20768,7124],{},[5885,20770,20771],{},"Array of image URLs to display (up to 3 are shown).",[5864,20773,20774,20778,20782,20784],{},[5885,20775,20776],{},[894,20777,5889],{},[5885,20779,20780],{},[894,20781,5894],{},[5885,20783,7124],{},[5885,20785,20786],{},"Additional CSS classes for the root element.",[5864,20788,20789,20793,20797,20799],{},[5885,20790,20791],{},[894,20792,15841],{},[5885,20794,20795],{},[894,20796,5894],{},[5885,20798,7124],{},[5885,20800,20801,20802,20805,20806,20809],{},"Optional link URL; renders an ",[894,20803,20804],{},"\u003Ca>"," tag instead of ",[894,20807,20808],{},"\u003Cdiv>"," when provided.",[5864,20811,20812,20817,20821,20823],{},[5885,20813,20814],{},[894,20815,20816],{},"target",[5885,20818,20819],{},[894,20820,5894],{},[5885,20822,7124],{},[5885,20824,20825,20826,20829],{},"Link target attribute (e.g. ",[894,20827,20828],{},"_blank"," for new tab).",[5864,20831,20832,20837,20842,20847],{},[5885,20833,20834],{},[894,20835,20836],{},"folderSize",[5885,20838,20839],{},[894,20840,20841],{},"{ width: number; height: number }",[5885,20843,20844],{},[894,20845,20846],{},"{ width: 32, height: 24 }",[5885,20848,20849],{},"Folder icon dimensions in pixels.",[5864,20851,20852,20857,20861,20866],{},[5885,20853,20854],{},[894,20855,20856],{},"teaserImageSize",[5885,20858,20859],{},[894,20860,20841],{},[5885,20862,20863],{},[894,20864,20865],{},"{ width: 20, height: 14 }",[5885,20867,20868],{},"Image dimensions while peeking (idle state) in pixels.",[5864,20870,20871,20876,20880,20885],{},[5885,20872,20873],{},[894,20874,20875],{},"hoverImageSize",[5885,20877,20878],{},[894,20879,20841],{},[5885,20881,20882],{},[894,20883,20884],{},"{ width: 48, height: 32 }",[5885,20886,20887],{},"Image dimensions when hovered in pixels.",[5864,20889,20890,20895,20899,20904],{},[5885,20891,20892],{},[894,20893,20894],{},"hoverTranslateY",[5885,20896,20897],{},[894,20898,6016],{},[5885,20900,20901],{},[894,20902,20903],{},"-35",[5885,20905,20906],{},"How far images translate upward on hover in pixels.",[5864,20908,20909,20914,20918,20922],{},[5885,20910,20911],{},[894,20912,20913],{},"hoverSpread",[5885,20915,20916],{},[894,20917,6016],{},[5885,20919,20920],{},[894,20921,12032],{},[5885,20923,20924],{},"Horizontal spread between images on hover in pixels.",[5864,20926,20927,20932,20936,20940],{},[5885,20928,20929],{},[894,20930,20931],{},"hoverRotation",[5885,20933,20934],{},[894,20935,6016],{},[5885,20937,20938],{},[894,20939,19243],{},[5885,20941,20942],{},"Fan rotation angle for images on hover in degrees.",[3549,20944,20945],{"v-slot:credits":613},[751,20946,20947],{},[754,20948,6969,20949],{},[696,20950,20953],{"href":20951,"rel":20952},"https://ui.aceternity.com/components/images-badge",[700],"Aceternity UI Images Badge",{"title":613,"searchDepth":847,"depth":847,"links":20955},[],"A badge with images that can be hovered to reveal more images.",{},{"title":397,"description":20956},[1067,5952,5954],"2fZxy42UnXx3do80XTiwXJw-r7rzyhy0vLMkTcaTVf4",{"id":20962,"title":401,"badge":687,"body":20963,"category":368,"description":21195,"extension":856,"links":687,"meta":21196,"navigation":859,"path":402,"seo":21197,"stem":403,"tags":21198,"__hash__":21199},"docs_en/en/2.components/special-effects/meteors.md",{"type":689,"value":20964,"toc":21193},[20965,21190],[5728,20966,20971,21025,21179],{":component-files":20967,"component-id":20968,"config":20969,"demo-file":20970},"[\"Meteors.vue\"]","meteors","MeteorsConfig","MeteorsDemo.vue",[3549,20972,20973,20975],{"v-slot:api":613},[882,20974,5856],{"id":5855},[5858,20976,20977,20989],{},[5861,20978,20979],{},[5864,20980,20981,20983,20985,20987],{},[5867,20982,5869],{},[5867,20984,5872],{},[5867,20986,5875],{},[5867,20988,5878],{},[5880,20990,20991,21008],{},[5864,20992,20993,20997,21001,21005],{},[5885,20994,20995],{},[894,20996,6504],{},[5885,20998,20999],{},[894,21000,6016],{},[5885,21002,21003],{},[894,21004,12032],{},[5885,21006,21007],{},"The number of meteors to display in the animation.",[5864,21009,21010,21014,21018,21022],{},[5885,21011,21012],{},[894,21013,5889],{},[5885,21015,21016],{},[894,21017,5894],{},[5885,21019,21020],{},[894,21021,6077],{},[5885,21023,21024],{},"Additional CSS classes to apply to the meteors for customization.",[3549,21026,21027,21031],{"v-slot:instructions":613},[692,21028,5738,21029,5741],{},[894,21030,1036],{},[925,21032,21034],{"className":1065,"code":21033,"language":1067,"meta":613,"style":613},"@theme inline {\n  --animate-meteor-effect: meteor 5s linear infinite;\n  @keyframes meteor {\n    0% {\n      transform: rotate(215deg) translateX(0);\n      opacity: 1;\n    }\n    70% {\n      opacity: 1;\n    }\n    100% {\n      transform: rotate(215deg) translateX(-500px);\n      opacity: 0;\n    }\n  }\n}\n",[894,21035,21036,21044,21049,21058,21064,21090,21102,21106,21113,21123,21127,21134,21157,21167,21171,21175],{"__ignoreMap":613},[934,21037,21038,21040,21042],{"class":936,"line":937},[934,21039,1111],{"class":1074},[934,21041,2508],{"class":1114},[934,21043,1118],{"class":1078},[934,21045,21046],{"class":936,"line":847},[934,21047,21048],{"class":1114},"  --animate-meteor-effect: meteor 5s linear infinite;\n",[934,21050,21051,21053,21056],{"class":936,"line":850},[934,21052,5764],{"class":1074},[934,21054,21055],{"class":5767}," meteor",[934,21057,1312],{"class":1078},[934,21059,21060,21062],{"class":936,"line":1108},[934,21061,20391],{"class":940},[934,21063,1312],{"class":1078},[934,21065,21066,21069,21071,21074,21076,21079,21081,21084,21086,21088],{"class":936,"line":1121},[934,21067,21068],{"class":2732},"      transform",[934,21070,1305],{"class":1078},[934,21072,21073],{"class":1323}," rotate",[934,21075,1327],{"class":1078},[934,21077,21078],{"class":1757},"215deg",[934,21080,3796],{"class":1078},[934,21082,21083],{"class":1323}," translateX",[934,21085,1327],{"class":1078},[934,21087,6157],{"class":1757},[934,21089,1333],{"class":1078},[934,21091,21092,21095,21097,21100],{"class":936,"line":1127},[934,21093,21094],{"class":2732},"      opacity",[934,21096,1305],{"class":1078},[934,21098,21099],{"class":1757}," 1",[934,21101,1087],{"class":1078},[934,21103,21104],{"class":936,"line":1133},[934,21105,5808],{"class":1078},[934,21107,21108,21111],{"class":936,"line":1138},[934,21109,21110],{"class":940},"    70%",[934,21112,1312],{"class":1078},[934,21114,21115,21117,21119,21121],{"class":936,"line":1144},[934,21116,21094],{"class":2732},[934,21118,1305],{"class":1078},[934,21120,21099],{"class":1757},[934,21122,1087],{"class":1078},[934,21124,21125],{"class":936,"line":1150},[934,21126,5808],{"class":1078},[934,21128,21129,21132],{"class":936,"line":1155},[934,21130,21131],{"class":940},"    100%",[934,21133,1312],{"class":1078},[934,21135,21136,21138,21140,21142,21144,21146,21148,21150,21152,21155],{"class":936,"line":1161},[934,21137,21068],{"class":2732},[934,21139,1305],{"class":1078},[934,21141,21073],{"class":1323},[934,21143,1327],{"class":1078},[934,21145,21078],{"class":1757},[934,21147,3796],{"class":1078},[934,21149,21083],{"class":1323},[934,21151,1327],{"class":1078},[934,21153,21154],{"class":1757},"-500px",[934,21156,1333],{"class":1078},[934,21158,21159,21161,21163,21165],{"class":936,"line":1167},[934,21160,21094],{"class":2732},[934,21162,1305],{"class":1078},[934,21164,1761],{"class":1757},[934,21166,1087],{"class":1078},[934,21168,21169],{"class":936,"line":1172},[934,21170,5808],{"class":1078},[934,21172,21173],{"class":936,"line":1178},[934,21174,2687],{"class":1078},[934,21176,21177],{"class":936,"line":1184},[934,21178,1294],{"class":1078},[3549,21180,21181],{"v-slot:credits":613},[751,21182,21183],{},[754,21184,6969,21185],{},[696,21186,21189],{"href":21187,"rel":21188},"https://ui.aceternity.com/components/meteors",[700],"Aceternity UI's Meteor Effect",[2836,21191,21192],{},"html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sqsOY, html code.shiki .sqsOY{--shiki-light:#8796B0;--shiki-default:#B2CCD6;--shiki-dark:#B2CCD6}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":613,"searchDepth":847,"depth":847,"links":21194},[],"A component that displays a meteor shower animation with customizable meteor count and styling.",{},{"title":401,"description":21195},[1067,5952,5954],"eDAnf2lYZon-IGpxZGITwTcSPU7XlFkTtSNcOAWase8",{"id":21201,"title":405,"badge":687,"body":21202,"category":368,"description":21429,"extension":856,"links":687,"meta":21430,"navigation":859,"path":406,"seo":21431,"stem":407,"tags":21432,"__hash__":21434},"docs_en/en/2.components/special-effects/neon-border.md",{"type":689,"value":21203,"toc":21427},[21204,21424],[5728,21205,21210,21321,21417],{":component-files":21206,"component-id":21207,"config":21208,"demo-file":21209},"[\"NeonBorder.vue\"]","neon-border","NeonBorderConfig","NeonBorderDemo.vue",[3549,21211,21212,21214],{"v-slot:api":613},[882,21213,5856],{"id":5855},[5858,21215,21216,21228],{},[5861,21217,21218],{},[5864,21219,21220,21222,21224,21226],{},[5867,21221,5869],{},[5867,21223,5872],{},[5867,21225,5875],{},[5867,21227,5878],{},[5880,21229,21230,21249,21268,21288,21305],{},[5864,21231,21232,21237,21241,21246],{},[5885,21233,21234],{},[894,21235,21236],{},"color1",[5885,21238,21239],{},[894,21240,5894],{},[5885,21242,21243],{},[894,21244,21245],{},"\"#0496ff\"",[5885,21247,21248],{},"Primary color of the neon border.",[5864,21250,21251,21256,21260,21265],{},[5885,21252,21253],{},[894,21254,21255],{},"color2",[5885,21257,21258],{},[894,21259,5894],{},[5885,21261,21262],{},[894,21263,21264],{},"\"#ff0a54\"",[5885,21266,21267],{},"Secondary color of the neon border.",[5864,21269,21270,21275,21280,21285],{},[5885,21271,21272],{},[894,21273,21274],{},"animationType",[5885,21276,21277],{},[894,21278,21279],{},"\"none\" | \"half\" | \"full\"",[5885,21281,21282],{},[894,21283,21284],{},"\"half\"",[5885,21286,21287],{},"Type of animation effect applied to the border.",[5864,21289,21290,21294,21298,21302],{},[5885,21291,21292],{},[894,21293,6933],{},[5885,21295,21296],{},[894,21297,6016],{},[5885,21299,21300],{},[894,21301,6603],{},[5885,21303,21304],{},"Duration of the animation effect in seconds.",[5864,21306,21307,21311,21315,21319],{},[5885,21308,21309],{},[894,21310,5889],{},[5885,21312,21313],{},[894,21314,5894],{},[5885,21316,21317],{},[894,21318,6077],{},[5885,21320,18680],{},[3549,21322,21323,21327],{"v-slot:instructions":613},[692,21324,5738,21325,5741],{},[894,21326,1036],{},[925,21328,21330],{"className":1065,"code":21329,"language":1067,"meta":613,"style":613},"@theme inline {\n  --animate-neon-border: neon-border var(--neon-border-duration) linear infinite;\n  @keyframes neon-border {\n    0% {\n      transform: rotate(0deg);\n    }\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n}\n",[894,21331,21332,21340,21350,21359,21365,21380,21384,21390,21405,21409,21413],{"__ignoreMap":613},[934,21333,21334,21336,21338],{"class":936,"line":937},[934,21335,1111],{"class":1074},[934,21337,2508],{"class":1114},[934,21339,1118],{"class":1078},[934,21341,21342,21345,21347],{"class":936,"line":847},[934,21343,21344],{"class":1114},"  --animate-neon-border: ",[934,21346,21207],{"class":940},[934,21348,21349],{"class":1114}," var(--neon-border-duration) linear infinite;\n",[934,21351,21352,21354,21357],{"class":936,"line":850},[934,21353,5764],{"class":1074},[934,21355,21356],{"class":5767}," neon-border",[934,21358,1312],{"class":1078},[934,21360,21361,21363],{"class":936,"line":1108},[934,21362,20391],{"class":940},[934,21364,1312],{"class":1078},[934,21366,21367,21369,21371,21373,21375,21378],{"class":936,"line":1121},[934,21368,21068],{"class":2732},[934,21370,1305],{"class":1078},[934,21372,21073],{"class":1323},[934,21374,1327],{"class":1078},[934,21376,21377],{"class":1757},"0deg",[934,21379,1333],{"class":1078},[934,21381,21382],{"class":936,"line":1127},[934,21383,5808],{"class":1078},[934,21385,21386,21388],{"class":936,"line":1133},[934,21387,21131],{"class":940},[934,21389,1312],{"class":1078},[934,21391,21392,21394,21396,21398,21400,21403],{"class":936,"line":1138},[934,21393,21068],{"class":2732},[934,21395,1305],{"class":1078},[934,21397,21073],{"class":1323},[934,21399,1327],{"class":1078},[934,21401,21402],{"class":1757},"360deg",[934,21404,1333],{"class":1078},[934,21406,21407],{"class":936,"line":1144},[934,21408,5808],{"class":1078},[934,21410,21411],{"class":936,"line":1150},[934,21412,2687],{"class":1078},[934,21414,21415],{"class":936,"line":1155},[934,21416,1294],{"class":1078},[3549,21418,21419],{"v-slot:credits":613},[751,21420,21421],{},[754,21422,21423],{},"Inspired by modern neon border effects.",[2836,21425,21426],{},"html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sqsOY, html code.shiki .sqsOY{--shiki-light:#8796B0;--shiki-default:#B2CCD6;--shiki-dark:#B2CCD6}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":613,"searchDepth":847,"depth":847,"links":21428},[],"A visually appealing neon border component with customizable animations and colors.",{},{"title":405,"description":21429},[1067,5952,21433],"border","Z_CxVbGdmWDJzKnLcAH7dMipQMRdzP4VgFMIfCUGs2E",{"id":21436,"title":409,"badge":687,"body":21437,"category":368,"description":21794,"extension":856,"links":687,"meta":21795,"navigation":859,"path":410,"seo":21796,"stem":411,"tags":21797,"__hash__":21799},"docs_en/en/2.components/special-effects/particle-image.md",{"type":689,"value":21438,"toc":21792},[21439],[5728,21440,21445,21772],{":component-files":21441,"component-id":21442,"config":21443,"demo-file":21444},"[\"ParticleImage.vue\", \"inspiraImageParticles.js\", \"inspiraImageParticles.d.ts\"]","particle-image","ParticleImageConfig","ParticleImageDemo.vue",[3549,21446,21447,21449],{"v-slot:api":613},[882,21448,5856],{"id":5855},[5858,21450,21451,21463],{},[5861,21452,21453],{},[5864,21454,21455,21457,21459,21461],{},[5867,21456,5869],{},[5867,21458,5872],{},[5867,21460,5875],{},[5867,21462,5878],{},[5880,21464,21465,21482,21499,21517,21535,21552,21570,21588,21606,21625,21641,21659,21679,21698,21718,21736,21754],{},[5864,21466,21467,21471,21475,21479],{},[5885,21468,21469],{},[894,21470,17576],{},[5885,21472,21473],{},[894,21474,5894],{},[5885,21476,21477],{},[894,21478,8291],{},[5885,21480,21481],{},"Source URL for the image to which the particle effect is applied.",[5864,21483,21484,21488,21492,21496],{},[5885,21485,21486],{},[894,21487,5889],{},[5885,21489,21490],{},[894,21491,5894],{},[5885,21493,21494],{},[894,21495,8291],{},[5885,21497,21498],{},"Additional CSS classes to apply to the image element.",[5864,21500,21501,21506,21510,21514],{},[5885,21502,21503],{},[894,21504,21505],{},"canvasWidth",[5885,21507,21508],{},[894,21509,5894],{},[5885,21511,21512],{},[894,21513,8291],{},[5885,21515,21516],{},"Width of the particle effect canvas.",[5864,21518,21519,21524,21528,21532],{},[5885,21520,21521],{},[894,21522,21523],{},"canvasHeight",[5885,21525,21526],{},[894,21527,5894],{},[5885,21529,21530],{},[894,21531,8291],{},[5885,21533,21534],{},"Height of the particle effect canvas.",[5864,21536,21537,21541,21545,21549],{},[5885,21538,21539],{},[894,21540,19568],{},[5885,21542,21543],{},[894,21544,5894],{},[5885,21546,21547],{},[894,21548,8291],{},[5885,21550,21551],{},"Gravity force affecting the particle movement.",[5864,21553,21554,21559,21563,21567],{},[5885,21555,21556],{},[894,21557,21558],{},"particleSize",[5885,21560,21561],{},[894,21562,5894],{},[5885,21564,21565],{},[894,21566,8291],{},[5885,21568,21569],{},"Size of the particles.",[5864,21571,21572,21577,21581,21585],{},[5885,21573,21574],{},[894,21575,21576],{},"particleGap",[5885,21578,21579],{},[894,21580,5894],{},[5885,21582,21583],{},[894,21584,8291],{},[5885,21586,21587],{},"Gap between particles.",[5864,21589,21590,21595,21599,21603],{},[5885,21591,21592],{},[894,21593,21594],{},"mouseForce",[5885,21596,21597],{},[894,21598,5894],{},[5885,21600,21601],{},[894,21602,8291],{},[5885,21604,21605],{},"Force applied to particles based on mouse movement.",[5864,21607,21608,21613,21618,21622],{},[5885,21609,21610],{},[894,21611,21612],{},"renderer",[5885,21614,21615],{},[894,21616,21617],{},"\"default\" | \"webgl\"",[5885,21619,21620],{},[894,21621,8291],{},[5885,21623,21624],{},"The renderer to use for particle generation, either default or WebGL.",[5864,21626,21627,21631,21635,21639],{},[5885,21628,21629],{},[894,21630,6485],{},[5885,21632,21633],{},[894,21634,5894],{},[5885,21636,21637],{},[894,21638,7318],{},[5885,21640,7321],{},[5864,21642,21643,21648,21652,21656],{},[5885,21644,21645],{},[894,21646,21647],{},"colorArr",[5885,21649,21650],{},[894,21651,13142],{},[5885,21653,21654],{},[894,21655,8291],{},[5885,21657,21658],{},"Array of numbers to define multiple particle colors.",[5864,21660,21661,21666,21671,21676],{},[5885,21662,21663],{},[894,21664,21665],{},"initPosition",[5885,21667,21668],{},[894,21669,21670],{},"\"random\" | \"top\" | \"left\" | \"bottom\" | \"right\" | \"misplaced\" | \"none\"",[5885,21672,21673],{},[894,21674,21675],{},"random",[5885,21677,21678],{},"Initial position of the particles when the animation starts.",[5864,21680,21681,21686,21691,21695],{},[5885,21682,21683],{},[894,21684,21685],{},"initDirection",[5885,21687,21688],{},[894,21689,21690],{},"\"random\" | \"top\" | \"left\" | \"bottom\" | \"right\" | \"none\"",[5885,21692,21693],{},[894,21694,21675],{},[5885,21696,21697],{},"Initial direction of the particles when the animation starts.",[5864,21699,21700,21705,21710,21715],{},[5885,21701,21702],{},[894,21703,21704],{},"fadePosition",[5885,21706,21707],{},[894,21708,21709],{},"\"explode\" | \"top\" | \"left\" | \"bottom\" | \"right\" | \"random\" | \"none\"",[5885,21711,21712],{},[894,21713,21714],{},"none",[5885,21716,21717],{},"Position where the particles fade out.",[5864,21719,21720,21725,21729,21733],{},[5885,21721,21722],{},[894,21723,21724],{},"fadeDirection",[5885,21726,21727],{},[894,21728,21690],{},[5885,21730,21731],{},[894,21732,21714],{},[5885,21734,21735],{},"Direction in which the particles fade out.",[5864,21737,21738,21743,21747,21751],{},[5885,21739,21740],{},[894,21741,21742],{},"noise",[5885,21744,21745],{},[894,21746,6016],{},[5885,21748,21749],{},[894,21750,8291],{},[5885,21752,21753],{},"Noise of the particles.",[5864,21755,21756,21761,21765,21769],{},[5885,21757,21758],{},[894,21759,21760],{},"responsiveWidth",[5885,21762,21763],{},[894,21764,5914],{},[5885,21766,21767],{},[894,21768,7446],{},[5885,21770,21771],{},"Should the canvas be responsive.",[3549,21773,21774],{"v-slot:credits":613},[751,21775,21776,21784],{},[754,21777,5929,21778,21783],{},[696,21779,21782],{"href":21780,"rel":21781},"https://nuxtlabs.com",[700],"Nuxt Labs"," for this inspiration.",[754,21785,5929,21786,21791],{},[696,21787,21790],{"href":21788,"rel":21789},"https://nextparticle.nextco.de",[700],"NextParticles"," for the base of the animation library.",{"title":613,"searchDepth":847,"depth":847,"links":21793},[],"Visually appealing particle animation applied to images as seen on NuxtLabs.com",{},{"title":409,"description":21794},[1067,5952,6108,21798],"particles","FoRstRNDcc9ragKmjMzzTtkBoXXpBCcvdLzbMo7Kik8",{"id":21801,"title":413,"badge":687,"body":21802,"category":368,"description":21930,"extension":856,"links":687,"meta":21931,"navigation":859,"path":414,"seo":21932,"stem":415,"tags":21933,"__hash__":21935},"docs_en/en/2.components/special-effects/progressive-blur.md",{"type":689,"value":21803,"toc":21928},[21804],[5728,21805,21810,21912],{":component-files":21806,"component-id":21807,"config":21808,"demo-file":21809},"[\"ProgressiveBlur.vue\"]","progressive-blur","ProgressiveBlurConfig","ProgressiveBlurDemo.vue",[3549,21811,21812,21814,21902],{"v-slot:api":613},[882,21813,5856],{"id":5855},[5858,21815,21816,21828],{},[5861,21817,21818],{},[5864,21819,21820,21822,21824,21826],{},[5867,21821,5869],{},[5867,21823,5872],{},[5867,21825,5875],{},[5867,21827,5878],{},[5880,21829,21830,21849,21867,21885],{},[5864,21831,21832,21836,21841,21846],{},[5885,21833,21834],{},[894,21835,7459],{},[5885,21837,21838],{},[894,21839,21840],{},"\"top\" | \"right\" | \"bottom\" | \"left\"",[5885,21842,21843],{},[894,21844,21845],{},"\"bottom\"",[5885,21847,21848],{},"Direction in which the blur progressively increases.",[5864,21850,21851,21856,21860,21864],{},[5885,21852,21853],{},[894,21854,21855],{},"blurLayers",[5885,21857,21858],{},[894,21859,6016],{},[5885,21861,21862],{},[894,21863,10041],{},[5885,21865,21866],{},"Number of blur layers used to create the progressive effect.",[5864,21868,21869,21874,21878,21882],{},[5885,21870,21871],{},[894,21872,21873],{},"blurIntensity",[5885,21875,21876],{},[894,21877,6016],{},[5885,21879,21880],{},[894,21881,12689],{},[5885,21883,21884],{},"Blur strength multiplier per layer (in pixels).",[5864,21886,21887,21891,21895,21899],{},[5885,21888,21889],{},[894,21890,5889],{},[5885,21892,21893],{},[894,21894,5894],{},[5885,21896,21897],{},[894,21898,6077],{},[5885,21900,21901],{},"Optional class applied to the wrapper container.",[7129,21903,21904],{},[692,21905,21906,21907,21909,21910,880],{},"This component also accepts all valid ",[894,21908,1023],{}," props for a ",[894,21911,10901],{},[3549,21913,21914],{"v-slot:credits":613},[751,21915,21916,21923],{},[754,21917,6969,21918,880],{},[696,21919,21922],{"href":21920,"rel":21921},"https://motion-primitives.com/docs/progressive-blur",[700],"Motion Primitives Progressive Blur",[754,21924,21925,21926],{},"Powered by ",[894,21927,1023],{},{"title":613,"searchDepth":847,"depth":847,"links":21929},[],"A layered backdrop blur effect that gradually increases intensity in a chosen direction, perfect for depth, focus, and visual separation.",{},{"title":413,"description":21930},[1067,5952,1023,6148,21934],"backdrop-filter","hKoDnGlTlX56l0Hov3C7v6iO3tiFZH-YkL8eChIj90g",{"id":21937,"title":417,"badge":687,"body":21938,"category":368,"description":22060,"extension":856,"links":687,"meta":22061,"navigation":859,"path":418,"seo":22062,"stem":419,"tags":22063,"__hash__":22064},"docs_en/en/2.components/special-effects/scales.md",{"type":689,"value":21939,"toc":22058},[21940],[5728,21941,21946,22047],{":component-files":21942,"component-id":21943,"config":21944,"demo-file":21945},"[\"Scales.vue\"]","scales","ScalesConfig","ScalesDemo.vue",[3549,21947,21948,21950],{"v-slot:api":613},[882,21949,5856],{"id":5855},[5858,21951,21952,21964],{},[5861,21953,21954],{},[5864,21955,21956,21958,21960,21962],{},[5867,21957,5869],{},[5867,21959,5872],{},[5867,21961,5875],{},[5867,21963,5878],{},[5880,21965,21966,21985,22002,22017,22032],{},[5864,21967,21968,21972,21977,21982],{},[5885,21969,21970],{},[894,21971,16905],{},[5885,21973,21974],{},[894,21975,21976],{},"\"horizontal\" | \"vertical\" | \"diagonal\"",[5885,21978,21979],{},[894,21980,21981],{},"\"diagonal\"",[5885,21983,21984],{},"Direction of the repeating line pattern.",[5864,21986,21987,21991,21995,21999],{},[5885,21988,21989],{},[894,21990,7525],{},[5885,21992,21993],{},[894,21994,6016],{},[5885,21996,21997],{},[894,21998,8850],{},[5885,22000,22001],{},"Size of each repeating tile in pixels.",[5864,22003,22004,22008,22012,22014],{},[5885,22005,22006],{},[894,22007,6485],{},[5885,22009,22010],{},[894,22011,5894],{},[5885,22013,7124],{},[5885,22015,22016],{},"CSS color value for the pattern lines.",[5864,22018,22019,22023,22027,22029],{},[5885,22020,22021],{},[894,22022,5889],{},[5885,22024,22025],{},[894,22026,5894],{},[5885,22028,7124],{},[5885,22030,22031],{},"Additional CSS classes for the inner pattern overlay.",[5864,22033,22034,22038,22042,22044],{},[5885,22035,22036],{},[894,22037,9370],{},[5885,22039,22040],{},[894,22041,5894],{},[5885,22043,7124],{},[5885,22045,22046],{},"Additional CSS classes for the outer container element.",[3549,22048,22049],{"v-slot:credits":613},[751,22050,22051],{},[754,22052,6969,22053,880],{},[696,22054,22057],{"href":22055,"rel":22056},"https://ui.aceternity.com/components/scales",[700],"Aceternity UI Scales",{"title":613,"searchDepth":847,"depth":847,"links":22059},[],"A repeating diagonal, horizontal, or vertical line pattern background effect.",{},{"title":417,"description":22060},[1067,5952,5954],"dnKzmUklCzSOfdQeWlOSB5K6GvSazJm4e46Po8ewNXI",{"id":22066,"title":421,"badge":687,"body":22067,"category":368,"description":22255,"extension":856,"links":687,"meta":22256,"navigation":859,"path":422,"seo":22257,"stem":423,"tags":22258,"__hash__":22259},"docs_en/en/2.components/special-effects/scratch-to-reveal.md",{"type":689,"value":22068,"toc":22253},[22069],[5728,22070,22075,22237],{":component-files":22071,"component-id":22072,"config":22073,"demo-file":22074},"[\"ScratchToReveal.vue\"]","scratch-to-reveal","ScratchToRevealConfig","ScratchToRevealDemo.vue",[3549,22076,22077,22079,22183,22210],{"v-slot:api":613},[882,22078,5856],{"id":5855},[5858,22080,22081,22093],{},[5861,22082,22083],{},[5864,22084,22085,22087,22089,22091],{},[5867,22086,5869],{},[5867,22088,5872],{},[5867,22090,5875],{},[5867,22092,5878],{},[5880,22094,22095,22112,22129,22146,22164],{},[5864,22096,22097,22101,22105,22109],{},[5885,22098,22099],{},[894,22100,5889],{},[5885,22102,22103],{},[894,22104,5894],{},[5885,22106,22107],{},[894,22108,6077],{},[5885,22110,22111],{},"The class name to apply to the component.",[5864,22113,22114,22118,22122,22126],{},[5885,22115,22116],{},[894,22117,6649],{},[5885,22119,22120],{},[894,22121,6016],{},[5885,22123,22124],{},[894,22125,6077],{},[5885,22127,22128],{},"Width of the scratch container.",[5864,22130,22131,22135,22139,22143],{},[5885,22132,22133],{},[894,22134,6667],{},[5885,22136,22137],{},[894,22138,6016],{},[5885,22140,22141],{},[894,22142,6077],{},[5885,22144,22145],{},"Height of the scratch container.",[5864,22147,22148,22153,22157,22161],{},[5885,22149,22150],{},[894,22151,22152],{},"minScratchPercentage",[5885,22154,22155],{},[894,22156,6016],{},[5885,22158,22159],{},[894,22160,6021],{},[5885,22162,22163],{},"Minimum percentage of scratched area to be considered as completed (Value between 0 and 100).",[5864,22165,22166,22171,22176,22180],{},[5885,22167,22168],{},[894,22169,22170],{},"gradientColors",[5885,22172,22173],{},[894,22174,22175],{},"[string,string,string]",[5885,22177,22178],{},[894,22179,5899],{},[5885,22181,22182],{},"Gradient colors for the scratch effect.",[5858,22184,22185,22195],{},[5861,22186,22187],{},[5864,22188,22189,22191,22193],{},[5867,22190,10393],{},[5867,22192,14963],{},[5867,22194,5878],{},[5880,22196,22197],{},[5864,22198,22199,22203,22207],{},[5885,22200,22201],{},[894,22202,18075],{},[5885,22204,22205],{},[894,22206,5899],{},[5885,22208,22209],{},"Callback function called when scratch is completed",[5858,22211,22212,22222],{},[5861,22213,22214],{},[5864,22215,22216,22218,22220],{},[5867,22217,11928],{},[5867,22219,16486],{},[5867,22221,5878],{},[5880,22223,22224],{},[5864,22225,22226,22230,22234],{},[5885,22227,22228],{},[894,22229,3785],{},[5885,22231,22232],{},[894,22233,5899],{},[5885,22235,22236],{},"The text below the scratch-off ticket.",[3549,22238,22239],{"v-slot:credits":613},[751,22240,22241,22246],{},[754,22242,5929,22243,6725],{},[696,22244,8882],{"href":8880,"rel":22245},[700],[754,22247,6857,22248,880],{},[696,22249,22252],{"href":22250,"rel":22251},"https://magicui.design/docs/components/scratch-to-reveal",[700],"MagicUI Scratch To Reveal",{"title":613,"searchDepth":847,"depth":847,"links":22254},[],"The ScratchToReveal component creates an interactive scratch-off effect with customizable dimensions and animations, revealing hidden content beneath.",{},{"title":421,"description":22255},[1067,5952,6732],"3Xfg_wUEqhYJfQwBCCsosfoMH-7m7hiScmDNwveVTMU",{"id":22261,"title":425,"badge":687,"body":22262,"category":368,"description":22373,"extension":856,"links":687,"meta":22374,"navigation":859,"path":426,"seo":22375,"stem":427,"tags":22376,"__hash__":22377},"docs_en/en/2.components/special-effects/spring-calendar.md",{"type":689,"value":22263,"toc":22371},[22264],[5728,22265,22270,22359],{":component-files":22266,"component-id":22267,"config":22268,"demo-file":22269},"[\"SpringCalendar.vue\", \"TextMorph.vue\"]","spring-calendar","SpringCalendarConfig","SpringCalendarDemo.vue",[3549,22271,22272,22274,22329,22331],{"v-slot:api":613},[882,22273,5856],{"id":5855},[5858,22275,22276,22288],{},[5861,22277,22278],{},[5864,22279,22280,22282,22284,22286],{},[5867,22281,5869],{},[5867,22283,5872],{},[5867,22285,5875],{},[5867,22287,5878],{},[5880,22289,22290,22311],{},[5864,22291,22292,22297,22302,22306],{},[5885,22293,22294],{},[894,22295,22296],{},"calendarData",[5885,22298,22299],{},[894,22300,22301],{},"Array\u003C{ month: string; date: number; day: string; events?: { title: string; day: string; time: string }[] }>",[5885,22303,22304],{},[702,22305,7124],{},[5885,22307,22308,22309,880],{},"Array defining each calendar day and its optional events. ",[10890,22310,9105],{},[5864,22312,22313,22318,22322,22326],{},[5885,22314,22315],{},[894,22316,22317],{},"initialIndex",[5885,22319,22320],{},[894,22321,6016],{},[5885,22323,22324],{},[894,22325,6157],{},[5885,22327,22328],{},"Day index initially selected.",[728,22330,10384],{"id":10383},[5858,22332,22333,22343],{},[5861,22334,22335],{},[5864,22336,22337,22339,22341],{},[5867,22338,14353],{},[5867,22340,14963],{},[5867,22342,5878],{},[5880,22344,22345],{},[5864,22346,22347,22352,22356],{},[5885,22348,22349],{},[894,22350,22351],{},"update:activeIndex",[5885,22353,22354],{},[894,22355,6016],{},[5885,22357,22358],{},"Fires when a day button is clicked, emitting the new active index.",[3549,22360,22361],{"v-slot:credits":613},[751,22362,22363],{},[754,22364,22365,22366],{},"Inspired from the work of ",[696,22367,22370],{"href":22368,"rel":22369},"https://x.com/sekachov",[700],"sekachov",{"title":613,"searchDepth":847,"depth":847,"links":22372},[],"An animated calendar widget that expands to reveal events and features smooth, spring‑based Motion‑V transitions.",{},{"title":425,"description":22373},[1067,5952,1023],"KQGtPILGINYqfsOmLKYSyzceJrYylYFQ_DdFQOI7JGY",{"id":22379,"title":434,"badge":687,"body":22380,"category":429,"description":22552,"extension":856,"links":687,"meta":22553,"navigation":859,"path":435,"seo":22554,"stem":436,"tags":22555,"__hash__":22557},"docs_en/en/2.components/testimonials/animated-testimonials.md",{"type":689,"value":22381,"toc":22550},[22382],[5728,22383,22388,22537],{":component-files":22384,"component-id":22385,"config":22386,"demo-file":22387},"[\"AnimatedTestimonials.vue\"]","animated-testimonials","AnimatedTestimonialsConfig","AnimatedTestimonialsDemo.vue",[3549,22389,22390,22392,22461,22465,22468],{"v-slot:api":613},[882,22391,5856],{"id":5855},[5858,22393,22394,22406],{},[5861,22395,22396],{},[5864,22397,22398,22400,22402,22404],{},[5867,22399,5869],{},[5867,22401,5872],{},[5867,22403,5875],{},[5867,22405,5878],{},[5880,22407,22408,22427,22444],{},[5864,22409,22410,22415,22420,22424],{},[5885,22411,22412],{},[894,22413,22414],{},"testimonials",[5885,22416,22417],{},[894,22418,22419],{},"Testimonial[]",[5885,22421,22422],{},[894,22423,3932],{},[5885,22425,22426],{},"An array of testimonial objects containing quote, name, image, and designation.",[5864,22428,22429,22433,22437,22441],{},[5885,22430,22431],{},[894,22432,16366],{},[5885,22434,22435],{},[894,22436,5914],{},[5885,22438,22439],{},[894,22440,7446],{},[5885,22442,22443],{},"Whether to cycle through testimonials automatically.",[5864,22445,22446,22450,22454,22458],{},[5885,22447,22448],{},[894,22449,6933],{},[5885,22451,22452],{},[894,22453,6016],{},[5885,22455,22456],{},[894,22457,7600],{},[5885,22459,22460],{},"Duration (in milliseconds) to wait before automatically transitioning to the next testimonial.",[728,22462,22464],{"id":22463},"testimonial-object","Testimonial Object",[692,22466,22467],{},"Each testimonial object must contain the following fields:",[5858,22469,22470,22480],{},[5861,22471,22472],{},[5864,22473,22474,22476,22478],{},[5867,22475,19463],{},[5867,22477,5872],{},[5867,22479,5878],{},[5880,22481,22482,22496,22509,22523],{},[5864,22483,22484,22489,22493],{},[5885,22485,22486],{},[894,22487,22488],{},"quote",[5885,22490,22491],{},[894,22492,5894],{},[5885,22494,22495],{},"The testimonial text.",[5864,22497,22498,22502,22506],{},[5885,22499,22500],{},[894,22501,15800],{},[5885,22503,22504],{},[894,22505,5894],{},[5885,22507,22508],{},"The name of the person or entity providing the testimonial.",[5864,22510,22511,22516,22520],{},[5885,22512,22513],{},[894,22514,22515],{},"designation",[5885,22517,22518],{},[894,22519,5894],{},[5885,22521,22522],{},"The position or role of the testimonial author (e.g., CEO, user).",[5864,22524,22525,22530,22534],{},[5885,22526,22527],{},[894,22528,22529],{},"image",[5885,22531,22532],{},[894,22533,5894],{},[5885,22535,22536],{},"URL of the image or avatar for the testimonial author.",[3549,22538,22539],{"v-slot:credits":613},[751,22540,22541],{},[754,22542,22543,22544,880],{},"Ported from (Aceternity UI Animated Testimonials)",[934,22545,22546],{},[696,22547,22548],{"href":22548,"rel":22549},"https://ui.aceternity.com/components/animated-testimonials",[700],{"title":613,"searchDepth":847,"depth":847,"links":22551},[],"An engaging and animated testimonial component showcasing user feedback with transitions and auto-play functionality.",{},{"title":434,"description":22552},[1067,5952,5954,22556],"testimonial","IcQi_hQBGjgyQlCcJ8iDfTlfYZY9swZioTnV0zgtQ-Q",{"id":22559,"title":438,"badge":687,"body":22560,"category":429,"description":22739,"extension":856,"links":687,"meta":22740,"navigation":859,"path":439,"seo":22741,"stem":440,"tags":22742,"__hash__":22744},"docs_en/en/2.components/testimonials/design-testimonials.md",{"type":689,"value":22561,"toc":22737},[22562],[5728,22563,22568,22721],{":component-files":22564,"component-id":22565,"config":22566,"demo-file":22567},"[\"DesignTestimonials.vue\"]","design-testimonials","DesignTestimonialsConfig","DesignTestimonialsDemo.vue",[3549,22569,22570,22572,22642,22649,22652],{"v-slot:api":613},[882,22571,5856],{"id":5855},[5858,22573,22574,22586],{},[5861,22575,22576],{},[5864,22577,22578,22580,22582,22584],{},[5867,22579,5869],{},[5867,22581,5872],{},[5867,22583,5875],{},[5867,22585,5878],{},[5880,22587,22588,22606,22623],{},[5864,22589,22590,22594,22598,22603],{},[5885,22591,22592],{},[894,22593,4382],{},[5885,22595,22596],{},[894,22597,5894],{},[5885,22599,22600],{},[894,22601,22602],{},"\"Testimonials\"",[5885,22604,22605],{},"Vertical label shown on the left side of the layout.",[5864,22607,22608,22612,22616,22620],{},[5885,22609,22610],{},[894,22611,6933],{},[5885,22613,22614],{},[894,22615,6016],{},[5885,22617,22618],{},[894,22619,12352],{},[5885,22621,22622],{},"Time (in ms) before automatically switching to the next testimonial.",[5864,22624,22625,22629,22634,22639],{},[5885,22626,22627],{},[894,22628,22414],{},[5885,22630,22631],{},[894,22632,22633],{},"TestimonialItem[]",[5885,22635,22636],{},[702,22637,22638],{},"required",[5885,22640,22641],{},"List of testimonial entries to render and animate.",[728,22643,22645,22648],{"id":22644},"testimonialitem-object",[894,22646,22647],{},"TestimonialItem"," Object",[692,22650,22651],{},"Each testimonial must follow this structure:",[5858,22653,22654,22664],{},[5861,22655,22656],{},[5864,22657,22658,22660,22662],{},[5867,22659,19463],{},[5867,22661,5872],{},[5867,22663,5878],{},[5880,22665,22666,22679,22693,22707],{},[5864,22667,22668,22672,22676],{},[5885,22669,22670],{},[894,22671,22488],{},[5885,22673,22674],{},[894,22675,5894],{},[5885,22677,22678],{},"The testimonial text, animated word-by-word.",[5864,22680,22681,22686,22690],{},[5885,22682,22683],{},[894,22684,22685],{},"author",[5885,22687,22688],{},[894,22689,5894],{},[5885,22691,22692],{},"Name of the testimonial author.",[5864,22694,22695,22700,22704],{},[5885,22696,22697],{},[894,22698,22699],{},"role",[5885,22701,22702],{},[894,22703,5894],{},[5885,22705,22706],{},"Role or designation of the author.",[5864,22708,22709,22714,22718],{},[5885,22710,22711],{},[894,22712,22713],{},"company",[5885,22715,22716],{},[894,22717,5894],{},[5885,22719,22720],{},"Company or organization name (used in badge and ticker).",[3549,22722,22723],{"v-slot:credits":613},[751,22724,22725,22730],{},[754,22726,22727,22728],{},"Animation powered by ",[894,22729,1023],{},[754,22731,6969,22732],{},[696,22733,22736],{"href":22734,"rel":22735},"https://21st.dev/community/components/jatin-yadav05/design-testimonial/default",[700],"Design Testimonials by Jatin Yadav",{"title":613,"searchDepth":847,"depth":847,"links":22738},[],"A premium, design-forward testimonial section featuring cinematic typography, magnetic parallax, word-by-word animations, and auto-cycling navigation.",{},{"title":438,"description":22739},[1067,5952,1023,22556,22743],"animation","tBA1nsd34AOFqGgRi9eKzqb1sMqU6Uae7cGCn7GKZcs",{"id":22746,"title":442,"badge":687,"body":22747,"category":429,"description":22835,"extension":856,"links":687,"meta":22836,"navigation":859,"path":443,"seo":22837,"stem":444,"tags":22838,"__hash__":22839},"docs_en/en/2.components/testimonials/testimonial-slider.md",{"type":689,"value":22748,"toc":22833},[22749],[5728,22750,22755],{":component-files":22751,"component-id":22752,"config":22753,"demo-file":22754},"[\"TestimonialSlider.vue\"]","testimonial-slider","TestimonialSliderConfig","TestimonialSliderDemo.vue",[3549,22756,22757,22759],{"v-slot:api":613},[882,22758,5856],{"id":5855},[5858,22760,22761,22773],{},[5861,22762,22763],{},[5864,22764,22765,22767,22769,22771],{},[5867,22766,5869],{},[5867,22768,5872],{},[5867,22770,5875],{},[5867,22772,5878],{},[5880,22774,22775,22793,22816],{},[5864,22776,22777,22781,22786,22790],{},[5885,22778,22779],{},[894,22780,22414],{},[5885,22782,22783],{},[894,22784,22785],{},"Array\u003C{ img: string; quote: string; name: string; role: string }>",[5885,22787,22788],{},[894,22789,3932],{},[5885,22791,22792],{},"Array of testimonial objects displayed by the slider.",[5864,22794,22795,22800,22804,22808],{},[5885,22796,22797],{},[894,22798,22799],{},"autoRotate",[5885,22801,22802],{},[894,22803,5914],{},[5885,22805,22806],{},[894,22807,5919],{},[5885,22809,11338,22810,22812,22813,22815],{},[894,22811,5919],{},", the slider advances automatically every ",[894,22814,6933],{}," seconds.",[5864,22817,22818,22822,22826,22830],{},[5885,22819,22820],{},[894,22821,6933],{},[5885,22823,22824],{},[894,22825,6016],{},[5885,22827,22828],{},[894,22829,9631],{},[5885,22831,22832],{},"Interval in seconds between slides when auto‑rotation is enabled.",{"title":613,"searchDepth":847,"depth":847,"links":22834},[],"A lightweight testimonial slider with image rotation, text transitions, and optional auto‑rotation.",{},{"title":442,"description":22835},[1067,5952,22556],"JKvuhZEuTpIdNp21nGYDFpfvQVhTsclz866tekQ1vOI",{"id":22841,"title":451,"badge":687,"body":22842,"category":23057,"description":23058,"extension":856,"links":687,"meta":23059,"navigation":859,"path":452,"seo":23060,"stem":453,"tags":23061,"__hash__":23063},"docs_en/en/2.components/text-animations/3d-text.md",{"type":689,"value":22843,"toc":23055},[22844],[5728,22845,22850],{":component-files":22846,"component-id":22847,"config":22848,"demo-file":22849},"[\"Text3d.vue\"]","text-3d","Text3dConfig","Text3dDemo.vue",[3549,22851,22852,22854],{"v-slot:api":613},[882,22853,5856],{"id":5855},[5858,22855,22856,22868],{},[5861,22857,22858],{},[5864,22859,22860,22862,22864,22866],{},[5867,22861,5869],{},[5867,22863,5872],{},[5867,22865,5875],{},[5867,22867,5878],{},[5880,22869,22870,22889,22912,22929,22948,22966,22984,23002,23018,23037],{},[5864,22871,22872,22877,22881,22886],{},[5885,22873,22874],{},[894,22875,22876],{},"textColor",[5885,22878,22879],{},[894,22880,5894],{},[5885,22882,22883],{},[894,22884,22885],{},"\"white\"",[5885,22887,22888],{},"Color of the main text.",[5864,22890,22891,22896,22900,22905],{},[5885,22892,22893],{},[894,22894,22895],{},"letterSpacing",[5885,22897,22898],{},[894,22899,6016],{},[5885,22901,22902],{},[894,22903,22904],{},"-0.1",[5885,22906,22907,22908,22911],{},"Adjusts the spacing between letters in ",[894,22909,22910],{},"ch"," units.",[5864,22913,22914,22918,22922,22926],{},[5885,22915,22916],{},[894,22917,5992],{},[5885,22919,22920],{},[894,22921,5894],{},[5885,22923,22924],{},[894,22925,9848],{},[5885,22927,22928],{},"Color of the text stroke.",[5864,22930,22931,22936,22940,22945],{},[5885,22932,22933],{},[894,22934,22935],{},"shadowColor",[5885,22937,22938],{},[894,22939,5894],{},[5885,22941,22942],{},[894,22943,22944],{},"\"yellow\"",[5885,22946,22947],{},"Color of the text shadow.",[5864,22949,22950,22955,22959,22963],{},[5885,22951,22952],{},[894,22953,22954],{},"strokeSize",[5885,22956,22957],{},[894,22958,6016],{},[5885,22960,22961],{},[894,22962,12032],{},[5885,22964,22965],{},"Thickness of the text stroke in pixels.",[5864,22967,22968,22973,22977,22981],{},[5885,22969,22970],{},[894,22971,22972],{},"shadow1Size",[5885,22974,22975],{},[894,22976,6016],{},[5885,22978,22979],{},[894,22980,7804],{},[5885,22982,22983],{},"Size of the first shadow layer in pixels.",[5864,22985,22986,22991,22995,22999],{},[5885,22987,22988],{},[894,22989,22990],{},"shadow2Size",[5885,22992,22993],{},[894,22994,6016],{},[5885,22996,22997],{},[894,22998,8850],{},[5885,23000,23001],{},"Size of the second shadow layer in pixels.",[5864,23003,23004,23008,23012,23016],{},[5885,23005,23006],{},[894,23007,5889],{},[5885,23009,23010],{},[894,23011,5894],{},[5885,23013,23014],{},[894,23015,6077],{},[5885,23017,6962],{},[5864,23019,23020,23024,23028,23032],{},[5885,23021,23022],{},[894,23023,7437],{},[5885,23025,23026],{},[894,23027,5914],{},[5885,23029,23030],{},[894,23031,5919],{},[5885,23033,23034,23035,880],{},"Enables wiggle animation when set to ",[894,23036,5919],{},[5864,23038,23039,23044,23048,23052],{},[5885,23040,23041],{},[894,23042,23043],{},"animationDuration",[5885,23045,23046],{},[894,23047,6016],{},[5885,23049,23050],{},[894,23051,18016],{},[5885,23053,23054],{},"Duration of the wiggle animation in milliseconds.",{"title":613,"searchDepth":847,"depth":847,"links":23056},[],"Text Animation","A stylish 3D text component with customizable colors, shadows, and animation options.",{},{"title":451,"description":23058},[1067,5952,23062],"3d","8aJuDakTJ9b7Q2i_h3eAi2m5oiVIaL8Qucq3sFPLqXw",{"id":23065,"title":455,"badge":687,"body":23066,"category":23057,"description":23176,"extension":856,"links":687,"meta":23177,"navigation":859,"path":456,"seo":23178,"stem":457,"tags":23179,"__hash__":23180},"docs_en/en/2.components/text-animations/blur-reveal.md",{"type":689,"value":23067,"toc":23174},[23068],[5728,23069,23074,23164],{":component-files":23070,"component-id":23071,"config":23072,"demo-file":23073},"[\"BlurReveal.vue\"]","blur-reveal","BlurRevealConfig","BlurRevealDemo.vue",[3549,23075,23076,23078],{"v-slot:api":613},[882,23077,5856],{"id":5855},[5858,23079,23080,23092],{},[5861,23081,23082],{},[5864,23083,23084,23086,23088,23090],{},[5867,23085,5869],{},[5867,23087,5872],{},[5867,23089,5875],{},[5867,23091,5878],{},[5880,23093,23094,23111,23128,23146],{},[5864,23095,23096,23100,23104,23108],{},[5885,23097,23098],{},[894,23099,6933],{},[5885,23101,23102],{},[894,23103,6016],{},[5885,23105,23106],{},[894,23107,1758],{},[5885,23109,23110],{},"Duration of the blur fade in animation.",[5864,23112,23113,23117,23121,23125],{},[5885,23114,23115],{},[894,23116,6914],{},[5885,23118,23119],{},[894,23120,6016],{},[5885,23122,23123],{},[894,23124,1758],{},[5885,23126,23127],{},"Delay between child components to reveal",[5864,23129,23130,23134,23138,23143],{},[5885,23131,23132],{},[894,23133,6148],{},[5885,23135,23136],{},[894,23137,5894],{},[5885,23139,23140],{},[894,23141,23142],{},"10px",[5885,23144,23145],{},"Amount of blur to apply to the child components.",[5864,23147,23148,23153,23157,23161],{},[5885,23149,23150],{},[894,23151,23152],{},"yOffset",[5885,23154,23155],{},[894,23156,6016],{},[5885,23158,23159],{},[894,23160,12032],{},[5885,23162,23163],{},"Specifies the vertical offset distance (yOffset) for the entrance animation.",[3549,23165,23166],{"v-slot:credits":613},[751,23167,23168],{},[754,23169,5929,23170,7387],{},[696,23171,725],{"href":23172,"rel":23173},"https://magicui.design/docs/components/blur-fade",[700],{"title":613,"searchDepth":847,"depth":847,"links":23175},[],"A component to smoothly blur fade in content.",{},{"title":455,"description":23176},[1067,5952,6732],"9D50WQXngnt3Iz7agMRePMI_4CSCqA3Mn4OEL0j45ho",{"id":23182,"title":459,"badge":687,"body":23183,"category":23057,"description":23292,"extension":856,"links":687,"meta":23293,"navigation":859,"path":460,"seo":23294,"stem":461,"tags":23295,"__hash__":23296},"docs_en/en/2.components/text-animations/box-reveal.md",{"type":689,"value":23184,"toc":23290},[23185],[5728,23186,23191,23279],{":component-files":23187,"component-id":23188,"config":23189,"demo-file":23190},"[\"BoxReveal.vue\"]","box-reveal","BoxRevealConfig","BoxRevealDemo.vue",[3549,23192,23193,23195],{"v-slot:api":613},[882,23194,5856],{"id":5855},[5858,23196,23197,23209],{},[5861,23198,23199],{},[5864,23200,23201,23203,23205,23207],{},[5867,23202,5869],{},[5867,23204,5872],{},[5867,23206,5875],{},[5867,23208,5878],{},[5880,23210,23211,23229,23246,23263],{},[5864,23212,23213,23217,23221,23226],{},[5885,23214,23215],{},[894,23216,6485],{},[5885,23218,23219],{},[894,23220,5894],{},[5885,23222,23223],{},[894,23224,23225],{},"\"#5046e6\"",[5885,23227,23228],{},"Background color of the reveal box.",[5864,23230,23231,23235,23239,23243],{},[5885,23232,23233],{},[894,23234,6933],{},[5885,23236,23237],{},[894,23238,6016],{},[5885,23240,23241],{},[894,23242,6923],{},[5885,23244,23245],{},"Duration of the reveal animation in seconds.",[5864,23247,23248,23252,23256,23260],{},[5885,23249,23250],{},[894,23251,6914],{},[5885,23253,23254],{},[894,23255,6016],{},[5885,23257,23258],{},[894,23259,12689],{},[5885,23261,23262],{},"Delay before the reveal animation starts in seconds.",[5864,23264,23265,23269,23273,23277],{},[5885,23266,23267],{},[894,23268,5889],{},[5885,23270,23271],{},[894,23272,5894],{},[5885,23274,23275],{},[894,23276,6077],{},[5885,23278,6962],{},[3549,23280,23281],{"v-slot:credits":613},[751,23282,23283],{},[754,23284,6969,23285,880],{},[696,23286,23289],{"href":23287,"rel":23288},"https://magicui.design/docs/components/box-reveal",[700],"Magic UI Box Reveal",{"title":613,"searchDepth":847,"depth":847,"links":23291},[],"An animated box reveal effect with customizable colors, duration, and delay.",{},{"title":459,"description":23292},[1067,5952,6732],"cJD4tuNa8H_41KoDLAK7do4lv_kCjcO4hUvglL0GW_g",{"id":23298,"title":463,"badge":687,"body":23299,"category":23057,"description":23416,"extension":856,"links":687,"meta":23417,"navigation":859,"path":464,"seo":23418,"stem":465,"tags":23419,"__hash__":23420},"docs_en/en/2.components/text-animations/colorful-text.md",{"type":689,"value":23300,"toc":23414},[23301],[5728,23302,23307,23398],{":component-files":23303,"component-id":23304,"config":23305,"demo-file":23306},"[\"ColourfulText.vue\"]","colourful-text","ColourfulTextConfig","ColourfulTextDemo.vue",[3549,23308,23309,23311],{"v-slot:api":613},[882,23310,5856],{"id":5855},[5858,23312,23313,23325],{},[5861,23314,23315],{},[5864,23316,23317,23319,23321,23323],{},[5867,23318,5869],{},[5867,23320,5872],{},[5867,23322,5875],{},[5867,23324,5878],{},[5880,23326,23327,23344,23362,23381],{},[5864,23328,23329,23333,23337,23341],{},[5885,23330,23331],{},[894,23332,10142],{},[5885,23334,23335],{},[894,23336,5894],{},[5885,23338,23339],{},[894,23340,9848],{},[5885,23342,23343],{},"The text string to be rendered with colorful animated characters. Each character will be individually animated with color transitions and motion effects.",[5864,23345,23346,23350,23354,23359],{},[5885,23347,23348],{},[894,23349,9801],{},[5885,23351,23352],{},[894,23353,9806],{},[5885,23355,23356],{},[894,23357,23358],{},"[ \"rgb(131, 179, 32)\", \"rgb(47, 195, 106)\", \"rgb(42, 169, 210)\", \"rgb(4, 112, 202)\", \"rgb(107, 10, 255)\", \"rgb(183, 0, 218)\", \"rgb(218, 0, 171)\", \"rgb(230, 64, 92)\", \"rgb(232, 98, 63)\", \"rgb(249, 129, 47)\", ]",[5885,23360,23361],{},"The text use colors.",[5864,23363,23364,23369,23373,23378],{},[5885,23365,23366],{},[894,23367,23368],{},"startColor",[5885,23370,23371],{},[894,23372,5894],{},[5885,23374,23375],{},[894,23376,23377],{},"\"rgb(255,255,255)\"",[5885,23379,23380],{},"The char start color.",[5864,23382,23383,23387,23391,23395],{},[5885,23384,23385],{},[894,23386,6933],{},[5885,23388,23389],{},[894,23390,6016],{},[5885,23392,23393],{},[894,23394,9631],{},[5885,23396,23397],{},"The animation duration time in seconds.",[3549,23399,23400],{"v-slot:credits":613},[751,23401,23402,23407],{},[754,23403,5929,23404,6725],{},[696,23405,8882],{"href":8880,"rel":23406},[700],[754,23408,6969,23409],{},[696,23410,23413],{"href":23411,"rel":23412},"https://ui.aceternity.com/components/colourful-text",[700],"Aceternity UI Colourful Text",{"title":613,"searchDepth":847,"depth":847,"links":23415},[],"A text component with various colours, filter and scale effects.",{},{"title":463,"description":23416},[1067,5952,5954],"BfbmHlz8uXo13NzMtCXTqHgLSZTTIwgCK8h73-iPr_c",{"id":23422,"title":467,"badge":687,"body":23423,"category":23057,"description":23556,"extension":856,"links":687,"meta":23557,"navigation":859,"path":468,"seo":23558,"stem":469,"tags":23559,"__hash__":23560},"docs_en/en/2.components/text-animations/container-text-flip.md",{"type":689,"value":23424,"toc":23554},[23425],[5728,23426,23431,23538],{":component-files":23427,"component-id":23428,"config":23429,"demo-file":23430},"[\"ContainerTextFlip.vue\"]","container-text-flip","ContainerTextFlipConfig","ContainerTextFlipDemo.vue",[3549,23432,23433,23435],{"v-slot:api":613},[882,23434,5856],{"id":5855},[5858,23436,23437,23449],{},[5861,23438,23439],{},[5864,23440,23441,23443,23445,23447],{},[5867,23442,5869],{},[5867,23444,5872],{},[5867,23446,5875],{},[5867,23448,5878],{},[5880,23450,23451,23470,23489,23506,23522],{},[5864,23452,23453,23458,23462,23467],{},[5885,23454,23455],{},[894,23456,23457],{},"words",[5885,23459,23460],{},[894,23461,9806],{},[5885,23463,23464],{},[894,23465,23466],{},"[\"better\", \"modern\", \"beautiful\", \"awesome\"]",[5885,23468,23469],{},"Array of words to cycle through in the animation",[5864,23471,23472,23477,23481,23486],{},[5885,23473,23474],{},[894,23475,23476],{},"interval",[5885,23478,23479],{},[894,23480,6016],{},[5885,23482,23483],{},[894,23484,23485],{},"3000",[5885,23487,23488],{},"Time in milliseconds between word transitions",[5864,23490,23491,23495,23499,23503],{},[5885,23492,23493],{},[894,23494,23043],{},[5885,23496,23497],{},[894,23498,6016],{},[5885,23500,23501],{},[894,23502,9394],{},[5885,23504,23505],{},"Duration of the transition animation in milliseconds",[5864,23507,23508,23512,23516,23519],{},[5885,23509,23510],{},[894,23511,5889],{},[5885,23513,23514],{},[894,23515,5894],{},[5885,23517,23518],{},"``",[5885,23520,23521],{},"Additional CSS classes to apply to the container",[5864,23523,23524,23529,23533,23535],{},[5885,23525,23526],{},[894,23527,23528],{},"textClass",[5885,23530,23531],{},[894,23532,5894],{},[5885,23534,23518],{},[5885,23536,23537],{},"Additional CSS classes to apply to the text",[3549,23539,23540],{"v-slot:credits":613},[751,23541,23542,23547],{},[754,23543,5929,23544,6725],{},[696,23545,8882],{"href":8880,"rel":23546},[700],[754,23548,6969,23549,880],{},[696,23550,23553],{"href":23551,"rel":23552},"https://ui.aceternity.com/components/container-text-flip",[700],"Aceternity UI Container Text Flip",{"title":613,"searchDepth":847,"depth":847,"links":23555},[],"A container that flips through words, animating the width.",{},{"title":467,"description":23556},[1067,5952,5954],"u_OjzlgqpPqK1SM5FmTWyOyByayoIJXjrCJ1fg8wyc8",{"id":23562,"title":471,"badge":687,"body":23563,"category":23057,"description":23733,"extension":856,"links":687,"meta":23734,"navigation":859,"path":472,"seo":23735,"stem":473,"tags":23736,"__hash__":23738},"docs_en/en/2.components/text-animations/encrypted-text.md",{"type":689,"value":23564,"toc":23731},[23565],[5728,23566,23571,23716],{":component-files":23567,"component-id":23568,"config":23569,"demo-file":23570},"[\"EncryptedText.vue\"]","encrypted-text","EncryptedTextConfig","EncryptedTextDemo.vue",[3549,23572,23573,23575],{"v-slot:api":613},[882,23574,5856],{"id":5855},[5858,23576,23577,23589],{},[5861,23578,23579],{},[5864,23580,23581,23583,23585,23587],{},[5867,23582,5869],{},[5867,23584,5872],{},[5867,23586,5875],{},[5867,23588,5878],{},[5880,23590,23591,23608,23625,23643,23661,23680,23698],{},[5864,23592,23593,23597,23601,23605],{},[5885,23594,23595],{},[894,23596,10142],{},[5885,23598,23599],{},[894,23600,5894],{},[5885,23602,23603],{},[702,23604,22638],{},[5885,23606,23607],{},"The text to render and reveal.",[5864,23609,23610,23614,23618,23622],{},[5885,23611,23612],{},[894,23613,5889],{},[5885,23615,23616],{},[894,23617,5894],{},[5885,23619,23620],{},[894,23621,6077],{},[5885,23623,23624],{},"Base class applied to the wrapper element.",[5864,23626,23627,23632,23636,23640],{},[5885,23628,23629],{},[894,23630,23631],{},"revealDelayMs",[5885,23633,23634],{},[894,23635,6016],{},[5885,23637,23638],{},[894,23639,6021],{},[5885,23641,23642],{},"Delay (in ms) between revealing each next character.",[5864,23644,23645,23650,23654,23658],{},[5885,23646,23647],{},[894,23648,23649],{},"flipDelayMs",[5885,23651,23652],{},[894,23653,6016],{},[5885,23655,23656],{},[894,23657,6021],{},[5885,23659,23660],{},"Delay (in ms) between re-scrambling unrevealed characters.",[5864,23662,23663,23668,23672,23677],{},[5885,23664,23665],{},[894,23666,23667],{},"charset",[5885,23669,23670],{},[894,23671,5894],{},[5885,23673,23674],{},[894,23675,23676],{},"A–Z a–z 0–9 !@#$%^&*()_+-={}[];:,.\u003C>/?",[5885,23678,23679],{},"Character set used for the scrambled glyphs.",[5864,23681,23682,23687,23691,23695],{},[5885,23683,23684],{},[894,23685,23686],{},"encryptedClass",[5885,23688,23689],{},[894,23690,5894],{},[5885,23692,23693],{},[894,23694,6077],{},[5885,23696,23697],{},"Class applied to characters while still encrypted/scrambled.",[5864,23699,23700,23705,23709,23713],{},[5885,23701,23702],{},[894,23703,23704],{},"revealedClass",[5885,23706,23707],{},[894,23708,5894],{},[5885,23710,23711],{},[894,23712,6077],{},[5885,23714,23715],{},"Class applied to characters once revealed.",[3549,23717,23718],{"v-slot:credits":613},[751,23719,23720,23727],{},[754,23721,6969,23722,880],{},[696,23723,23726],{"href":23724,"rel":23725},"https://ui.aceternity.com/components/encrypted-text",[700],"Aceternity UI Encrypted Text",[754,23728,22727,23729,880],{},[894,23730,1023],{},{"title":613,"searchDepth":847,"depth":847,"links":23732},[],"A text reveal effect that starts as scrambled characters and progressively decrypts into the final message when it enters the viewport.",{},{"title":471,"description":23733},[1067,5952,1023,23737,22743,10142],"typography","TtdWqi_IOZysFtwJfflm3g7VFRmU23OWKSrhXcffQoA",{"id":23740,"title":475,"badge":687,"body":23741,"category":23057,"description":23825,"extension":856,"links":687,"meta":23826,"navigation":859,"path":476,"seo":23827,"stem":477,"tags":23828,"__hash__":23829},"docs_en/en/2.components/text-animations/flip-words.md",{"type":689,"value":23742,"toc":23823},[23743],[5728,23744,23749,23807],{":component-files":23745,"component-id":23746,"config":23747,"demo-file":23748},"[\"FlipWords.vue\"]","flip-words","FlipWordsConfig","FlipWordsDemo.vue",[3549,23750,23751,23753],{"v-slot:api":613},[882,23752,5856],{"id":5855},[5858,23754,23755,23765],{},[5861,23756,23757],{},[5864,23758,23759,23761,23763],{},[5867,23760,5869],{},[5867,23762,5872],{},[5867,23764,5878],{},[5880,23766,23767,23781,23794],{},[5864,23768,23769,23773,23778],{},[5885,23770,23771],{},[894,23772,23457],{},[5885,23774,23775],{},[894,23776,23777],{},"Array",[5885,23779,23780],{},"An array of words to be displayed and animated.",[5864,23782,23783,23787,23791],{},[5885,23784,23785],{},[894,23786,6933],{},[5885,23788,23789],{},[894,23790,6016],{},[5885,23792,23793],{},"Duration (in milliseconds) for each word to be displayed before flipping to the next word.",[5864,23795,23796,23800,23804],{},[5885,23797,23798],{},[894,23799,5889],{},[5885,23801,23802],{},[894,23803,5894],{},[5885,23805,23806],{},"Additional CSS classes to apply to the component.",[3549,23808,23809],{"v-slot:credits":613},[751,23810,23811,23816],{},[754,23812,5929,23813,5941],{},[696,23814,8458],{"href":8456,"rel":23815},[700],[754,23817,6969,23818],{},[696,23819,23822],{"href":23820,"rel":23821},"https://ui.aceternity.com/components/flip-words",[700],"Aceternity UI's Flip Words",{"title":613,"searchDepth":847,"depth":847,"links":23824},[],"A component that flips through a list of words.",{},{"title":475,"description":23825},[1067,5952,5954],"IJbp12ljPLlhz6pTvzQtBaK43Pd40KLvAkfS188VuoI",{"id":23831,"title":479,"badge":687,"body":23832,"category":23057,"description":23982,"extension":856,"links":687,"meta":23983,"navigation":859,"path":480,"seo":23984,"stem":481,"tags":23985,"__hash__":23987},"docs_en/en/2.components/text-animations/focus.md",{"type":689,"value":23833,"toc":23980},[23834],[5728,23835,23840,23969],{":component-files":23836,"component-id":23837,"config":23838,"demo-file":23839},"[\"Focus.vue\"]","focus","FocusConfig","FocusDemo.vue",[3549,23841,23842,23844],{"v-slot:api":613},[882,23843,5856],{"id":5855},[5858,23845,23846,23858],{},[5861,23847,23848],{},[5864,23849,23850,23852,23854,23856],{},[5867,23851,5869],{},[5867,23853,5872],{},[5867,23855,5875],{},[5867,23857,5878],{},[5880,23859,23860,23879,23897,23915,23934,23951],{},[5864,23861,23862,23867,23871,23876],{},[5885,23863,23864],{},[894,23865,23866],{},"sentence",[5885,23868,23869],{},[894,23870,5894],{},[5885,23872,23873],{},[894,23874,23875],{},"\"Inspira Focus\"",[5885,23877,23878],{},"Text sentence to display and animate word-by-word.",[5864,23880,23881,23886,23890,23894],{},[5885,23882,23883],{},[894,23884,23885],{},"manualMode",[5885,23887,23888],{},[894,23889,5914],{},[5885,23891,23892],{},[894,23893,7446],{},[5885,23895,23896],{},"If true, focus highlights on hover; otherwise auto-cycles.",[5864,23898,23899,23904,23908,23912],{},[5885,23900,23901],{},[894,23902,23903],{},"blurAmount",[5885,23905,23906],{},[894,23907,6016],{},[5885,23909,23910],{},[894,23911,9631],{},[5885,23913,23914],{},"Blur radius in pixels for inactive words.",[5864,23916,23917,23922,23926,23931],{},[5885,23918,23919],{},[894,23920,23921],{},"borderColor",[5885,23923,23924],{},[894,23925,5894],{},[5885,23927,23928],{},[894,23929,23930],{},"\"green\"",[5885,23932,23933],{},"Color of the animated focus frame border.",[5864,23935,23936,23940,23944,23948],{},[5885,23937,23938],{},[894,23939,23043],{},[5885,23941,23942],{},[894,23943,6016],{},[5885,23945,23946],{},[894,23947,6923],{},[5885,23949,23950],{},"Duration in seconds for the focus frame animation transitions.",[5864,23952,23953,23958,23962,23966],{},[5885,23954,23955],{},[894,23956,23957],{},"pauseBetweenAnimations",[5885,23959,23960],{},[894,23961,6016],{},[5885,23963,23964],{},[894,23965,1758],{},[5885,23967,23968],{},"Pause duration in seconds between auto-focus transitions.",[3549,23970,23971],{"v-slot:credits":613},[751,23972,23973],{},[754,23974,6176,23975,880],{},[696,23976,23979],{"href":23977,"rel":23978},"https://codepen.io/CameronFitzwilliam/pen/JJRjMa",[700],"Focus Text Hover Effect on CodePen",{"title":613,"searchDepth":847,"depth":847,"links":23981},[],"Highlight words in a sentence with a dynamic blurred effect and animated focus frame. Supports auto-cycling or manual hover focus mode.",{},{"title":479,"description":23982},[1067,5952,23986],"codepen","3kpA3_sEA82eHp8YfTSAAjvqwD5x095q4DQ-CIUWqWs",{"id":23989,"title":483,"badge":687,"body":23990,"category":23057,"description":24104,"extension":856,"links":687,"meta":24105,"navigation":859,"path":484,"seo":24106,"stem":485,"tags":24107,"__hash__":24108},"docs_en/en/2.components/text-animations/hyper-text.md",{"type":689,"value":23991,"toc":24102},[23992],[5728,23993,23998,24084],{":component-files":23994,"component-id":23995,"config":23996,"demo-file":23997},"[\"HyperText.vue\"]","hyper-text","HyperTextConfig","HyperTextDemo.vue",[3549,23999,24000,24002],{"v-slot:api":613},[882,24001,5856],{"id":5855},[5858,24003,24004,24016],{},[5861,24005,24006],{},[5864,24007,24008,24010,24012,24014],{},[5867,24009,5869],{},[5867,24011,5872],{},[5867,24013,5875],{},[5867,24015,5878],{},[5880,24017,24018,24034,24049,24066],{},[5864,24019,24020,24024,24028,24032],{},[5885,24021,24022],{},[894,24023,5889],{},[5885,24025,24026],{},[894,24027,5894],{},[5885,24029,24030],{},[894,24031,6077],{},[5885,24033,23806],{},[5864,24035,24036,24040,24044,24046],{},[5885,24037,24038],{},[894,24039,10142],{},[5885,24041,24042],{},[894,24043,5894],{},[5885,24045,9105],{},[5885,24047,24048],{},"Text to animate",[5864,24050,24051,24055,24059,24063],{},[5885,24052,24053],{},[894,24054,6933],{},[5885,24056,24057],{},[894,24058,6016],{},[5885,24060,24061],{},[894,24062,6942],{},[5885,24064,24065],{},"The total duration (in seconds) for the entire animation.",[5864,24067,24068,24073,24077,24081],{},[5885,24069,24070],{},[894,24071,24072],{},"animateOnLoad",[5885,24074,24075],{},[894,24076,5914],{},[5885,24078,24079],{},[894,24080,5919],{},[5885,24082,24083],{},"Play animation on load",[3549,24085,24086],{"v-slot:credits":613},[751,24087,24088,24095],{},[754,24089,6857,24090,7616],{},[696,24091,24094],{"href":24092,"rel":24093},"https://magicui.design/docs/components/hyper-text",[700],"Magic UI's Hyper Text",[754,24096,5929,24097,5941],{},[696,24098,24101],{"href":24099,"rel":24100},"https://github.com/premdasvm",[700],"Prem",{"title":613,"searchDepth":847,"depth":847,"links":24103},[],"A hyper changing text animation as you hover..",{},{"title":483,"description":24104},[1067,5952,6732],"zf7Z8g95G8e3mAihsv6TEGTKt6KXgWMiIMhMaBtpxd8",{"id":24110,"title":487,"badge":687,"body":24111,"category":23057,"description":24207,"extension":856,"links":687,"meta":24208,"navigation":859,"path":488,"seo":24209,"stem":489,"tags":24210,"__hash__":24211},"docs_en/en/2.components/text-animations/letter-pullup.md",{"type":689,"value":24112,"toc":24205},[24113],[5728,24114,24119,24190],{":component-files":24115,"component-id":24116,"config":24117,"demo-file":24118},"[\"LetterPullup.vue\"]","letter-pullup","LetterPullupConfig","LetterPullupDemo.vue",[3549,24120,24121,24123],{"v-slot:api":613},[882,24122,5856],{"id":5855},[5858,24124,24125,24137],{},[5861,24126,24127],{},[5864,24128,24129,24131,24133,24135],{},[5867,24130,5869],{},[5867,24132,5872],{},[5867,24134,5875],{},[5867,24136,5878],{},[5880,24138,24139,24155,24173],{},[5864,24140,24141,24145,24149,24153],{},[5885,24142,24143],{},[894,24144,5889],{},[5885,24146,24147],{},[894,24148,5894],{},[5885,24150,24151],{},[894,24152,5899],{},[5885,24154,11899],{},[5864,24156,24157,24161,24165,24170],{},[5885,24158,24159],{},[894,24160,23457],{},[5885,24162,24163],{},[894,24164,5894],{},[5885,24166,24167],{},[894,24168,24169],{},"Staggered Letter Pull Up",[5885,24171,24172],{},"Text to animate.",[5864,24174,24175,24179,24183,24187],{},[5885,24176,24177],{},[894,24178,6914],{},[5885,24180,24181],{},[894,24182,6016],{},[5885,24184,24185],{},[894,24186,8518],{},[5885,24188,24189],{},"Delay each letter's animation by this many seconds",[3549,24191,24192],{"v-slot:credits":613},[751,24193,24194,24199],{},[754,24195,5929,24196,6725],{},[696,24197,5940],{"href":5938,"rel":24198},[700],[754,24200,6176,24201,880],{},[696,24202,725],{"href":24203,"rel":24204},"https://magicui.design/docs/components/letter-pullup",[700],{"title":613,"searchDepth":847,"depth":847,"links":24206},[],"Staggered letter pull up text animation.",{},{"title":487,"description":24207},[1067,5952,6732],"L5EU1biypEzFS1o8BpLTyx4sMxKa6feTMszXTdKIAGM",{"id":24213,"title":491,"badge":687,"body":24214,"category":23057,"description":24311,"extension":856,"links":687,"meta":24312,"navigation":859,"path":492,"seo":24313,"stem":493,"tags":24314,"__hash__":24315},"docs_en/en/2.components/text-animations/line-shadow-text.md",{"type":689,"value":24215,"toc":24309},[24216],[5728,24217,24222,24293],{":component-files":24218,"component-id":24219,"config":24220,"demo-file":24221},"[\"LineShadowText.vue\"]","line-shadow-text","LineShadowTextConfig","LineShadowTextDemo.vue",[3549,24223,24224,24226],{"v-slot:api":613},[882,24225,5856],{"id":5855},[5858,24227,24228,24240],{},[5861,24229,24230],{},[5864,24231,24232,24234,24236,24238],{},[5867,24233,5869],{},[5867,24235,5872],{},[5867,24237,5875],{},[5867,24239,5878],{},[5880,24241,24242,24259,24275],{},[5864,24243,24244,24248,24252,24256],{},[5885,24245,24246],{},[894,24247,22935],{},[5885,24249,24250],{},[894,24251,5894],{},[5885,24253,24254],{},[894,24255,9848],{},[5885,24257,24258],{},"The color of the shadow effect",[5864,24260,24261,24265,24269,24273],{},[5885,24262,24263],{},[894,24264,5889],{},[5885,24266,24267],{},[894,24268,5894],{},[5885,24270,24271],{},[894,24272,6077],{},[5885,24274,6962],{},[5864,24276,24277,24281,24285,24290],{},[5885,24278,24279],{},[894,24280,10758],{},[5885,24282,24283],{},[894,24284,5894],{},[5885,24286,24287],{},[894,24288,24289],{},"\"span\"",[5885,24291,24292],{},"The HTML element to render the text as.",[3549,24294,24295],{"v-slot:credits":613},[751,24296,24297,24302],{},[754,24298,5929,24299,6725],{},[696,24300,5940],{"href":5938,"rel":24301},[700],[754,24303,6969,24304],{},[696,24305,24308],{"href":24306,"rel":24307},"https://magicui.design/docs/components/line-shadow-text",[700],"Magic UI's Line Shadow Text",{"title":613,"searchDepth":847,"depth":847,"links":24310},[],"A line shadow text component for Magic UI that adds a shadow effect to the text, making it visually appealing and engaging.",{},{"title":491,"description":24311},[1067,5952,6732],"bAVciudIygZdRCdo06-cnxXgHvpMWnHOnsX3eXM3gDk",{"id":24317,"title":495,"badge":687,"body":24318,"category":23057,"description":24434,"extension":856,"links":687,"meta":24435,"navigation":859,"path":496,"seo":24436,"stem":497,"tags":24437,"__hash__":24438},"docs_en/en/2.components/text-animations/morphing-text.md",{"type":689,"value":24319,"toc":24432},[24320],[5728,24321,24326,24416],{":component-files":24322,"component-id":24323,"config":24324,"demo-file":24325},"[\"MorphingText.vue\"]","morphing-text","MorphingTextConfig","MorphingTextDemo.vue",[3549,24327,24328,24330],{"v-slot:api":613},[882,24329,5856],{"id":5855},[5858,24331,24332,24344],{},[5861,24333,24334],{},[5864,24335,24336,24338,24340,24342],{},[5867,24337,5869],{},[5867,24339,5872],{},[5867,24341,5875],{},[5867,24343,5878],{},[5880,24345,24346,24364,24380,24398],{},[5864,24347,24348,24353,24357,24361],{},[5885,24349,24350],{},[894,24351,24352],{},"texts",[5885,24354,24355],{},[894,24356,9806],{},[5885,24358,24359],{},[894,24360,3932],{},[5885,24362,24363],{},"Array of texts to morph between.",[5864,24365,24366,24370,24374,24378],{},[5885,24367,24368],{},[894,24369,5889],{},[5885,24371,24372],{},[894,24373,5894],{},[5885,24375,24376],{},[894,24377,6077],{},[5885,24379,9125],{},[5864,24381,24382,24387,24391,24395],{},[5885,24383,24384],{},[894,24385,24386],{},"morphTime",[5885,24388,24389],{},[894,24390,6016],{},[5885,24392,24393],{},[894,24394,9469],{},[5885,24396,24397],{},"Animation execution time.",[5864,24399,24400,24405,24409,24413],{},[5885,24401,24402],{},[894,24403,24404],{},"coolDownTime",[5885,24406,24407],{},[894,24408,6016],{},[5885,24410,24411],{},[894,24412,6923],{},[5885,24414,24415],{},"Animation dwell time.",[3549,24417,24418],{"v-slot:credits":613},[751,24419,24420,24425],{},[754,24421,5929,24422,6725],{},[696,24423,8882],{"href":8880,"rel":24424},[700],[754,24426,6435,24427,880],{},[696,24428,24431],{"href":24429,"rel":24430},"https://magicui.design/docs/components/morphing-text",[700],"Magic UI Morphing Text",{"title":613,"searchDepth":847,"depth":847,"links":24433},[],"This MorphingText component dynamically transitions between an array of text strings, creating a smooth, engaging visual effect.",{},{"title":495,"description":24434},[1067,5952,6732],"Fxdt0i4lK6vwkG--gz1YxOxuCjSjmfLa4AocUfnY8a0",{"id":24440,"title":499,"badge":687,"body":24441,"category":23057,"description":24599,"extension":856,"links":687,"meta":24600,"navigation":859,"path":500,"seo":24601,"stem":501,"tags":24602,"__hash__":24603},"docs_en/en/2.components/text-animations/number-ticker.md",{"type":689,"value":24442,"toc":24597},[24443],[5728,24444,24449,24581],{":component-files":24445,"component-id":24446,"config":24447,"demo-file":24448},"[\"NumberTicker.vue\"]","number-ticker","NumberTickerConfig","NumberTickerDemo.vue",[3549,24450,24451,24453],{"v-slot:api":613},[882,24452,5856],{"id":5855},[5858,24454,24455,24467],{},[5861,24456,24457],{},[5864,24458,24459,24461,24463,24465],{},[5867,24460,5869],{},[5867,24462,5872],{},[5867,24464,5875],{},[5867,24466,5878],{},[5880,24468,24469,24487,24506,24524,24541,24558],{},[5864,24470,24471,24475,24480,24484],{},[5885,24472,24473],{},[894,24474,13656],{},[5885,24476,24477],{},[894,24478,24479],{},"int",[5885,24481,24482],{},[894,24483,6157],{},[5885,24485,24486],{},"Value to count to",[5864,24488,24489,24493,24498,24503],{},[5885,24490,24491],{},[894,24492,7459],{},[5885,24494,24495],{},[894,24496,24497],{},"up | down",[5885,24499,24500],{},[894,24501,24502],{},"up",[5885,24504,24505],{},"Direction to count in",[5864,24507,24508,24513,24517,24521],{},[5885,24509,24510],{},[894,24511,24512],{},"decimalPlaces",[5885,24514,24515],{},[894,24516,6016],{},[5885,24518,24519],{},[894,24520,6157],{},[5885,24522,24523],{},"Number of decimal places to show",[5864,24525,24526,24530,24534,24538],{},[5885,24527,24528],{},[894,24529,6914],{},[5885,24531,24532],{},[894,24533,6016],{},[5885,24535,24536],{},[894,24537,6157],{},[5885,24539,24540],{},"Delay before counting (in milliseconds)",[5864,24542,24543,24547,24551,24555],{},[5885,24544,24545],{},[894,24546,6933],{},[5885,24548,24549],{},[894,24550,6016],{},[5885,24552,24553],{},[894,24554,15942],{},[5885,24556,24557],{},"Total duration for the entire animation (in milliseconds).",[5864,24559,24560,24564,24569,24574],{},[5885,24561,24562],{},[894,24563,8545],{},[5885,24565,24566],{},[894,24567,24568],{},"TransitionPresets",[5885,24570,24571],{},[894,24572,24573],{},"easeOutCubic",[5885,24575,24576,24577,3796],{},"Name of transition preset (",[696,24578,24579],{"href":24579,"rel":24580},"https://vueuse.org/core/useTransition",[700],[3549,24582,24583],{"v-slot:credits":613},[751,24584,24585,24590],{},[754,24586,5929,24587,5941],{},[696,24588,10286],{"href":10284,"rel":24589},[700],[754,24591,6969,24592,880],{},[696,24593,24596],{"href":24594,"rel":24595},"https://magicui.design/docs/components/number-ticker",[700],"Magic UI NumberTicker",{"title":613,"searchDepth":847,"depth":847,"links":24598},[],"Animate numbers to count up or down to a target number",{},{"title":499,"description":24599},[1067,5952,6732],"aAEW9xYHVDp9-L-iuV3_uNtQ9MRCM_0XNIYuL6SLUy0",{"id":24605,"title":503,"badge":687,"body":24606,"category":23057,"description":24680,"extension":856,"links":687,"meta":24681,"navigation":859,"path":504,"seo":24682,"stem":505,"tags":24683,"__hash__":24684},"docs_en/en/2.components/text-animations/radiant-text.md",{"type":689,"value":24607,"toc":24678},[24608],[5728,24609,24614,24668],{":component-files":24610,"component-id":24611,"config":24612,"demo-file":24613},"[\"RadiantText.vue\"]","radiant-text","RadiantTextConfig","RadiantTextDemo.vue",[3549,24615,24616,24618],{"v-slot:api":613},[882,24617,5856],{"id":5855},[5858,24619,24620,24632],{},[5861,24621,24622],{},[5864,24623,24624,24626,24628,24630],{},[5867,24625,5869],{},[5867,24627,5872],{},[5867,24629,5875],{},[5867,24631,5878],{},[5880,24633,24634,24650],{},[5864,24635,24636,24640,24644,24648],{},[5885,24637,24638],{},[894,24639,6933],{},[5885,24641,24642],{},[894,24643,6016],{},[5885,24645,24646],{},[894,24647,8850],{},[5885,24649,10275],{},[5864,24651,24652,24657,24661,24665],{},[5885,24653,24654],{},[894,24655,24656],{},"radiantWidth",[5885,24658,24659],{},[894,24660,6016],{},[5885,24662,24663],{},[894,24664,7337],{},[5885,24666,24667],{},"Width of the radiant animation.",[3549,24669,24670],{"v-slot:credits":613},[751,24671,24672],{},[754,24673,5929,24674,7387],{},[696,24675,725],{"href":24676,"rel":24677},"https://magicui.design/docs/components/animated-shiny-text",[700],{"title":613,"searchDepth":847,"depth":847,"links":24679},[],"A glare effect on text.",{},{"title":503,"description":24680},[1067,5952,6732],"gEdyo-ndIDm9LYFakezGEYgDkwnKwHQQkMw7TTq9Ie0",{"id":24686,"title":507,"badge":687,"body":24687,"category":23057,"description":24805,"extension":856,"links":687,"meta":24806,"navigation":859,"path":508,"seo":24807,"stem":509,"tags":24808,"__hash__":24809},"docs_en/en/2.components/text-animations/sparkles-text.md",{"type":689,"value":24688,"toc":24803},[24689],[5728,24690,24695,24783],{":component-files":24691,"component-id":24692,"config":24693,"demo-file":24694},"[\"SparklesText.vue\"]","sparkles-text","SparklesTextConfig","SparklesTextDemo.vue",[3549,24696,24697,24699],{"v-slot:api":613},[882,24698,5856],{"id":5855},[5858,24700,24701,24713],{},[5861,24702,24703],{},[5864,24704,24705,24707,24709,24711],{},[5867,24706,5869],{},[5867,24708,5872],{},[5867,24710,5875],{},[5867,24712,5878],{},[5880,24714,24715,24732,24747,24765],{},[5864,24716,24717,24721,24725,24729],{},[5885,24718,24719],{},[894,24720,5889],{},[5885,24722,24723],{},[894,24724,5894],{},[5885,24726,24727],{},[894,24728,5899],{},[5885,24730,24731],{},"The class to be applied to the sparkles text.",[5864,24733,24734,24738,24742,24744],{},[5885,24735,24736],{},[894,24737,10142],{},[5885,24739,24740],{},[894,24741,5894],{},[5885,24743,23518],{},[5885,24745,24746],{},"The text to display.",[5864,24748,24749,24754,24758,24762],{},[5885,24750,24751],{},[894,24752,24753],{},"sparklesCount",[5885,24755,24756],{},[894,24757,6016],{},[5885,24759,24760],{},[894,24761,8850],{},[5885,24763,24764],{},"sparkles count that appears on the text.",[5864,24766,24767,24771,24775,24780],{},[5885,24768,24769],{},[894,24770,9801],{},[5885,24772,24773],{},[894,24774,12403],{},[5885,24776,24777],{},[894,24778,24779],{},"{first: '#A07CFE'; second: '#FE8FB5';}",[5885,24781,24782],{},"The sparkles colors.",[3549,24784,24785],{"v-slot:credits":613},[751,24786,24787,24792,24798],{},[754,24788,5929,24789,6725],{},[696,24790,5940],{"href":5938,"rel":24791},[700],[754,24793,6176,24794,880],{},[696,24795,725],{"href":24796,"rel":24797},"https://magicui.design/docs/components/sparkles-text",[700],[754,24799,5929,24800,7828],{},[696,24801,8458],{"href":8456,"rel":24802},[700],{"title":613,"searchDepth":847,"depth":847,"links":24804},[],"A dynamic text that generates continuous sparkles with smooth transitions, perfect for highlighting text with animated stars.",{},{"title":507,"description":24805},[1067,5952,6732],"1a7yDypf0GHY5NTGHxRrh48xepBokv7NqMDeAOdYIps",{"id":24811,"title":511,"badge":687,"body":24812,"category":23057,"description":24959,"extension":856,"links":687,"meta":24960,"navigation":859,"path":512,"seo":24961,"stem":513,"tags":24962,"__hash__":24963},"docs_en/en/2.components/text-animations/spinning-text.md",{"type":689,"value":24813,"toc":24957},[24814],[5728,24815,24820,24941],{":component-files":24816,"component-id":24817,"config":24818,"demo-file":24819},"[\"SpinningText.vue\"]","spinning-text","SpinningTextConfig","SpinningTextDemo.vue",[3549,24821,24822,24824],{"v-slot:api":613},[882,24823,5856],{"id":5855},[5858,24825,24826,24838],{},[5861,24827,24828],{},[5864,24829,24830,24832,24834,24836],{},[5867,24831,5869],{},[5867,24833,5872],{},[5867,24835,5875],{},[5867,24837,5878],{},[5880,24839,24840,24857,24874,24891,24907,24924],{},[5864,24841,24842,24846,24850,24854],{},[5885,24843,24844],{},[894,24845,6933],{},[5885,24847,24848],{},[894,24849,6016],{},[5885,24851,24852],{},[894,24853,8850],{},[5885,24855,24856],{},"The duration of the full circular rotation animation.",[5864,24858,24859,24863,24867,24871],{},[5885,24860,24861],{},[894,24862,17689],{},[5885,24864,24865],{},[894,24866,5914],{},[5885,24868,24869],{},[894,24870,7446],{},[5885,24872,24873],{},"Determines if the animation should rotate in reverse.",[5864,24875,24876,24880,24884,24888],{},[5885,24877,24878],{},[894,24879,15995],{},[5885,24881,24882],{},[894,24883,6016],{},[5885,24885,24886],{},[894,24887,9631],{},[5885,24889,24890],{},"The radius of the circular path for the text animation.",[5864,24892,24893,24897,24902,24904],{},[5885,24894,24895],{},[894,24896,8545],{},[5885,24898,24899],{},[894,24900,24901],{},"motion-v Transition",[5885,24903,23518],{},[5885,24905,24906],{},"Custom transition effects for the animation.",[5864,24908,24909,24914,24919,24921],{},[5885,24910,24911],{},[894,24912,24913],{},"variants",[5885,24915,24916],{},[894,24917,24918],{},"{container: motion-v Variant, item: motion-v Variant}",[5885,24920,23518],{},[5885,24922,24923],{},"Variants for container and item animations.",[5864,24925,24926,24930,24934,24938],{},[5885,24927,24928],{},[894,24929,5889],{},[5885,24931,24932],{},[894,24933,5894],{},[5885,24935,24936],{},[894,24937,6077],{},[5885,24939,24940],{},"A custom class name for the text container.",[3549,24942,24943],{"v-slot:credits":613},[751,24944,24945,24950],{},[754,24946,5929,24947,6725],{},[696,24948,8882],{"href":8880,"rel":24949},[700],[754,24951,6969,24952,880],{},[696,24953,24956],{"href":24954,"rel":24955},"https://magicui.design/docs/components/spinning-text",[700],"Magic UI Spinning Text",{"title":613,"searchDepth":847,"depth":847,"links":24958},[],"The Spinning Text component animates text in a circular motion with customizable speed, direction, color, and transitions for dynamic and engaging effects.",{},{"title":511,"description":24959},[1067,5952,6732],"rnYUTrsm5DJhvZaDYQqVCOw-AfmAGuuRBvJ9JdKLy5s",{"id":24965,"title":515,"badge":687,"body":24966,"category":23057,"description":25078,"extension":856,"links":687,"meta":25079,"navigation":859,"path":516,"seo":25080,"stem":517,"tags":25081,"__hash__":25082},"docs_en/en/2.components/text-animations/text-generate-effect.md",{"type":689,"value":24967,"toc":25076},[24968],[5728,24969,24974,25061],{":component-files":24970,"component-id":24971,"config":24972,"demo-file":24973},"[\"TextGenerateEffect.vue\"]","text-generate-effect","TextGenerateConfig","TextGenerateDemo.vue",[3549,24975,24976,24978],{"v-slot:api":613},[882,24977,5856],{"id":5855},[5858,24979,24980,24992],{},[5861,24981,24982],{},[5864,24983,24984,24986,24988,24990],{},[5867,24985,5869],{},[5867,24987,5872],{},[5867,24989,5875],{},[5867,24991,5878],{},[5880,24993,24994,25009,25026,25043],{},[5864,24995,24996,25000,25004,25006],{},[5885,24997,24998],{},[894,24999,23457],{},[5885,25001,25002],{},[894,25003,5894],{},[5885,25005,9105],{},[5885,25007,25008],{},"The text to be displayed with the generating effect.",[5864,25010,25011,25015,25019,25023],{},[5885,25012,25013],{},[894,25014,6933],{},[5885,25016,25017],{},[894,25018,6016],{},[5885,25020,25021],{},[894,25022,6388],{},[5885,25024,25025],{},"The duration of the text generation animation in seconds.",[5864,25027,25028,25032,25036,25040],{},[5885,25029,25030],{},[894,25031,6914],{},[5885,25033,25034],{},[894,25035,6016],{},[5885,25037,25038],{},[894,25039,6157],{},[5885,25041,25042],{},"The delay before the text generation animation starts in milliseconds.",[5864,25044,25045,25050,25054,25058],{},[5885,25046,25047],{},[894,25048,25049],{},"filter",[5885,25051,25052],{},[894,25053,5914],{},[5885,25055,25056],{},[894,25057,5919],{},[5885,25059,25060],{},"The blur of the text.",[3549,25062,25063],{"v-slot:credits":613},[751,25064,25065,25070],{},[754,25066,5929,25067,5941],{},[696,25068,8458],{"href":8456,"rel":25069},[700],[754,25071,6969,25072,880],{},[696,25073,25075],{"href":18607,"rel":25074},[700],"Aceternity UI's Text Generate Effect",{"title":613,"searchDepth":847,"depth":847,"links":25077},[],"A cool text effect that fades in text on page load, one by one.",{},{"title":515,"description":25078},[1067,5952,5954],"dTL6s05JglkxRP4iKRJXLBjSoWBd0cnEuVQ72dJtDq8",{"id":25084,"title":519,"badge":687,"body":25085,"category":23057,"description":25223,"extension":856,"links":687,"meta":25224,"navigation":859,"path":520,"seo":25225,"stem":521,"tags":25226,"__hash__":25227},"docs_en/en/2.components/text-animations/text-glitch.md",{"type":689,"value":25086,"toc":25221},[25087],[5728,25088,25093,25200],{":component-files":25089,"component-id":25090,"config":25091,"demo-file":25092},"[\"TextGlitch.vue\"]","text-glitch","TextGlitchConfig","TextGlitchDemo.vue",[3549,25094,25095,25097],{"v-slot:api":613},[882,25096,5856],{"id":5855},[5858,25098,25099,25111],{},[5861,25100,25101],{},[5864,25102,25103,25105,25107,25109],{},[5867,25104,5869],{},[5867,25106,5872],{},[5867,25108,5875],{},[5867,25110,5878],{},[5880,25112,25113,25130,25147,25165,25183],{},[5864,25114,25115,25119,25123,25127],{},[5885,25116,25117],{},[894,25118,10142],{},[5885,25120,25121],{},[894,25122,5894],{},[5885,25124,25125],{},[894,25126,6077],{},[5885,25128,25129],{},"The text content to display with the glitch effect.",[5864,25131,25132,25136,25140,25144],{},[5885,25133,25134],{},[894,25135,7577],{},[5885,25137,25138],{},[894,25139,6016],{},[5885,25141,25142],{},[894,25143,6923],{},[5885,25145,25146],{},"Controls the animation speed of the glitch effect in seconds.",[5864,25148,25149,25154,25158,25162],{},[5885,25150,25151],{},[894,25152,25153],{},"enableShadows",[5885,25155,25156],{},[894,25157,5914],{},[5885,25159,25160],{},[894,25161,5919],{},[5885,25163,25164],{},"Toggles colored shadows that enhance the glitch look.",[5864,25166,25167,25172,25176,25180],{},[5885,25168,25169],{},[894,25170,25171],{},"enableOnHover",[5885,25173,25174],{},[894,25175,5914],{},[5885,25177,25178],{},[894,25179,7446],{},[5885,25181,25182],{},"If true, glitch animation activates only on hover.",[5864,25184,25185,25189,25193,25197],{},[5885,25186,25187],{},[894,25188,5889],{},[5885,25190,25191],{},[894,25192,5894],{},[5885,25194,25195],{},[894,25196,7766],{},[5885,25198,25199],{},"Additional CSS classes for the container div.",[3549,25201,25202],{"v-slot:credits":613},[751,25203,25204],{},[754,25205,25206,25207],{},"Inspired and developed using resources from following YouTube videos.\n",[751,25208,25209,25215],{},[754,25210,25211],{},[696,25212,25213],{"href":25213,"rel":25214},"https://www.youtube.com/watch?v=7Xyg8Ja7dyY",[700],[754,25216,25217],{},[696,25218,25219],{"href":25219,"rel":25220},"https://www.youtube.com/watch?v=9CCkp_El1So",[700],{"title":613,"searchDepth":847,"depth":847,"links":25222},[],"Creates a vibrant glitch effect on text with customizable speed, shadow colors, and optional hover-triggered animation.",{},{"title":519,"description":25223},[1067,5952],"flv4H_XndCw6C6D3BEcCB-Q4gHmQJs2XrQcw_f9iL-Y",{"id":25229,"title":523,"badge":687,"body":25230,"category":23057,"description":25333,"extension":856,"links":687,"meta":25334,"navigation":859,"path":524,"seo":25335,"stem":525,"tags":25336,"__hash__":25337},"docs_en/en/2.components/text-animations/text-highlight.md",{"type":689,"value":25231,"toc":25331},[25232],[5728,25233,25238,25315],{":component-files":25234,"component-id":25235,"config":25236,"demo-file":25237},"[\"TextHighlight.vue\"]","text-highlight","TextHighlightConfig","TextHighlightDemo.vue",[3549,25239,25240,25242],{"v-slot:api":613},[882,25241,5856],{"id":5855},[5858,25243,25244,25256],{},[5861,25245,25246],{},[5864,25247,25248,25250,25252,25254],{},[5867,25249,5869],{},[5867,25251,5872],{},[5867,25253,5875],{},[5867,25255,5878],{},[5880,25257,25258,25277,25296],{},[5864,25259,25260,25264,25268,25272],{},[5885,25261,25262],{},[894,25263,6914],{},[5885,25265,25266],{},[894,25267,6016],{},[5885,25269,25270],{},[894,25271,6157],{},[5885,25273,25274,25275,880],{},"Delay before the animation starts, in ",[894,25276,7592],{},[5864,25278,25279,25283,25287,25291],{},[5885,25280,25281],{},[894,25282,6933],{},[5885,25284,25285],{},[894,25286,6016],{},[5885,25288,25289],{},[894,25290,7247],{},[5885,25292,25293,25294,880],{},"Duration of the animation, in ",[894,25295,7592],{},[5864,25297,25298,25303,25307,25312],{},[5885,25299,25300],{},[894,25301,25302],{},"text-end-color",[5885,25304,25305],{},[894,25306,5894],{},[5885,25308,25309],{},[894,25310,25311],{},"inherit",[5885,25313,25314],{},"Color of the text at the end of the animation. Match WCAG recommendations.",[3549,25316,25317],{"v-slot:credits":613},[751,25318,25319,25325],{},[754,25320,6857,25321],{},[696,25322,719],{"href":25323,"rel":25324},"https://ui.aceternity.com/components/hero-highlight",[700],[754,25326,5929,25327,5941],{},[696,25328,7637],{"href":25329,"rel":25330},"https://nathandepachtere.com",[700],{"title":613,"searchDepth":847,"depth":847,"links":25332},[],"A text effect that fill background of a text to highlight it.",{},{"title":523,"description":25333},[1067,5952,5954],"k1VgcuIHZ2jT2kSCEbG8vYXG9VkcQSqQLvFG-kELL6Q",{"id":25339,"title":527,"badge":687,"body":25340,"category":23057,"description":25438,"extension":856,"links":687,"meta":25439,"navigation":859,"path":528,"seo":25440,"stem":529,"tags":25441,"__hash__":25442},"docs_en/en/2.components/text-animations/text-hover-effect.md",{"type":689,"value":25341,"toc":25436},[25342],[5728,25343,25347],{":component-files":25344,"component-id":4779,"config":25345,"demo-file":25346},"[\"TextHoverEffect.vue\"]","TextHoverEffectConfig","TextHoverEffectDemo.vue",[3549,25348,25349,25351],{"v-slot:api":613},[882,25350,5856],{"id":5855},[5858,25352,25353,25365],{},[5861,25354,25355],{},[5864,25356,25357,25359,25361,25363],{},[5867,25358,5869],{},[5867,25360,5872],{},[5867,25362,5875],{},[5867,25364,5878],{},[5880,25366,25367,25382,25399,25418],{},[5864,25368,25369,25373,25377,25379],{},[5885,25370,25371],{},[894,25372,10142],{},[5885,25374,25375],{},[894,25376,5894],{},[5885,25378,9105],{},[5885,25380,25381],{},"The text to be displayed with the hover effect.",[5864,25383,25384,25388,25392,25396],{},[5885,25385,25386],{},[894,25387,6933],{},[5885,25389,25390],{},[894,25391,6016],{},[5885,25393,25394],{},[894,25395,6513],{},[5885,25397,25398],{},"The duration of the mask transition animation in seconds.",[5864,25400,25401,25406,25410,25415],{},[5885,25402,25403],{},[894,25404,25405],{},"strokeWidth",[5885,25407,25408],{},[894,25409,6016],{},[5885,25411,25412],{},[894,25413,25414],{},"0.75",[5885,25416,25417],{},"The width of the text stroke.",[5864,25419,25420,25425,25429,25433],{},[5885,25421,25422],{},[894,25423,25424],{},"opacity",[5885,25426,25427],{},[894,25428,6016],{},[5885,25430,25431],{},[894,25432,8291],{},[5885,25434,25435],{},"The opacity of the text.",{"title":613,"searchDepth":847,"depth":847,"links":25437},[],"A text hover effect that animates and outlines gradient on hover, as seen on x.ai",{},{"title":527,"description":25438},[1067,5952],"rcEHSDfSUmjbUJDiNcszcwhvpCkd0w4JK-iB_clZY4M",{"id":25444,"title":531,"badge":687,"body":25445,"category":23057,"description":25577,"extension":856,"links":687,"meta":25578,"navigation":859,"path":532,"seo":25579,"stem":533,"tags":25580,"__hash__":25581},"docs_en/en/2.components/text-animations/text-reveal.md",{"type":689,"value":25446,"toc":25575},[25447],[5728,25448,25453,25559],{":component-files":25449,"component-id":25450,"config":25451,"demo-file":25452,"dependencies":12480},"[\"TextReveal.vue\"]","text-reveal","TextRevealConfig","TextRevealDemo.vue",[3549,25454,25455,25457],{"v-slot:api":613},[882,25456,5856],{"id":5855},[5858,25458,25459,25471],{},[5861,25460,25461],{},[5864,25462,25463,25465,25467,25469],{},[5867,25464,5869],{},[5867,25466,5872],{},[5867,25468,5875],{},[5867,25470,5878],{},[5880,25472,25473,25490,25507,25524,25541],{},[5864,25474,25475,25479,25483,25487],{},[5885,25476,25477],{},[894,25478,5889],{},[5885,25480,25481],{},[894,25482,5894],{},[5885,25484,25485],{},[894,25486,5899],{},[5885,25488,25489],{},"Additional classes for the inner text container.",[5864,25491,25492,25496,25500,25504],{},[5885,25493,25494],{},[894,25495,9370],{},[5885,25497,25498],{},[894,25499,5894],{},[5885,25501,25502],{},[894,25503,5899],{},[5885,25505,25506],{},"Additional classes for the outer container.",[5864,25508,25509,25513,25517,25521],{},[5885,25510,25511],{},[894,25512,6933],{},[5885,25514,25515],{},[894,25516,6016],{},[5885,25518,25519],{},[894,25520,7106],{},[5885,25522,25523],{},"Animation duration for line reveal.",[5864,25525,25526,25530,25534,25538],{},[5885,25527,25528],{},[894,25529,6914],{},[5885,25531,25532],{},[894,25533,6016],{},[5885,25535,25536],{},[894,25537,6407],{},[5885,25539,25540],{},"Initial delay before animation starts.",[5864,25542,25543,25548,25552,25556],{},[5885,25544,25545],{},[894,25546,25547],{},"stagger",[5885,25549,25550],{},[894,25551,6016],{},[5885,25553,25554],{},[894,25555,12279],{},[5885,25557,25558],{},"Animation delay between each line reveal.",[3549,25560,25561],{"v-slot:credits":613},[751,25562,25563],{},[754,25564,21925,25565,720,25570,880],{},[696,25566,25569],{"href":25567,"rel":25568},"https://gsap.com/",[700],"GSAP",[696,25571,25574],{"href":25572,"rel":25573},"https://gsap.com/docs/v3/Plugins/SplitText/",[700],"GSAP SplitText",{"title":613,"searchDepth":847,"depth":847,"links":25576},[],"Animate text line-by-line using GSAP's SplitText for smooth word or line entrance effects.",{},{"title":531,"description":25577},[1067,5952,12480],"-6-n8pPlqTEjnV_apXyRxZo_NAGtIHfqlgrS7_UcVxM",{"id":25583,"title":535,"badge":687,"body":25584,"category":23057,"description":25698,"extension":856,"links":687,"meta":25699,"navigation":859,"path":536,"seo":25700,"stem":537,"tags":25701,"__hash__":25702},"docs_en/en/2.components/text-animations/text-reveal-card.md",{"type":689,"value":25585,"toc":25696},[25586],[5728,25587,25592,25680],{":component-files":25588,"component-id":25589,"config":25590,"demo-file":25591},"[\"TextRevealCard.vue\", \"TextRevealStars.vue\"]","text-reveal-card","TextRevealCardConfig","TextRevealCardDemo.vue",[3549,25593,25594,25596,25645],{"v-slot:api":613},[882,25595,5856],{"id":5855},[5858,25597,25598,25608],{},[5861,25599,25600],{},[5864,25601,25602,25604,25606],{},[5867,25603,5869],{},[5867,25605,5872],{},[5867,25607,5878],{},[5880,25609,25610,25621,25633],{},[5864,25611,25612,25614,25618],{},[5885,25613,5889],{},[5885,25615,25616],{},[894,25617,13999],{},[5885,25619,25620],{},"Additional classes to be added to the card.",[5864,25622,25623,25626,25630],{},[5885,25624,25625],{},"starsCount",[5885,25627,25628],{},[894,25629,15939],{},[5885,25631,25632],{},"Control the number of stars that are generated",[5864,25634,25635,25638,25642],{},[5885,25636,25637],{},"starsClass",[5885,25639,25640],{},[894,25641,13999],{},[5885,25643,25644],{},"Additional classes to be added to the stars floating on content.",[5858,25646,25647,25655],{},[5861,25648,25649],{},[5864,25650,25651,25653],{},[5867,25652,11928],{},[5867,25654,5878],{},[5880,25656,25657,25665,25672],{},[5864,25658,25659,25661],{},[5885,25660,15748],{},[5885,25662,25663],{},[894,25664,13999],{},[5864,25666,25667,25669],{},[5885,25668,10142],{},[5885,25670,25671],{},"Display default text when the card is not hovered over.",[5864,25673,25674,25677],{},[5885,25675,25676],{},"revealText",[5885,25678,25679],{},"Text to be revealed when hovered over the card.",[3549,25681,25682],{"v-slot:credits":613},[751,25683,25684,25689],{},[754,25685,5929,25686,5941],{},[696,25687,8458],{"href":8456,"rel":25688},[700],[754,25690,6969,25691,880],{},[696,25692,25695],{"href":25693,"rel":25694},"https://ui.aceternity.com/components/text-reveal-card",[700],"Aceternity UI's Text Reveal Card",{"title":613,"searchDepth":847,"depth":847,"links":25697},[],"Mousemove effect to reveal text content at the bottom of the card.",{},{"title":535,"description":25698},[1067,5952,5954],"BxHd6NxnhIg0zMVUdY42-QronXtYcwCnJ1wOmPST4sk",{"id":25704,"title":539,"badge":687,"body":25705,"category":23057,"description":25777,"extension":856,"links":687,"meta":25778,"navigation":859,"path":540,"seo":25779,"stem":541,"tags":25780,"__hash__":25781},"docs_en/en/2.components/text-animations/text-scroll-reveal.md",{"type":689,"value":25706,"toc":25775},[25707],[5728,25708,25713,25764],{":component-files":25709,"component-id":25710,"config":25711,"demo-file":25712},"[\"TextScrollReveal.vue\", \"ScrollWord.vue\"]","text-scroll-reveal","TextScrollRevealConfig","TextScrollRevealDemo.vue",[3549,25714,25715,25717],{"v-slot:api":613},[882,25716,5856],{"id":5855},[5858,25718,25719,25731],{},[5861,25720,25721],{},[5864,25722,25723,25725,25727,25729],{},[5867,25724,5869],{},[5867,25726,5872],{},[5867,25728,5875],{},[5867,25730,5878],{},[5880,25732,25733,25748],{},[5864,25734,25735,25739,25743,25745],{},[5885,25736,25737],{},[894,25738,10142],{},[5885,25740,25741],{},[894,25742,5894],{},[5885,25744,18875],{},[5885,25746,25747],{},"The text content to display and reveal word by word during scroll.",[5864,25749,25750,25754,25758,25762],{},[5885,25751,25752],{},[894,25753,5889],{},[5885,25755,25756],{},[894,25757,5894],{},[5885,25759,25760],{},[894,25761,6077],{},[5885,25763,18860],{},[3549,25765,25766],{"v-slot:credits":613},[751,25767,25768],{},[754,25769,6969,25770,880],{},[696,25771,25774],{"href":25772,"rel":25773},"https://magicui.design/docs/components/text-reveal",[700],"Magic UI Text Reveal",{"title":613,"searchDepth":847,"depth":847,"links":25776},[],"A component that reveals text word by word as you scroll, with customizable text and styling.",{},{"title":539,"description":25777},[1067,5952,6732],"FXaERIKrbySmF5ymmQyp5iF5-MYeVchDCIZ0-12o7YA",{"id":25783,"title":548,"badge":687,"body":25784,"category":543,"description":25914,"extension":856,"links":687,"meta":25915,"navigation":859,"path":549,"seo":25916,"stem":550,"tags":25917,"__hash__":25918},"docs_en/en/2.components/visualization/bending-gallery.md",{"type":689,"value":25785,"toc":25912},[25786],[5728,25787,25792,25901],{":component-files":25788,"component-id":25789,"config":25790,"demo-file":25791,"dependencies":6991},"[\"BendingGallery.vue\"]","bending-gallery","BendingGalleryConfig","BendingGalleryDemo.vue",[3549,25793,25794,25796],{"v-slot:api":613},[882,25795,5856],{"id":5855},[5858,25797,25798,25810],{},[5861,25799,25800],{},[5864,25801,25802,25804,25806,25808],{},[5867,25803,5869],{},[5867,25805,5872],{},[5867,25807,5875],{},[5867,25809,5878],{},[5880,25811,25812,25830,25848,25865,25882],{},[5864,25813,25814,25818,25823,25827],{},[5885,25815,25816],{},[894,25817,15646],{},[5885,25819,25820],{},[894,25821,25822],{},"{ image: string; text: string }[]",[5885,25824,25825],{},[894,25826,3932],{},[5885,25828,25829],{},"Array of objects containing image URLs and accompanying text.",[5864,25831,25832,25837,25841,25845],{},[5885,25833,25834],{},[894,25835,25836],{},"bend",[5885,25838,25839],{},[894,25840,6016],{},[5885,25842,25843],{},[894,25844,8255],{},[5885,25846,25847],{},"Controls the curvature of the gallery. Higher values bend more.",[5864,25849,25850,25854,25858,25862],{},[5885,25851,25852],{},[894,25853,22876],{},[5885,25855,25856],{},[894,25857,5894],{},[5885,25859,25860],{},[894,25861,10499],{},[5885,25863,25864],{},"Color of the text displayed below each image.",[5864,25866,25867,25871,25875,25879],{},[5885,25868,25869],{},[894,25870,10032],{},[5885,25872,25873],{},[894,25874,6016],{},[5885,25876,25877],{},[894,25878,8518],{},[5885,25880,25881],{},"Rounded corners for image cards (in UV space).",[5864,25883,25884,25889,25893,25898],{},[5885,25885,25886],{},[894,25887,25888],{},"font",[5885,25890,25891],{},[894,25892,5894],{},[5885,25894,25895],{},[894,25896,25897],{},"\"bold 30px DM Sans\"",[5885,25899,25900],{},"Font used for the text below each image.",[3549,25902,25903],{"v-slot:credits":613},[751,25904,25905],{},[754,25906,6857,25907,880],{},[696,25908,25911],{"href":25909,"rel":25910},"https://tympanus.net/Tutorials/InfiniteCircularGallery/",[700],"Infinite Circular Gallery from Codrops",{"title":613,"searchDepth":847,"depth":847,"links":25913},[],"A curved, scrollable 3D gallery with dynamic image cards and animated text rendered using WebGL and OGL.",{},{"title":548,"description":25914},[1067,5952,6991,7023],"XRSCMIGnOFAIGVxLe8sXsTkVoNnaz59XdB-FLFtroY0",{"id":25920,"title":552,"badge":687,"body":25921,"category":543,"description":26057,"extension":856,"links":687,"meta":26058,"navigation":859,"path":553,"seo":26059,"stem":554,"tags":26060,"__hash__":26061},"docs_en/en/2.components/visualization/carousal-3d.md",{"type":689,"value":25922,"toc":26055},[25923],[5728,25924,25929,26036],{":component-files":25925,"component-id":25926,"config":25927,"demo-file":25928},"[\"Carousel3D.vue\"]","carousel-3d","Carousel3dConfig","Carousel3dDemo.vue",[3549,25930,25931,25933],{"v-slot:api":613},[882,25932,5856],{"id":5855},[5858,25934,25935,25947],{},[5861,25936,25937],{},[5864,25938,25939,25941,25943,25945],{},[5867,25940,5869],{},[5867,25942,5872],{},[5867,25944,5875],{},[5867,25946,5878],{},[5880,25948,25949,25967,25984,26001,26019],{},[5864,25950,25951,25955,25960,25964],{},[5885,25952,25953],{},[894,25954,15646],{},[5885,25956,25957],{},[894,25958,25959],{},"unknown[]",[5885,25961,25962],{},[894,25963,3932],{},[5885,25965,25966],{},"List of images or elements to be displayed in the carousel.",[5864,25968,25969,25973,25977,25981],{},[5885,25970,25971],{},[894,25972,5889],{},[5885,25974,25975],{},[894,25976,5894],{},[5885,25978,25979],{},[894,25980,6077],{},[5885,25982,25983],{},"Additional CSS classes for styling the carousel overlay.",[5864,25985,25986,25990,25994,25998],{},[5885,25987,25988],{},[894,25989,9370],{},[5885,25991,25992],{},[894,25993,5894],{},[5885,25995,25996],{},[894,25997,6077],{},[5885,25999,26000],{},"CSS classes for styling the carousel container.",[5864,26002,26003,26007,26011,26016],{},[5885,26004,26005],{},[894,26006,6649],{},[5885,26008,26009],{},[894,26010,6016],{},[5885,26012,26013],{},[894,26014,26015],{},"450",[5885,26017,26018],{},"Width of individual carousel items.",[5864,26020,26021,26025,26029,26033],{},[5885,26022,26023],{},[894,26024,6667],{},[5885,26026,26027],{},[894,26028,6016],{},[5885,26030,26031],{},[894,26032,10377],{},[5885,26034,26035],{},"Height of individual carousel items.",[3549,26037,26038],{"v-slot:credits":613},[751,26039,26040,26043,26046],{},[754,26041,26042],{},"Built using Three.js for 3D rendering.",[754,26044,26045],{},"Utilizes Motion-V for seamless animations.",[754,26047,26048,26049,26054],{},"Thanks ",[696,26050,26053],{"href":26051,"rel":26052},"https://github.com/safakdinc",[700],"@safakdinc"," for sharing this component.",{"title":613,"searchDepth":847,"depth":847,"links":26056},[],"A dynamic and interactive 3D carousel component using Three.js and Motion-V, allowing smooth infinite rotation and user-controlled interactions.",{},{"title":552,"description":26057},[1067,5952,6188,1023],"5TtHRqO-fo_lnMjiH_S-7M2dxFxouuRe4oJ4kxOfzmI",{"id":26063,"title":556,"badge":687,"body":26064,"category":543,"description":26398,"extension":856,"links":687,"meta":26399,"navigation":859,"path":557,"seo":26400,"stem":558,"tags":26401,"__hash__":26402},"docs_en/en/2.components/visualization/file-tree.md",{"type":689,"value":26065,"toc":26396},[26066],[5728,26067,26072,26381],{":component-files":26068,"component-id":26069,"config":26070,"demo-file":26071},"[\"Tree.vue\", \"Folder.vue\", \"File.vue\", \"TreeIndicator.vue\", \"index.ts\"]","file-tree","FileTreeConfig","FileTreeDemo.vue",[3549,26073,26074,26076,26082,26087,26089,26263,26272,26283,26285],{"v-slot:api":613},[882,26075,5856],{"id":5855},[728,26077,26079],{"id":26078},"tree",[894,26080,26081],{},"Tree",[692,26083,10617,26084,26086],{},[894,26085,26081],{}," component serves as a container for displaying a hierarchical file/folder structure.",[3097,26088,3696],{"id":10623},[5858,26090,26091,26103],{},[5861,26092,26093],{},[5864,26094,26095,26097,26099,26101],{},[5867,26096,5869],{},[5867,26098,5872],{},[5867,26100,5875],{},[5867,26102,5878],{},[5880,26104,26105,26120,26136,26154,26171,26187,26206,26225,26244],{},[5864,26106,26107,26111,26115,26117],{},[5885,26108,26109],{},[894,26110,5889],{},[5885,26112,26113],{},[894,26114,5894],{},[5885,26116,5899],{},[5885,26118,26119],{},"Additional classes for styling the tree container.",[5864,26121,26122,26127,26131,26133],{},[5885,26123,26124],{},[894,26125,26126],{},"initialSelectedId",[5885,26128,26129],{},[894,26130,5894],{},[5885,26132,5899],{},[5885,26134,26135],{},"ID of the initially selected item.",[5864,26137,26138,26143,26147,26151],{},[5885,26139,26140],{},[894,26141,26142],{},"indicator",[5885,26144,26145],{},[894,26146,5914],{},[5885,26148,26149],{},[894,26150,5919],{},[5885,26152,26153],{},"Whether to show the tree indicator line.",[5864,26155,26156,26161,26166,26168],{},[5885,26157,26158],{},[894,26159,26160],{},"elements",[5885,26162,26163],{},[894,26164,26165],{},"TreeViewElement[]",[5885,26167,5899],{},[5885,26169,26170],{},"Array of tree elements to display.",[5864,26172,26173,26178,26182,26184],{},[5885,26174,26175],{},[894,26176,26177],{},"initialExpandedItems",[5885,26179,26180],{},[894,26181,9806],{},[5885,26183,5899],{},[5885,26185,26186],{},"Array of IDs of initially expanded folders.",[5864,26188,26189,26194,26198,26203],{},[5885,26190,26191],{},[894,26192,26193],{},"openIcon",[5885,26195,26196],{},[894,26197,5894],{},[5885,26199,26200],{},[894,26201,26202],{},"\"lucide:folder-open\"",[5885,26204,26205],{},"Icon to show for open folders.",[5864,26207,26208,26213,26217,26222],{},[5885,26209,26210],{},[894,26211,26212],{},"closeIcon",[5885,26214,26215],{},[894,26216,5894],{},[5885,26218,26219],{},[894,26220,26221],{},"\"lucide:folder\"",[5885,26223,26224],{},"Icon to show for closed folders.",[5864,26226,26227,26232,26236,26241],{},[5885,26228,26229],{},[894,26230,26231],{},"fileIcon",[5885,26233,26234],{},[894,26235,5894],{},[5885,26237,26238],{},[894,26239,26240],{},"\"lucide:file\"",[5885,26242,26243],{},"Icon to show for files.",[5864,26245,26246,26250,26255,26260],{},[5885,26247,26248],{},[894,26249,7459],{},[5885,26251,26252],{},[894,26253,26254],{},"\"rtl\" | \"ltr\"",[5885,26256,26257],{},[894,26258,26259],{},"\"ltr\"",[5885,26261,26262],{},"Text direction of the tree.",[728,26264,26266,720,26269],{"id":26265},"folder-and-file",[894,26267,26268],{},"Folder",[894,26270,26271],{},"File",[692,26273,10617,26274,720,26276,26278,26279,720,26281,11059],{},[894,26275,26268],{},[894,26277,26271],{}," components represent folders and files in the file tree. Folders can contain other ",[894,26280,26268],{},[894,26282,26271],{},[3097,26284,3696],{"id":10688},[5858,26286,26287,26299],{},[5861,26288,26289],{},[5864,26290,26291,26293,26295,26297],{},[5867,26292,5869],{},[5867,26294,5872],{},[5867,26296,5875],{},[5867,26298,5878],{},[5880,26300,26301,26315,26330,26345,26363],{},[5864,26302,26303,26307,26311,26313],{},[5885,26304,26305],{},[894,26306,5889],{},[5885,26308,26309],{},[894,26310,5894],{},[5885,26312,5899],{},[5885,26314,10719],{},[5864,26316,26317,26321,26325,26327],{},[5885,26318,26319],{},[894,26320,4433],{},[5885,26322,26323],{},[894,26324,5894],{},[5885,26326,5899],{},[5885,26328,26329],{},"Unique identifier for the item.",[5864,26331,26332,26336,26340,26342],{},[5885,26333,26334],{},[894,26335,15800],{},[5885,26337,26338],{},[894,26339,5894],{},[5885,26341,5899],{},[5885,26343,26344],{},"Display name of the folder/file.",[5864,26346,26347,26352,26356,26360],{},[5885,26348,26349],{},[894,26350,26351],{},"isSelectable",[5885,26353,26354],{},[894,26355,5914],{},[5885,26357,26358],{},[894,26359,5919],{},[5885,26361,26362],{},"Whether the item can be selected.",[5864,26364,26365,26370,26374,26378],{},[5885,26366,26367],{},[894,26368,26369],{},"isSelect",[5885,26371,26372],{},[894,26373,5914],{},[5885,26375,26376],{},[894,26377,7446],{},[5885,26379,26380],{},"Whether the item is currently selected.",[3549,26382,26383],{"v-slot:credits":613},[751,26384,26385,26391],{},[754,26386,6857,26387,880],{},[696,26388,725],{"href":26389,"rel":26390},"https://magicui.design/docs/components/file-tree",[700],[754,26392,6526,26393,5941],{},[696,26394,6869],{"href":6867,"rel":26395},[700],{"title":613,"searchDepth":847,"depth":847,"links":26397},[],"A component used to showcase the folder and file structure of a directory.",{},{"title":556,"description":26398},[1067,5952,6732],"kSPZAJOKxl3k3v6j8wQhFYSb9B9a4dvqbj14VEk9Nzk",{"id":26404,"title":560,"badge":687,"body":26405,"category":543,"description":26948,"extension":856,"links":687,"meta":26949,"navigation":859,"path":561,"seo":26950,"stem":562,"tags":26951,"__hash__":26952},"docs_en/en/2.components/visualization/github-globe.md",{"type":689,"value":26406,"toc":26946},[26407],[5728,26408,26414,26933],{":component-files":26409,"component-id":26410,"config":26411,"demo-file":26412,"dependencies":26413,"dev-dependencies":6121},"[\"GithubGlobe.vue\"]","github-globe","GithubGlobeConfig","GithubGlobeDemo.vue","three postprocessing three-globe",[3549,26415,26416,26420,26433,26435,26504,26510,26816,26822],{"v-slot:api":613},[3097,26417,26419],{"id":26418},"download-geojson-file","Download GeoJSON file",[692,26421,26422,26423,26428,26429,26432],{},"Download a GeoJSON file containing the globe's geographical data from ",[696,26424,26427],{"href":26425,"rel":26426},"https://geojson-maps.kyd.au/",[700],"GeoJSON Maps"," by customizing the continents and detail level. Save the downloaded file as ",[894,26430,26431],{},"globe.json"," in the same folder as your component.",[882,26434,5856],{"id":5855},[5858,26436,26437,26449],{},[5861,26438,26439],{},[5864,26440,26441,26443,26445,26447],{},[5867,26442,5869],{},[5867,26444,5872],{},[5867,26446,5875],{},[5867,26448,5878],{},[5880,26450,26451,26469,26488],{},[5864,26452,26453,26458,26462,26466],{},[5885,26454,26455],{},[894,26456,26457],{},"globeConfig",[5885,26459,26460],{},[894,26461,12403],{},[5885,26463,26464],{},[894,26465,19407],{},[5885,26467,26468],{},"Configuration options for the globe, including colors, atmosphere, rotation speed, and lighting.",[5864,26470,26471,26476,26481,26485],{},[5885,26472,26473],{},[894,26474,26475],{},"data",[5885,26477,26478],{},[894,26479,26480],{},"Position[]",[5885,26482,26483],{},[894,26484,3932],{},[5885,26486,26487],{},"Array of positions representing arcs and points on the globe, with latitude, longitude, color, etc.",[5864,26489,26490,26494,26498,26502],{},[5885,26491,26492],{},[894,26493,5889],{},[5885,26495,26496],{},[894,26497,5894],{},[5885,26499,26500],{},[894,26501,6077],{},[5885,26503,6962],{},[728,26505,26507,26509],{"id":26506},"globeconfig-properties",[894,26508,26457],{}," Properties",[5858,26511,26512,26524],{},[5861,26513,26514],{},[5864,26515,26516,26518,26520,26522],{},[5867,26517,19463],{},[5867,26519,5872],{},[5867,26521,5875],{},[5867,26523,5878],{},[5880,26525,26526,26544,26563,26581,26599,26617,26635,26653,26671,26690,26708,26726,26744,26762,26781,26798],{},[5864,26527,26528,26533,26537,26541],{},[5885,26529,26530],{},[894,26531,26532],{},"pointSize",[5885,26534,26535],{},[894,26536,6016],{},[5885,26538,26539],{},[894,26540,1758],{},[5885,26542,26543],{},"Size of individual points on the globe.",[5864,26545,26546,26551,26555,26560],{},[5885,26547,26548],{},[894,26549,26550],{},"globeColor",[5885,26552,26553],{},[894,26554,5894],{},[5885,26556,26557],{},[894,26558,26559],{},"\"#1d072e\"",[5885,26561,26562],{},"Color of the globe surface.",[5864,26564,26565,26570,26574,26578],{},[5885,26566,26567],{},[894,26568,26569],{},"showAtmosphere",[5885,26571,26572],{},[894,26573,5914],{},[5885,26575,26576],{},[894,26577,5919],{},[5885,26579,26580],{},"Whether to display atmosphere around the globe.",[5864,26582,26583,26588,26592,26596],{},[5885,26584,26585],{},[894,26586,26587],{},"atmosphereColor",[5885,26589,26590],{},[894,26591,5894],{},[5885,26593,26594],{},[894,26595,10499],{},[5885,26597,26598],{},"Color of the atmosphere around the globe.",[5864,26600,26601,26606,26610,26614],{},[5885,26602,26603],{},[894,26604,26605],{},"atmosphereAltitude",[5885,26607,26608],{},[894,26609,6016],{},[5885,26611,26612],{},[894,26613,12279],{},[5885,26615,26616],{},"Altitude of the atmosphere layer.",[5864,26618,26619,26624,26628,26632],{},[5885,26620,26621],{},[894,26622,26623],{},"emissive",[5885,26625,26626],{},[894,26627,5894],{},[5885,26629,26630],{},[894,26631,9524],{},[5885,26633,26634],{},"Emissive color for the globe material.",[5864,26636,26637,26642,26646,26650],{},[5885,26638,26639],{},[894,26640,26641],{},"emissiveIntensity",[5885,26643,26644],{},[894,26645,6016],{},[5885,26647,26648],{},[894,26649,12279],{},[5885,26651,26652],{},"Intensity of the emissive color.",[5864,26654,26655,26660,26664,26668],{},[5885,26656,26657],{},[894,26658,26659],{},"shininess",[5885,26661,26662],{},[894,26663,6016],{},[5885,26665,26666],{},[894,26667,12982],{},[5885,26669,26670],{},"Shininess of the globe material.",[5864,26672,26673,26678,26682,26687],{},[5885,26674,26675],{},[894,26676,26677],{},"polygonColor",[5885,26679,26680],{},[894,26681,5894],{},[5885,26683,26684],{},[894,26685,26686],{},"rgba(255,255,255,0.7)",[5885,26688,26689],{},"Color of polygon boundaries on the globe.",[5864,26691,26692,26697,26701,26705],{},[5885,26693,26694],{},[894,26695,26696],{},"arcTime",[5885,26698,26699],{},[894,26700,6016],{},[5885,26702,26703],{},[894,26704,7247],{},[5885,26706,26707],{},"Duration for arcs animation.",[5864,26709,26710,26715,26719,26723],{},[5885,26711,26712],{},[894,26713,26714],{},"arcLength",[5885,26716,26717],{},[894,26718,6016],{},[5885,26720,26721],{},[894,26722,12982],{},[5885,26724,26725],{},"Length of arcs on the globe.",[5864,26727,26728,26733,26737,26741],{},[5885,26729,26730],{},[894,26731,26732],{},"rings",[5885,26734,26735],{},[894,26736,6016],{},[5885,26738,26739],{},[894,26740,1758],{},[5885,26742,26743],{},"Number of rings to display per point.",[5864,26745,26746,26751,26755,26759],{},[5885,26747,26748],{},[894,26749,26750],{},"maxRings",[5885,26752,26753],{},[894,26754,6016],{},[5885,26756,26757],{},[894,26758,8255],{},[5885,26760,26761],{},"Maximum rings around each point.",[5864,26763,26764,26769,26773,26778],{},[5885,26765,26766],{},[894,26767,26768],{},"initialPosition",[5885,26770,26771],{},[894,26772,12403],{},[5885,26774,26775],{},[894,26776,26777],{},"{ lat: 0, lng: 0 }",[5885,26779,26780],{},"Initial latitude and longitude for the globe's position.",[5864,26782,26783,26787,26791,26795],{},[5885,26784,26785],{},[894,26786,22799],{},[5885,26788,26789],{},[894,26790,5914],{},[5885,26792,26793],{},[894,26794,7446],{},[5885,26796,26797],{},"Automatically rotate the globe.",[5864,26799,26800,26805,26809,26813],{},[5885,26801,26802],{},[894,26803,26804],{},"autoRotateSpeed",[5885,26806,26807],{},[894,26808,6016],{},[5885,26810,26811],{},[894,26812,6942],{},[5885,26814,26815],{},"Speed of auto-rotation when enabled.",[728,26817,26819,26821],{"id":26818},"data-structure-position",[894,26820,26475],{}," Structure (Position)",[5858,26823,26824,26834],{},[5861,26825,26826],{},[5864,26827,26828,26830,26832],{},[5867,26829,15492],{},[5867,26831,5872],{},[5867,26833,5878],{},[5880,26835,26836,26850,26864,26878,26892,26906,26920],{},[5864,26837,26838,26843,26847],{},[5885,26839,26840],{},[894,26841,26842],{},"order",[5885,26844,26845],{},[894,26846,6016],{},[5885,26848,26849],{},"Order of the point or arc for sequencing.",[5864,26851,26852,26857,26861],{},[5885,26853,26854],{},[894,26855,26856],{},"startLat",[5885,26858,26859],{},[894,26860,6016],{},[5885,26862,26863],{},"Starting latitude for an arc.",[5864,26865,26866,26871,26875],{},[5885,26867,26868],{},[894,26869,26870],{},"startLng",[5885,26872,26873],{},[894,26874,6016],{},[5885,26876,26877],{},"Starting longitude for an arc.",[5864,26879,26880,26885,26889],{},[5885,26881,26882],{},[894,26883,26884],{},"endLat",[5885,26886,26887],{},[894,26888,6016],{},[5885,26890,26891],{},"Ending latitude for an arc.",[5864,26893,26894,26899,26903],{},[5885,26895,26896],{},[894,26897,26898],{},"endLng",[5885,26900,26901],{},[894,26902,6016],{},[5885,26904,26905],{},"Ending longitude for an arc.",[5864,26907,26908,26913,26917],{},[5885,26909,26910],{},[894,26911,26912],{},"arcAlt",[5885,26914,26915],{},[894,26916,6016],{},[5885,26918,26919],{},"Altitude of the arc (determines arc height).",[5864,26921,26922,26926,26930],{},[5885,26923,26924],{},[894,26925,6485],{},[5885,26927,26928],{},[894,26929,5894],{},[5885,26931,26932],{},"Color of the arc or point in hex or RGB format.",[3549,26934,26935],{"v-slot:credits":613},[751,26936,26937,26940],{},[754,26938,26939],{},"Built with Three.js and Three Globe libraries, designed for global data visualizations and dynamic effects.",[754,26941,6969,26942,880],{},[696,26943,719],{"href":26944,"rel":26945},"https://ui.aceternity.com/components/github-globe",[700],{"title":613,"searchDepth":847,"depth":847,"links":26947},[],"A 3D interactive globe visualization with customizable arcs, points, and animation options inspired from Github.",{},{"title":560,"description":26948},[1067,5952,6188,5954],"PZCLHFlReDECl2Ze54P_b0GJARKWGxgo7L1-4A3x2CE",{"id":26954,"title":564,"badge":687,"body":26955,"category":543,"description":27119,"extension":856,"links":687,"meta":27120,"navigation":859,"path":565,"seo":27121,"stem":566,"tags":27122,"__hash__":27123},"docs_en/en/2.components/visualization/globe.md",{"type":689,"value":26956,"toc":27117},[26957],[5728,26958,26964,27099],{":component-files":26959,"component-id":26960,"config":26961,"demo-file":26962,"dependencies":26963},"[\"Globe.vue\"]","globe","GlobeConfig","GlobeDemo.vue","cobe vue-use-spring",[3549,26965,26966,26968],{"v-slot:api":613},[882,26967,5856],{"id":5855},[5858,26969,26970,26982],{},[5861,26971,26972],{},[5864,26973,26974,26976,26978,26980],{},[5867,26975,5869],{},[5867,26977,5872],{},[5867,26979,5875],{},[5867,26981,5878],{},[5880,26983,26984,27000,27027,27045,27063,27080],{},[5864,26985,26986,26990,26994,26998],{},[5885,26987,26988],{},[894,26989,5889],{},[5885,26991,26992],{},[894,26993,5894],{},[5885,26995,26996],{},[894,26997,6077],{},[5885,26999,6962],{},[5864,27001,27002,27007,27012,27014],{},[5885,27003,27004],{},[894,27005,27006],{},"config",[5885,27008,27009],{},[894,27010,27011],{},"COBEOptions",[5885,27013,18875],{},[5885,27015,27016,27017,1327,27022,27026],{},"Configuration object for the globe, following ",[702,27018,27019],{},[934,27020,27021],{},"COBE",[696,27023,27024],{"href":27024,"rel":27025},"https://cobe.vercel.app/docs/api",[700],") library options.",[5864,27028,27029,27034,27038,27042],{},[5885,27030,27031],{},[894,27032,27033],{},"mass",[5885,27035,27036],{},[894,27037,6016],{},[5885,27039,27040],{},[894,27041,1758],{},[5885,27043,27044],{},"Mass parameter for the spring animation controlling rotation inertia.",[5864,27046,27047,27051,27055,27060],{},[5885,27048,27049],{},[894,27050,12699],{},[5885,27052,27053],{},[894,27054,6016],{},[5885,27056,27057],{},[894,27058,27059],{},"280",[5885,27061,27062],{},"Tension parameter for the spring animation, affecting responsiveness.",[5864,27064,27065,27069,27073,27077],{},[5885,27066,27067],{},[894,27068,12662],{},[5885,27070,27071],{},[894,27072,6016],{},[5885,27074,27075],{},[894,27076,7337],{},[5885,27078,27079],{},"Friction parameter for the spring animation, affecting damping.",[5864,27081,27082,27087,27091,27096],{},[5885,27083,27084],{},[894,27085,27086],{},"precision",[5885,27088,27089],{},[894,27090,6016],{},[5885,27092,27093],{},[894,27094,27095],{},"0.001",[5885,27097,27098],{},"Precision parameter for the spring animation calculations.",[3549,27100,27101],{"v-slot:credits":613},[751,27102,27103,27111],{},[754,27104,19878,27105,27110],{},[696,27106,27109],{"href":27107,"rel":27108},"https://github.com/shuding/cobe",[700],"cobe"," library for WebGL globe visualization.",[754,27112,6969,27113,880],{},[696,27114,725],{"href":27115,"rel":27116},"https://magicui.design/docs/components/globe",[700],{"title":613,"searchDepth":847,"depth":847,"links":27118},[],"An interactive rotating globe component.",{},{"title":564,"description":27119},[1067,5952,27109,6732],"2u4BGJopWofo3_YTrmyaM1v2upbs1g_bS8gvlM2PHx8",{"id":27125,"title":568,"badge":687,"body":27126,"category":543,"description":27203,"extension":856,"links":687,"meta":27204,"navigation":859,"path":569,"seo":27205,"stem":570,"tags":27206,"__hash__":27207},"docs_en/en/2.components/visualization/icon-cloud.md",{"type":689,"value":27127,"toc":27201},[27128],[5728,27129,27134,27186],{":component-files":27130,"component-id":27131,"config":27132,"demo-file":27133},"[\"IconCloud.vue\", \"index.ts\"]","icon-cloud","IconCloudConfig","IconCloudDemo.vue",[3549,27135,27136,27138],{"v-slot:api":613},[882,27137,5856],{"id":5855},[5858,27139,27140,27152],{},[5861,27141,27142],{},[5864,27143,27144,27146,27148,27150],{},[5867,27145,5869],{},[5867,27147,5872],{},[5867,27149,5875],{},[5867,27151,5878],{},[5880,27153,27154,27168],{},[5864,27155,27156,27160,27164,27166],{},[5885,27157,27158],{},[894,27159,5889],{},[5885,27161,27162],{},[894,27163,5894],{},[5885,27165,5899],{},[5885,27167,6779],{},[5864,27169,27170,27174,27179,27183],{},[5885,27171,27172],{},[894,27173,12507],{},[5885,27175,27176],{},[894,27177,27178],{},"array",[5885,27180,27181],{},[894,27182,3932],{},[5885,27184,27185],{},"Array of image URLs to render in the cloud",[3549,27187,27188],{"v-slot:credits":613},[751,27189,27190,27196],{},[754,27191,6857,27192,880],{},[696,27193,6862],{"href":27194,"rel":27195},"https://magicui.design/docs/components/icon-cloud",[700],[754,27197,5929,27198,5941],{},[696,27199,6869],{"href":6867,"rel":27200},[700],{"title":613,"searchDepth":847,"depth":847,"links":27202},[],"An interactive 3D tag cloud component",{},{"title":568,"description":27203},[1067,5952,6732],"PaLsI0wBmVUN95jGblrYlv2pYRStOxbk5t7JXS63rtM",{"id":27209,"title":572,"badge":687,"body":27210,"category":543,"description":27662,"extension":856,"links":687,"meta":27663,"navigation":859,"path":573,"seo":27664,"stem":574,"tags":27665,"__hash__":27667},"docs_en/en/2.components/visualization/infinite-grid.md",{"type":689,"value":27211,"toc":27660},[27212],[5728,27213,27219,27631],{":component-files":27214,"component-id":27215,"config":27216,"demo-file":27217,"dependencies":27218},"[\"InfiniteGrid.vue\", \"InfiniteGridClass.ts\", \"DisposalManager.ts\", \"EventHandler.ts\", \"GridManager.ts\", \"PostProcessShader.ts\", \"createTexture.ts\", \"shaders.ts\", \"types.ts\"]","infinite-grid","InfiniteGridConfig","InfiniteGridDemo.vue","ogl gsap",[3549,27220,27221,27223,27278,27284,27464,27466,27472,27581,27583,27585],{"v-slot:api":613},[882,27222,5856],{"id":5855},[5858,27224,27225,27237],{},[5861,27226,27227],{},[5864,27228,27229,27231,27233,27235],{},[5867,27230,5869],{},[5867,27232,5872],{},[5867,27234,5875],{},[5867,27236,5878],{},[5880,27238,27239,27260],{},[5864,27240,27241,27246,27251,27255],{},[5885,27242,27243],{},[894,27244,27245],{},"cardData",[5885,27247,27248],{},[894,27249,27250],{},"CardData[]",[5885,27252,27253],{},[894,27254,3932],{},[5885,27256,27257,27258,880],{},"Data for every tile shown in the grid. ",[702,27259,9105],{},[5864,27261,27262,27266,27271,27275],{},[5885,27263,27264],{},[894,27265,19397],{},[5885,27267,27268],{},[894,27269,27270],{},"Partial\u003CInfiniteGridOptions>",[5885,27272,27273],{},[894,27274,19407],{},[5885,27276,27277],{},"Optional overrides for layout, camera, and post-processing (see table below).",[728,27279,27281],{"id":27280},"infinitegridoptions",[894,27282,27283],{},"InfiniteGridOptions",[5858,27285,27286,27299],{},[5861,27287,27288],{},[5864,27289,27290,27293,27295,27297],{},[5867,27291,27292],{},"Option",[5867,27294,5872],{},[5867,27296,5875],{},[5867,27298,5878],{},[5880,27300,27301,27319,27337,27354,27373,27391,27409,27428,27446],{},[5864,27302,27303,27308,27312,27316],{},[5885,27304,27305],{},[894,27306,27307],{},"gridCols",[5885,27309,27310],{},[894,27311,6016],{},[5885,27313,27314],{},[894,27315,6236],{},[5885,27317,27318],{},"Grid Columns .",[5864,27320,27321,27326,27330,27334],{},[5885,27322,27323],{},[894,27324,27325],{},"gridRows",[5885,27327,27328],{},[894,27329,6016],{},[5885,27331,27332],{},[894,27333,6236],{},[5885,27335,27336],{},"Grid Rows .",[5864,27338,27339,27343,27347,27351],{},[5885,27340,27341],{},[894,27342,6594],{},[5885,27344,27345],{},[894,27346,6016],{},[5885,27348,27349],{},[894,27350,6157],{},[5885,27352,27353],{},"Gap between squares.",[5864,27355,27356,27361,27365,27370],{},[5885,27357,27358],{},[894,27359,27360],{},"tileSize",[5885,27362,27363],{},[894,27364,6016],{},[5885,27366,27367],{},[894,27368,27369],{},"2.4",[5885,27371,27372],{},"Tile size (OGL units).",[5864,27374,27375,27380,27384,27388],{},[5885,27376,27377],{},[894,27378,27379],{},"baseCameraZ",[5885,27381,27382],{},[894,27383,6016],{},[5885,27385,27386],{},[894,27387,8850],{},[5885,27389,27390],{},"Starting Z-distance of the camera.",[5864,27392,27393,27398,27402,27406],{},[5885,27394,27395],{},[894,27396,27397],{},"enablePostProcessing",[5885,27399,27400],{},[894,27401,5914],{},[5885,27403,27404],{},[894,27405,5919],{},[5885,27407,27408],{},"Toggle the post-processing pipeline.",[5864,27410,27411,27416,27420,27425],{},[5885,27412,27413],{},[894,27414,27415],{},"postProcessParams.distortionIntensity",[5885,27417,27418],{},[894,27419,6016],{},[5885,27421,27422],{},[894,27423,27424],{},"-0.2",[5885,27426,27427],{},"Barrel / pincushion distortion strength (0 = none).",[5864,27429,27430,27435,27439,27443],{},[5885,27431,27432],{},[894,27433,27434],{},"postProcessParams.vignetteOffset",[5885,27436,27437],{},[894,27438,6016],{},[5885,27440,27441],{},[894,27442,9450],{},[5885,27444,27445],{},"Vignette offset; higher ⇒ smaller clear area.",[5864,27447,27448,27453,27457,27461],{},[5885,27449,27450],{},[894,27451,27452],{},"postProcessParams.vignetteDarkness",[5885,27454,27455],{},[894,27456,6016],{},[5885,27458,27459],{},[894,27460,9450],{},[5885,27462,27463],{},"Vignette darkness; higher ⇒ darker edges.",[2973,27465],{},[728,27467,27469],{"id":27468},"carddata",[894,27470,27471],{},"CardData",[5858,27473,27474,27486],{},[5861,27475,27476],{},[5864,27477,27478,27480,27482,27484],{},[5867,27479,15492],{},[5867,27481,5872],{},[5867,27483,9105],{},[5867,27485,5878],{},[5880,27487,27488,27503,27519,27534,27550,27566],{},[5864,27489,27490,27494,27498,27500],{},[5885,27491,27492],{},[894,27493,4382],{},[5885,27495,27496],{},[894,27497,5894],{},[5885,27499,11103],{},[5885,27501,27502],{},"Main heading text.",[5864,27504,27505,27510,27514,27516],{},[5885,27506,27507],{},[894,27508,27509],{},"badge",[5885,27511,27512],{},[894,27513,5894],{},[5885,27515,11103],{},[5885,27517,27518],{},"Badge label (render logic can be customised).",[5864,27520,27521,27525,27529,27531],{},[5885,27522,27523],{},[894,27524,4385],{},[5885,27526,27527],{},[894,27528,5894],{},[5885,27530,19942],{},[5885,27532,27533],{},"Longer body text.",[5864,27535,27536,27541,27545,27547],{},[5885,27537,27538],{},[894,27539,27540],{},"tags",[5885,27542,27543],{},[894,27544,9806],{},[5885,27546,11103],{},[5885,27548,27549],{},"Tag pills rendered at the bottom.",[5864,27551,27552,27557,27561,27563],{},[5885,27553,27554],{},[894,27555,27556],{},"date",[5885,27558,27559],{},[894,27560,5894],{},[5885,27562,11103],{},[5885,27564,27565],{},"Date string shown bottom-right.",[5864,27567,27568,27572,27576,27578],{},[5885,27569,27570],{},[894,27571,22529],{},[5885,27573,27574],{},[894,27575,5894],{},[5885,27577,19942],{},[5885,27579,27580],{},"URL for the tile's background image.",[2973,27582],{},[882,27584,10384],{"id":10383},[5858,27586,27587,27597],{},[5861,27588,27589],{},[5864,27590,27591,27593,27595],{},[5867,27592,10393],{},[5867,27594,14963],{},[5867,27596,5878],{},[5880,27598,27599,27619],{},[5864,27600,27601,27606,27611],{},[5885,27602,27603],{},[894,27604,27605],{},"tileClicked",[5885,27607,27608],{},[894,27609,27610],{},"{ card: CardData, index: number }",[5885,27612,27613,27614,27616,27617,880],{},"Fired whenever a tile is clicked/tapped. The payload contains the clicked ",[894,27615,27471],{}," object and its zero-based ",[894,27618,11096],{},[5864,27620,27621,27626,27628],{},[5885,27622,27623],{},[894,27624,27625],{},"onTileLoaded",[5885,27627,5899],{},[5885,27629,27630],{},"Fired when all the images are loaded inside the tile.",[3549,27632,27633],{"v-slot:credits":613},[751,27634,27635,27642,27655],{},[754,27636,6176,27637],{},[696,27638,27641],{"href":27639,"rel":27640},"https://phantom.land",[700],"Phantom Land",[754,27643,27644,27645,27649,27650,27654],{},"Special thanks to ",[696,27646,27648],{"href":26051,"rel":27647},[700],"Safak Dinc"," for the idea and for granting permission to include it here. You can find the original repository at ",[696,27651,27215],{"href":27652,"rel":27653},"https://github.com/safakdinc/infinite-grid",[700],". Your contribution is greatly appreciated!",[754,27656,5929,27657,5941],{},[696,27658,6869],{"href":6867,"rel":27659},[700],{"title":613,"searchDepth":847,"depth":847,"links":27661},[],"A high-performance, interactive 3D infinite grid component built with OGL as seen on phantom.land",{},{"title":572,"description":27662},[1067,5952,27666,6991,7023],"phantom-land","Anit9gaSRU_fXZ1jOWz1_pNz_5sfp3glshs9hEaazSA",{"id":27669,"title":576,"badge":687,"body":27670,"category":543,"description":27732,"extension":856,"links":687,"meta":27733,"navigation":859,"path":577,"seo":27734,"stem":578,"tags":27735,"__hash__":27736},"docs_en/en/2.components/visualization/light-speed.md",{"type":689,"value":27671,"toc":27730},[27672],[5728,27673,27678,27719],{":component-files":27674,"component-id":27675,"config":27676,"demo-file":27677,"dependencies":6200},"[\"LightSpeed.vue\", \"LightSpeedApp.ts\", \"presets.ts\", \"shaders.ts\"]","light-speed","LightSpeedConfig","LightSpeedDemo.vue",[3549,27679,27680,27682],{"v-slot:api":613},[882,27681,5856],{"id":5855},[5858,27683,27684,27696],{},[5861,27685,27686],{},[5864,27687,27688,27690,27692,27694],{},[5867,27689,5869],{},[5867,27691,5872],{},[5867,27693,5875],{},[5867,27695,5878],{},[5880,27697,27698],{},[5864,27699,27700,27705,27710,27716],{},[5885,27701,27702],{},[894,27703,27704],{},"effectOptions",[5885,27706,27707],{},[894,27708,27709],{},"Partial\u003CLightSpeedOptions>",[5885,27711,27712,27713],{},"See ",[894,27714,27715],{},"defaultOptions",[5885,27717,27718],{},"Configuration object to customize road, lights, distortion, speed, and colors.",[3549,27720,27721],{"v-slot:credits":613},[751,27722,27723],{},[754,27724,27725,27726],{},"Ported to Vue from ",[696,27727,12566],{"href":27728,"rel":27729},"https://tympanus.net/codrops/2019/11/13/high-speed-light-trails-in-three-js/",[700],{"title":613,"searchDepth":847,"depth":847,"links":27731},[],"A highly customizable 3D highway speed visual effect built with Three.js, featuring animated road, cars, lights, and distortion effects for immersive motion simulation.",{},{"title":576,"description":27732},[1067,5952,6188,12573],"j4aCbS-uktaukSEXaWCo-6WX_hbBYGEw-3MSmoS-ZYk",{"id":27738,"title":580,"badge":687,"body":27739,"category":543,"description":28060,"extension":856,"links":687,"meta":28061,"navigation":859,"path":581,"seo":28062,"stem":582,"tags":28063,"__hash__":28065},"docs_en/en/2.components/visualization/liquid-glass.md",{"type":689,"value":27740,"toc":28058},[27741,28047],[5728,27742,27747,28040],{":component-files":27743,"component-id":27744,"config":27745,"demo-file":27746},"[\"LiquidGlass.vue\"]","liquid-glass","LiquidGlassConfig","LiquidGlassDemo.vue",[3549,27748,27749,27751],{"v-slot:api":613},[882,27750,5856],{"id":5855},[5858,27752,27753,27765],{},[5861,27754,27755],{},[5864,27756,27757,27759,27761,27763],{},[5867,27758,5869],{},[5867,27760,5872],{},[5867,27762,5875],{},[5867,27764,5878],{},[5880,27766,27767,27785,27803,27821,27840,27860,27879,27898,27916,27934,27952,27970,27988,28006,28023],{},[5864,27768,27769,27773,27777,27782],{},[5885,27770,27771],{},[894,27772,15995],{},[5885,27774,27775],{},[894,27776,6016],{},[5885,27778,27779],{},[894,27780,27781],{},"16",[5885,27783,27784],{},"Border radius for the glass container corners (in pixels).",[5864,27786,27787,27791,27795,27800],{},[5885,27788,27789],{},[894,27790,21433],{},[5885,27792,27793],{},[894,27794,6016],{},[5885,27796,27797],{},[894,27798,27799],{},"0.07",[5885,27801,27802],{},"Relative border thickness affecting displacement filter inner margin.",[5864,27804,27805,27810,27814,27818],{},[5885,27806,27807],{},[894,27808,27809],{},"lightness",[5885,27811,27812],{},[894,27813,6016],{},[5885,27815,27816],{},[894,27817,6021],{},[5885,27819,27820],{},"Lightness (0-100) of the overlay color in HSL scale.",[5864,27822,27823,27828,27832,27837],{},[5885,27824,27825],{},[894,27826,27827],{},"blend",[5885,27829,27830],{},[894,27831,5894],{},[5885,27833,27834],{},[894,27835,27836],{},"\"difference\"",[5885,27838,27839],{},"CSS blend mode used between red and blue displacement layers for the distortion effect.",[5864,27841,27842,27847,27852,27857],{},[5885,27843,27844],{},[894,27845,27846],{},"xChannel",[5885,27848,27849],{},[894,27850,27851],{},"\"R\" | \"G\" | \"B\"",[5885,27853,27854],{},[894,27855,27856],{},"\"R\"",[5885,27858,27859],{},"Channel from displacement image to use for horizontal displacement.",[5864,27861,27862,27867,27871,27876],{},[5885,27863,27864],{},[894,27865,27866],{},"yChannel",[5885,27868,27869],{},[894,27870,27851],{},[5885,27872,27873],{},[894,27874,27875],{},"\"B\"",[5885,27877,27878],{},"Channel from displacement image to use for vertical displacement.",[5864,27880,27881,27886,27890,27895],{},[5885,27882,27883],{},[894,27884,27885],{},"alpha",[5885,27887,27888],{},[894,27889,6016],{},[5885,27891,27892],{},[894,27893,27894],{},"0.93",[5885,27896,27897],{},"Alpha transparency of the overlay color (0-1).",[5864,27899,27900,27904,27908,27913],{},[5885,27901,27902],{},[894,27903,6148],{},[5885,27905,27906],{},[894,27907,6016],{},[5885,27909,27910],{},[894,27911,27912],{},"11",[5885,27914,27915],{},"Gaussian blur radius applied to the overlay.",[5864,27917,27918,27923,27927,27931],{},[5885,27919,27920],{},[894,27921,27922],{},"rOffset",[5885,27924,27925],{},[894,27926,6016],{},[5885,27928,27929],{},[894,27930,6157],{},[5885,27932,27933],{},"Additional scale offset for red displacement map.",[5864,27935,27936,27941,27945,27949],{},[5885,27937,27938],{},[894,27939,27940],{},"gOffset",[5885,27942,27943],{},[894,27944,6016],{},[5885,27946,27947],{},[894,27948,8850],{},[5885,27950,27951],{},"Additional scale offset for green displacement map.",[5864,27953,27954,27959,27963,27967],{},[5885,27955,27956],{},[894,27957,27958],{},"bOffset",[5885,27960,27961],{},[894,27962,6016],{},[5885,27964,27965],{},[894,27966,12032],{},[5885,27968,27969],{},"Additional scale offset for blue displacement map.",[5864,27971,27972,27976,27980,27985],{},[5885,27973,27974],{},[894,27975,16623],{},[5885,27977,27978],{},[894,27979,6016],{},[5885,27981,27982],{},[894,27983,27984],{},"-180",[5885,27986,27987],{},"Base scale factor for displacement effects, combined with individual channel offsets.",[5864,27989,27990,27995,27999,28003],{},[5885,27991,27992],{},[894,27993,27994],{},"frost",[5885,27996,27997],{},[894,27998,6016],{},[5885,28000,28001],{},[894,28002,8518],{},[5885,28004,28005],{},"Opacity factor controlling the frosted glass background overlay strength.",[5864,28007,28008,28012,28016,28020],{},[5885,28009,28010],{},[894,28011,5889],{},[5885,28013,28014],{},[894,28015,5894],{},[5885,28017,28018],{},[894,28019,6077],{},[5885,28021,28022],{},"Additional CSS classes applied to the inner slot container wrapping content.",[5864,28024,28025,28029,28033,28037],{},[5885,28026,28027],{},[894,28028,9370],{},[5885,28030,28031],{},[894,28032,5894],{},[5885,28034,28035],{},[894,28036,6077],{},[5885,28038,28039],{},"Additional CSS classes applied to the outer container div.",[3549,28041,28042],{"v-slot:credits":613},[751,28043,28044],{},[754,28045,28046],{},"Inspired by Apple Liquid Glass.",[870,28048,28049,28052,28055],{},[692,28050,28051],{},"This component uses SVG filters, for backdrop blur. These are not supported in Safari and have very limited support in Firefox.",[692,28053,28054],{},"It is recommended to use this component when you are targeting Chromium based browsers, and use a fallback component in case user is on Safari or Firefox.",[692,28056,28057],{},"For example, Inspira UI landing page, uses Liquid Glass component on Chromium based browsers but fallback to Frosted Glass effect on Safari and Mozilla.",{"title":613,"searchDepth":847,"depth":847,"links":28059},[],"A visually striking glassmorphism effect using SVG displacement filters similar to Apple Liquid Glass.",{},{"title":580,"description":28060},[1067,5952,28064,6876],"apple","JGYbfMiniVlCnN71HL2YB--Rc3NukYLPNZtt2vnSgsw",{"id":28067,"title":584,"badge":687,"body":28068,"category":543,"description":28256,"extension":856,"links":687,"meta":28257,"navigation":859,"path":585,"seo":28258,"stem":586,"tags":28259,"__hash__":28261},"docs_en/en/2.components/visualization/liquid-logo.md",{"type":689,"value":28069,"toc":28254},[28070],[5728,28071,28076,28239],{":component-files":28072,"component-id":28073,"config":28074,"demo-file":28075},"[\"LiquidLogo.vue\", \"parseLogoImage.ts\", \"shader.ts\"]","liquid-logo","LiquidLogoConfig","LiquidLogoDemo.vue",[3549,28077,28078,28080],{"v-slot:api":613},[882,28079,5856],{"id":5855},[5858,28081,28082,28094],{},[5861,28083,28084],{},[5864,28085,28086,28088,28090,28092],{},[5867,28087,5869],{},[5867,28089,5872],{},[5867,28091,5875],{},[5867,28093,5878],{},[5880,28095,28096,28112,28129,28147,28166,28185,28204,28222],{},[5864,28097,28098,28102,28106,28110],{},[5885,28099,28100],{},[894,28101,5889],{},[5885,28103,28104],{},[894,28105,5894],{},[5885,28107,28108],{},[894,28109,6077],{},[5885,28111,6962],{},[5864,28113,28114,28118,28122,28126],{},[5885,28115,28116],{},[894,28117,11554],{},[5885,28119,28120],{},[894,28121,5894],{},[5885,28123,28124],{},[894,28125,6077],{},[5885,28127,28128],{},"URL of the image to apply the liquid effect.",[5864,28130,28131,28136,28140,28144],{},[5885,28132,28133],{},[894,28134,28135],{},"patternScale",[5885,28137,28138],{},[894,28139,6016],{},[5885,28141,28142],{},[894,28143,7938],{},[5885,28145,28146],{},"Scale of the distortion pattern.",[5864,28148,28149,28154,28158,28163],{},[5885,28150,28151],{},[894,28152,28153],{},"refraction",[5885,28155,28156],{},[894,28157,6016],{},[5885,28159,28160],{},[894,28161,28162],{},"0.015",[5885,28164,28165],{},"Amount of refraction applied to the image.",[5864,28167,28168,28173,28177,28182],{},[5885,28169,28170],{},[894,28171,28172],{},"edge",[5885,28174,28175],{},[894,28176,6016],{},[5885,28178,28179],{},[894,28180,28181],{},"0.4",[5885,28183,28184],{},"Sharpness of the edge effect.",[5864,28186,28187,28192,28196,28201],{},[5885,28188,28189],{},[894,28190,28191],{},"patternBlur",[5885,28193,28194],{},[894,28195,6016],{},[5885,28197,28198],{},[894,28199,28200],{},"0.005",[5885,28202,28203],{},"Blur effect applied to the pattern.",[5864,28205,28206,28211,28215,28219],{},[5885,28207,28208],{},[894,28209,28210],{},"liquid",[5885,28212,28213],{},[894,28214,6016],{},[5885,28216,28217],{},[894,28218,27799],{},[5885,28220,28221],{},"Intensity of the liquid animation.",[5864,28223,28224,28228,28232,28236],{},[5885,28225,28226],{},[894,28227,7577],{},[5885,28229,28230],{},[894,28231,6016],{},[5885,28233,28234],{},[894,28235,6350],{},[5885,28237,28238],{},"Animation speed of the liquid effect.",[3549,28240,28241],{"v-slot:credits":613},[751,28242,28243,28246],{},[754,28244,28245],{},"Inspired by the Apple Fluid Motion design.",[754,28247,28248,28249,880],{},"Ported and enhaced from ",[696,28250,28253],{"href":28251,"rel":28252},"https://github.com/paper-design/liquid-logo",[700],"Paper Design Concept",{"title":613,"searchDepth":847,"depth":847,"links":28255},[],"An advanced WebGL-based component that applies a dynamic, liquid effect to logos or images using custom shaders.",{},{"title":584,"description":28256},[1067,5952,7023,28260],"paper","f8E64tnzPX0DT8e3-rFeoyUamO0nC_v3TyYO4Umu5qs",{"id":28263,"title":588,"badge":687,"body":28264,"category":543,"description":28356,"extension":856,"links":687,"meta":28357,"navigation":859,"path":589,"seo":28358,"stem":590,"tags":28359,"__hash__":28360},"docs_en/en/2.components/visualization/logo-cloud.md",{"type":689,"value":28265,"toc":28354},[28266],[5728,28267,28272,28345],{":component-files":28268,"component-id":28269,"config":28270,"demo-file":28271},"[\"AnimatedLogoCloud.vue\", \"IconLogoCloud.vue\", \"StaticLogoCloud.vue\", \"index.ts\"]","logo-cloud","IconLogoCloudConfig","IconLogoCloudDemo.vue",[3549,28273,28274,28276],{"v-slot:api":613},[882,28275,5856],{"id":5855},[5858,28277,28278,28290],{},[5861,28279,28280],{},[5864,28281,28282,28284,28286,28288],{},[5867,28283,5869],{},[5867,28285,5872],{},[5867,28287,5875],{},[5867,28289,5878],{},[5880,28291,28292,28308,28326],{},[5864,28293,28294,28298,28302,28306],{},[5885,28295,28296],{},[894,28297,5889],{},[5885,28299,28300],{},[894,28301,5894],{},[5885,28303,28304],{},[894,28305,5899],{},[5885,28307,14836],{},[5864,28309,28310,28314,28318,28323],{},[5885,28311,28312],{},[894,28313,4382],{},[5885,28315,28316],{},[894,28317,5894],{},[5885,28319,28320],{},[894,28321,28322],{},"Trusted by Companies like",[5885,28324,28325],{},"Title of animated logs.",[5864,28327,28328,28333,28337,28342],{},[5885,28329,28330],{},[894,28331,28332],{},"logos",[5885,28334,28335],{},[894,28336,3932],{},[5885,28338,28339],{},[894,28340,28341],{},"[{name: \"\", path: \"\"}]",[5885,28343,28344],{},"Array of items(logos) with name & path fields.",[3549,28346,28347],{"v-slot:credits":613},[751,28348,28349],{},[754,28350,5929,28351,6725],{},[696,28352,5940],{"href":5938,"rel":28353},[700],{"title":613,"searchDepth":847,"depth":847,"links":28355},[],"Animated company cloud logs. Usually we can use to show company logos.",{},{"title":588,"description":28356},[1067,5952],"sLsuBaVIJBXm21Ru0c2inZ8NW8pC3qzCMCXQr8ax870",{"id":28362,"title":592,"badge":687,"body":28363,"category":543,"description":28455,"extension":856,"links":687,"meta":28456,"navigation":859,"path":593,"seo":28457,"stem":594,"tags":28458,"__hash__":28460},"docs_en/en/2.components/visualization/logo-origami.md",{"type":689,"value":28364,"toc":28453},[28365],[5728,28366,28371,28442],{":component-files":28367,"component-id":28368,"config":28369,"demo-file":28370},"[\"LogoOrigami.vue\", \"LogoOrigamiItem.vue\"]","logo-origami","LogoOrigamiConfig","LogoOrigamiDemo.vue",[3549,28372,28373,28375],{"v-slot:api":613},[882,28374,5856],{"id":5855},[5858,28376,28377,28389],{},[5861,28378,28379],{},[5864,28380,28381,28383,28385,28387],{},[5867,28382,5869],{},[5867,28384,5872],{},[5867,28386,5875],{},[5867,28388,5878],{},[5880,28390,28391,28407,28424],{},[5864,28392,28393,28397,28401,28405],{},[5885,28394,28395],{},[894,28396,5889],{},[5885,28398,28399],{},[894,28400,5894],{},[5885,28402,28403],{},[894,28404,6077],{},[5885,28406,6962],{},[5864,28408,28409,28413,28417,28421],{},[5885,28410,28411],{},[894,28412,6933],{},[5885,28414,28415],{},[894,28416,6016],{},[5885,28418,28419],{},[894,28420,9469],{},[5885,28422,28423],{},"Duration of the flip animation in seconds.",[5864,28425,28426,28430,28434,28439],{},[5885,28427,28428],{},[894,28429,6914],{},[5885,28431,28432],{},[894,28433,6016],{},[5885,28435,28436],{},[894,28437,28438],{},"2.5",[5885,28440,28441],{},"Delay between flip animations in seconds.",[3549,28443,28444],{"v-slot:credits":613},[751,28445,28446],{},[754,28447,28448,28449],{},"Inspired by origami animations and flip effects at ",[696,28450,28452],{"href":28451},"www.hover.dev/components/other#logo-origami","hover.dev",{"title":613,"searchDepth":847,"depth":847,"links":28454},[],"Animated flipping logo with origami effect.",{},{"title":592,"description":28455},[1067,5952,28459],"hover-dev","ZfA_-Hz5RcMp-dC-MasibC-DUG2IIargETRabtqhdgM",{"id":28462,"title":596,"badge":687,"body":28463,"category":543,"description":28601,"extension":856,"links":687,"meta":28602,"navigation":859,"path":597,"seo":28603,"stem":598,"tags":28604,"__hash__":28605},"docs_en/en/2.components/visualization/orbit.md",{"type":689,"value":28464,"toc":28599},[28465],[5728,28466,28471,28584],{":component-files":28467,"component-id":28468,"config":28469,"demo-file":28470},"[\"Orbit.vue\", \"index.ts\"]","orbit","OrbitConfig","OrbitDemo.vue",[3549,28472,28473,28475],{"v-slot:api":613},[882,28474,5856],{"id":5855},[5858,28476,28477,28489],{},[5861,28478,28479],{},[5864,28480,28481,28483,28485,28487],{},[5867,28482,5869],{},[5867,28484,5872],{},[5867,28486,5875],{},[5867,28488,5878],{},[5880,28490,28491,28511,28529,28546,28563],{},[5864,28492,28493,28497,28504,28508],{},[5885,28494,28495],{},[894,28496,7459],{},[5885,28498,28499,7464,28502],{},[894,28500,28501],{},"normal",[894,28503,17689],{},[5885,28505,28506],{},[894,28507,28501],{},[5885,28509,28510],{},"The direction of the orbit. You can use the constant ORBIT_DIRECTION.",[5864,28512,28513,28517,28522,28526],{},[5885,28514,28515],{},[894,28516,6933],{},[5885,28518,28519],{},[894,28520,28521],{},"?number",[5885,28523,28524],{},[894,28525,12032],{},[5885,28527,28528],{},"The duration of the orbit animation in seconds.",[5864,28530,28531,28535,28539,28543],{},[5885,28532,28533],{},[894,28534,6914],{},[5885,28536,28537],{},[894,28538,28521],{},[5885,28540,28541],{},[894,28542,8850],{},[5885,28544,28545],{},"Delay in seconds before the animation starts.",[5864,28547,28548,28552,28556,28560],{},[5885,28549,28550],{},[894,28551,15995],{},[5885,28553,28554],{},[894,28555,28521],{},[5885,28557,28558],{},[894,28559,6021],{},[5885,28561,28562],{},"Radius of the orbit path in pixels.",[5864,28564,28565,28570,28575,28579],{},[5885,28566,28567],{},[894,28568,28569],{},"path",[5885,28571,28572],{},[894,28573,28574],{},"?boolean",[5885,28576,28577],{},[894,28578,7446],{},[5885,28580,28581,28582,880],{},"Displays a circle path for the orbit if ",[894,28583,5919],{},[3549,28585,28586],{"v-slot:credits":613},[751,28587,28588,28594],{},[754,28589,6857,28590,880],{},[696,28591,725],{"href":28592,"rel":28593},"https://magicui.design/docs/components/orbiting-circles",[700],[754,28595,5929,28596,7828],{},[696,28597,7637],{"href":7635,"rel":28598},[700],{"title":613,"searchDepth":847,"depth":847,"links":28600},[],"A component that animates content in a circular orbit, with customizable duration, delay, and radius. It also offers an optional orbit path display.",{},{"title":596,"description":28601},[1067,5952,6732],"oWQ_OGAky0bQ9vEQnPO4aQ_-OK8U0EFAXqWU7PAJ8C0",{"id":28607,"title":600,"badge":687,"body":28608,"category":543,"description":28880,"extension":856,"links":687,"meta":28881,"navigation":859,"path":601,"seo":28882,"stem":602,"tags":28883,"__hash__":28884},"docs_en/en/2.components/visualization/spline.md",{"type":689,"value":28609,"toc":28878},[28610],[5728,28611,28617,28868],{":component-files":28612,"component-id":28613,"config":28614,"demo-file":28615,"dependencies":28616},"[\"Spline.vue\", \"ParentSize.vue\"]","spline","SplineConfig","SplineDemo.vue","@splinetool/runtime",[3549,28618,28619,28621,28709,28713],{"v-slot:api":613},[882,28620,5856],{"id":5855},[5858,28622,28623,28635],{},[5861,28624,28625],{},[5864,28626,28627,28629,28631,28633],{},[5867,28628,5869],{},[5867,28630,5872],{},[5867,28632,5875],{},[5867,28634,5878],{},[5880,28636,28637,28655,28674,28692],{},[5864,28638,28639,28644,28648,28650],{},[5885,28640,28641],{},[894,28642,28643],{},"scene",[5885,28645,28646],{},[894,28647,5894],{},[5885,28649,7124],{},[5885,28651,28652,28653,880],{},"The URL or path to the Spline scene file. ",[702,28654,9105],{},[5864,28656,28657,28662,28667,28671],{},[5885,28658,28659],{},[894,28660,28661],{},"onLoad",[5885,28663,28664],{},[894,28665,28666],{},"Function",[5885,28668,28669],{},[894,28670,7766],{},[5885,28672,28673],{},"Callback that fires when the Spline scene loads successfully.",[5864,28675,28676,28681,28685,28689],{},[5885,28677,28678],{},[894,28679,28680],{},"renderOnDemand",[5885,28682,28683],{},[894,28684,5914],{},[5885,28686,28687],{},[894,28688,5919],{},[5885,28690,28691],{},"Enables or disables Spline's render-on-demand optimization.",[5864,28693,28694,28698,28702,28706],{},[5885,28695,28696],{},[894,28697,2836],{},[5885,28699,28700],{},[894,28701,12403],{},[5885,28703,28704],{},[894,28705,19407],{},[5885,28707,28708],{},"Custom CSS style applied to the container of the canvas.",[692,28710,28711],{},[702,28712,10384],{},[5858,28714,28715,28725],{},[5861,28716,28717],{},[5864,28718,28719,28721,28723],{},[5867,28720,10393],{},[5867,28722,14963],{},[5867,28724,5878],{},[5880,28726,28727,28742,28756,28770,28784,28798,28812,28826,28840,28854],{},[5864,28728,28729,28734,28739],{},[5885,28730,28731],{},[894,28732,28733],{},"error",[5885,28735,28736],{},[894,28737,28738],{},"Error",[5885,28740,28741],{},"Emits if there's an error while loading the Spline scene.",[5864,28743,28744,28749,28753],{},[5885,28745,28746],{},[894,28747,28748],{},"spline-mouse-down",[5885,28750,28751],{},[894,28752,9915],{},[5885,28754,28755],{},"Emits when a mouseDown event is detected in the Spline scene.",[5864,28757,28758,28763,28767],{},[5885,28759,28760],{},[894,28761,28762],{},"spline-mouse-up",[5885,28764,28765],{},[894,28766,9915],{},[5885,28768,28769],{},"Emits when a mouseUp event is detected in the Spline scene.",[5864,28771,28772,28777,28781],{},[5885,28773,28774],{},[894,28775,28776],{},"spline-mouse-hover",[5885,28778,28779],{},[894,28780,9915],{},[5885,28782,28783],{},"Emits when the mouseHover event is triggered.",[5864,28785,28786,28791,28795],{},[5885,28787,28788],{},[894,28789,28790],{},"spline-key-down",[5885,28792,28793],{},[894,28794,9915],{},[5885,28796,28797],{},"Emits on keyDown within the Spline scene.",[5864,28799,28800,28805,28809],{},[5885,28801,28802],{},[894,28803,28804],{},"spline-key-up",[5885,28806,28807],{},[894,28808,9915],{},[5885,28810,28811],{},"Emits on keyUp within the Spline scene.",[5864,28813,28814,28819,28823],{},[5885,28815,28816],{},[894,28817,28818],{},"spline-start",[5885,28820,28821],{},[894,28822,9915],{},[5885,28824,28825],{},"Emits when the Spline scene starts.",[5864,28827,28828,28833,28837],{},[5885,28829,28830],{},[894,28831,28832],{},"spline-look-at",[5885,28834,28835],{},[894,28836,9915],{},[5885,28838,28839],{},"Emits when a lookAt event occurs.",[5864,28841,28842,28847,28851],{},[5885,28843,28844],{},[894,28845,28846],{},"spline-follow",[5885,28848,28849],{},[894,28850,9915],{},[5885,28852,28853],{},"Emits when a follow event occurs.",[5864,28855,28856,28861,28865],{},[5885,28857,28858],{},[894,28859,28860],{},"spline-scroll",[5885,28862,28863],{},[894,28864,9915],{},[5885,28866,28867],{},"Emits on scroll interactions.",[3549,28869,28870],{"v-slot:credits":613},[751,28871,28872,28875],{},[754,28873,28874],{},"Utilizes Spline’s runtime behind the scenes.",[754,28876,28877],{},"Inspired by various 3D web experiences using Spline.",{"title":613,"searchDepth":847,"depth":847,"links":28879},[],"A Vue wrapper component for the Spline 3D tool, providing events and auto-resizing.",{},{"title":600,"description":28880},[1067,5952,28613],"WNMuDIA79756fAOrVqnjmx8s-RaG6JPmD1aQsPKmXhI",{"id":28886,"title":604,"badge":687,"body":28887,"category":543,"description":29021,"extension":856,"links":687,"meta":29022,"navigation":859,"path":605,"seo":29023,"stem":606,"tags":29024,"__hash__":29025},"docs_en/en/2.components/visualization/world-map.md",{"type":689,"value":28888,"toc":29019},[28889],[5728,28890,28896,29006],{":component-files":28891,"component-id":28892,"config":28893,"demo-file":28894,"dependencies":28895},"[\"WorldMap.vue\"]","world-map","WorldMapConfig","WorldMapDemo.vue","dotted-map",[3549,28897,28898,28900],{"v-slot:api":613},[882,28899,5856],{"id":5855},[5858,28901,28902,28914],{},[5861,28903,28904],{},[5864,28905,28906,28908,28910,28912],{},[5867,28907,5869],{},[5867,28909,5872],{},[5867,28911,5875],{},[5867,28913,5878],{},[5880,28915,28916,28935,28951,28970,28988],{},[5864,28917,28918,28923,28928,28932],{},[5885,28919,28920],{},[894,28921,28922],{},"dots",[5885,28924,28925],{},[894,28926,28927],{},"Array\u003C{ start: { lat: number; lng: number; label?: string }, end: { lat: number; lng: number; label?: string } }> ",[5885,28929,28930],{},[894,28931,3932],{},[5885,28933,28934],{},"Array of dot objects, each containing a start and end coordinate (latitude, longitude).",[5864,28936,28937,28941,28945,28949],{},[5885,28938,28939],{},[894,28940,5889],{},[5885,28942,28943],{},[894,28944,5894],{},[5885,28946,28947],{},[894,28948,6077],{},[5885,28950,6962],{},[5864,28952,28953,28958,28962,28967],{},[5885,28954,28955],{},[894,28956,28957],{},"lineColor",[5885,28959,28960],{},[894,28961,5894],{},[5885,28963,28964],{},[894,28965,28966],{},"\"#0EA5E9\"",[5885,28968,28969],{},"Color of the arcs and dot borders.",[5864,28971,28972,28977,28981,28983],{},[5885,28973,28974],{},[894,28975,28976],{},"mapColor",[5885,28978,28979],{},[894,28980,5894],{},[5885,28982,7124],{},[5885,28984,28985,28986,3796],{},"Main color of the dotted map. (",[702,28987,9105],{},[5864,28989,28990,28995,28999,29001],{},[5885,28991,28992],{},[894,28993,28994],{},"mapBgColor",[5885,28996,28997],{},[894,28998,5894],{},[5885,29000,7124],{},[5885,29002,29003,29004,3796],{},"Background color of the map. (",[702,29005,9105],{},[3549,29007,29008],{"v-slot:credits":613},[751,29009,29010],{},[754,29011,29012,29013,880],{},"Ported from (World Map by Aceternity UI)",[934,29014,29015],{},[696,29016,29017],{"href":29017,"rel":29018},"https://ui.aceternity.com/components/world-map",[700],{"title":613,"searchDepth":847,"depth":847,"links":29020},[],"Displays a customizable world map with animated arcs and pulse effects for geographical points.",{},{"title":604,"description":29021},[1067,5952,5954],"hGrhGeE79hnrerwMislGGoll51rDprdxXRFJtnGBsoU",{"id":29027,"title":613,"badge":687,"body":29028,"category":687,"description":613,"extension":856,"links":687,"meta":29032,"navigation":859,"path":614,"seo":29033,"stem":615,"tags":687,"__hash__":29034},"docs_en/en/3.changelogs/all/index.md",{"type":689,"value":29029,"toc":29030},[],{"title":613,"searchDepth":847,"depth":847,"links":29031},[],{},{"description":613},"f40vcSNdAJQk5_o62ykSJ730q46RFqoK-SgH5puTaws",{"id":29036,"title":29037,"badge":687,"body":29038,"category":687,"description":29045,"extension":856,"links":687,"meta":29046,"navigation":136,"path":609,"seo":29047,"stem":29048,"tags":687,"__hash__":29049},"docs_en/en/3.changelogs/index.md","Changelog",{"type":689,"value":29039,"toc":29043},[29040],[29041,29042],"inspira-changelog",{},{"title":613,"searchDepth":847,"depth":847,"links":29044},[],"Major component additions, fixes, and release milestones for Inspira UI.",{},{"title":29037,"description":29045},"en/3.changelogs/index","ABhhy7-YGm2b1EXXE2UZE6BjoP-hklIPRg3oSZ3DdmI",{"id":29051,"title":29052,"badge":11642,"body":29053,"category":687,"description":29361,"extension":856,"links":687,"meta":29362,"navigation":29363,"path":626,"seo":29364,"stem":627,"tags":687,"__hash__":29366},"docs_en/en/4.brand-reports/amorepacific-sustainability-report-2025.md","Amorepacific Sustainability Report 2025",{"type":689,"value":29054,"toc":29348},[29055,29059,29069,29072,29075,29079,29082,29128,29131,29134,29138,29141,29152,29155,29158,29162,29165,29168,29182,29185,29188,29191,29195,29198,29201,29212,29215,29219,29222,29225,29239,29242,29245,29249,29254,29259,29262,29265,29279,29282,29293,29297,29301,29315,29319,29330,29334,29337,29340,29343],[29056,29057,29052],"h1",{"id":29058},"amorepacific-sustainability-report-2025",[692,29060,29061,29062,29065,29066,880],{},"If you are asking ",[702,29063,29064],{},"\"Is Amorepacific actually eco-friendly?\"",", the honest answer is: ",[702,29067,29068],{},"Amorepacific looks stronger on climate leadership than many beauty peers, but the public evidence chain is still less clean and complete than the leaders above it",[692,29070,29071],{},"That distinction is why it lands in the lower half of this Top 10 rather than near the top.",[692,29073,29074],{},"Based on publicly disclosed data, Amorepacific's sustainability case is real. Renewable electricity progress is strong. Circular collection systems exist. Packaging and responsible raw-material work are visible. But the newest public reporting is harder to inspect than it should be, and that weakens external confidence even when the underlying signals are good.",[882,29076,29078],{"id":29077},"the-short-version","The short version",[692,29080,29081],{},"Based on publicly disclosed data, Amorepacific has several important strengths:",[751,29083,29084,29090,29102,29112,29118],{},[754,29085,29086,29087],{},"global operations reportedly reached ",[702,29088,29089],{},"100% renewable electricity",[754,29091,29092,29093,4270,29096,5355,29099],{},"the company achieved ",[894,29094,29095],{},"CDP Climate A",[894,29097,29098],{},"CDP Water A",[894,29100,29101],{},"Supplier Engagement A",[754,29103,29104,29107,29108,29111],{},[894,29105,29106],{},"AMORE:CYCLE"," recovered about ",[702,29109,29110],{},"119 tons"," of empty containers in 2025",[754,29113,29114,29115],{},"container recovery since 2009 reached about ",[702,29116,29117],{},"2,840 tons",[754,29119,29120,29121,29124,29125],{},"about ",[702,29122,29123],{},"93.3%"," of palm-based materials were sourced through ",[894,29126,29127],{},"RSPO Mass Balance",[692,29129,29130],{},"Those are meaningful numbers.",[692,29132,29133],{},"The problem is not that the company lacks progress. The problem is that the latest report path is not presented as cleanly as the stronger-reporting peers in this ranking.",[882,29135,29137],{"id":29136},"resource-efficiency","Resource efficiency",[692,29139,29140],{},"Based on publicly disclosed data, the resource story is credible:",[751,29142,29143,29146,29149],{},[754,29144,29145],{},"empty-container recovery programs are operating at measurable scale",[754,29147,29148],{},"packaging return and collection systems are established rather than purely experimental",[754,29150,29151],{},"palm-based sourcing standards are visible in the disclosure set",[692,29153,29154],{},"This matters because Amorepacific is not trying to build a sustainability case from aesthetics alone. It is showing actual recovery and materials-management systems.",[692,29156,29157],{},"Still, the circularity story feels more programmatic than fully category-shaping. The company has real programs, but not yet the clearest consumer-proof circular beauty model.",[882,29159,29161],{"id":29160},"impact-on-environment","Impact on environment",[692,29163,29164],{},"This is the company's strongest area.",[692,29166,29167],{},"Based on publicly disclosed data, Amorepacific shows:",[751,29169,29170,29175],{},[754,29171,29172,29174],{},[702,29173,29089],{}," across global operations",[754,29176,29177,29178,29181],{},"top-tier ",[894,29179,29180],{},"CDP"," scores in climate and water",[692,29183,29184],{},"That is a serious climate leadership signal in beauty, especially for a large Asian beauty group.",[692,29186,29187],{},"In plain English, Amorepacific looks more credible on operational climate management than many brands that talk louder about sustainability.",[692,29189,29190],{},"The limitation is that climate leadership alone does not automatically prove the rest of the value chain is equally mature.",[882,29192,29194],{"id":29193},"social-responsibility","Social responsibility",[692,29196,29197],{},"Based on publicly disclosed data, the social story is respectable but less differentiated.",[692,29199,29200],{},"The clearest signals come from:",[751,29202,29203,29206,29209],{},[754,29204,29205],{},"management diversity",[754,29207,29208],{},"sourcing standards",[754,29210,29211],{},"supplier-side responsibility structures",[692,29213,29214],{},"That is solid, but it does not carry the same identity-level force as Natura's biodiversity communities or L'Occitane's living-wage narrative. Amorepacific looks more like a well-managed corporate system than a socially distinctive beauty model.",[882,29216,29218],{"id":29217},"economic-benefits","Economic benefits",[692,29220,29221],{},"Amorepacific still scores reasonably well here.",[692,29223,29224],{},"Based on publicly disclosed data, the sustainability strategy supports:",[751,29226,29227,29230,29233,29236],{},[754,29228,29229],{},"premium-brand differentiation",[754,29231,29232],{},"stronger regulatory positioning",[754,29234,29235],{},"lower operational energy risk",[754,29237,29238],{},"better long-run resilience for a global beauty portfolio",[692,29240,29241],{},"This is economically valuable, but there is also a clear limit:",[692,29243,29244],{},"when the public evidence chain is harder to follow, the strategic value becomes harder for external audiences to trust fully.",[882,29246,29248],{"id":29247},"so-is-amorepacific-actually-eco-friendly","So, is Amorepacific actually eco-friendly?",[692,29250,29251],{},[702,29252,29253],{},"More serious on climate and operations than many beauty brands? Yes.",[692,29255,29256],{},[702,29257,29258],{},"As externally transparent and easy to verify as the top-ranked names here? Not yet.",[692,29260,29261],{},"That is the fairest answer.",[692,29263,29264],{},"Based on publicly disclosed data, Amorepacific deserves credit for:",[751,29266,29267,29270,29273,29276],{},[754,29268,29269],{},"very strong operational climate credentials",[754,29271,29272],{},"real packaging recovery programs",[754,29274,29275],{},"visible sourcing discipline",[754,29277,29278],{},"a sustainability strategy that supports premium-brand resilience",[692,29280,29281],{},"It still needs stronger proof on:",[751,29283,29284,29287,29290],{},[754,29285,29286],{},"cleaner public access to the latest report set",[754,29288,29289],{},"clearer circularity scale beyond program highlights",[754,29291,29292],{},"a more differentiated social-impact case",[882,29294,29296],{"id":29295},"editorial-assessment","Editorial Assessment",[728,29298,29300],{"id":29299},"what-amorepacific-does-well","What Amorepacific does well",[751,29302,29303,29306,29309,29312],{},[754,29304,29305],{},"leads credibly on renewable electricity and CDP signals",[754,29307,29308],{},"shows real packaging-return and recovery infrastructure",[754,29310,29311],{},"manages sustainability more seriously than the average beauty company",[754,29313,29314],{},"keeps the strategy aligned with premium-brand economics",[728,29316,29318],{"id":29317},"what-still-needs-stronger-progress","What still needs stronger progress",[751,29320,29321,29324,29327],{},[754,29322,29323],{},"easier public verification of the latest sustainability disclosures",[754,29325,29326],{},"more consumer-legible circularity at scale",[754,29328,29329],{},"stronger social differentiation beyond governance and sourcing controls",[882,29331,29333],{"id":29332},"conclusion","Conclusion",[692,29335,29336],{},"Amorepacific's latest sustainability story is more credible than its rank might first suggest.",[692,29338,29339],{},"The reason it does not place higher is not lack of progress. It is weaker evidence accessibility.",[692,29341,29342],{},"The most important takeaway is simple:",[7129,29344,29345],{},[692,29346,29347],{},"Amorepacific looks like a company doing real sustainability work, but it still needs to present that work in a more transparent and easily inspectable way.",{"title":613,"searchDepth":847,"depth":847,"links":29349},[29350,29351,29352,29353,29354,29355,29356,29360],{"id":29077,"depth":847,"text":29078},{"id":29136,"depth":847,"text":29137},{"id":29160,"depth":847,"text":29161},{"id":29193,"depth":847,"text":29194},{"id":29217,"depth":847,"text":29218},{"id":29247,"depth":847,"text":29248},{"id":29295,"depth":847,"text":29296,"children":29357},[29358,29359],{"id":29299,"depth":850,"text":29300},{"id":29317,"depth":850,"text":29318},{"id":29332,"depth":847,"text":29333},"A plain-English breakdown of Amorepacific's latest sustainability performance across climate leadership, circularity programs, social responsibility, and premium-beauty economics.",{},{"title":625},{"title":29052,"description":29365},"Is Amorepacific actually eco-friendly? A practical reading of Amorepacific's latest sustainability disclosures across renewable electricity, packaging recovery, sourcing, and premium-brand resilience.","6xada7FL61caA-65nylxoJuqilflTwZVw-dNAcAi9mw",{"id":29368,"title":29369,"badge":11642,"body":29370,"category":687,"description":29654,"extension":856,"links":687,"meta":29655,"navigation":29656,"path":630,"seo":29657,"stem":631,"tags":687,"__hash__":29659},"docs_en/en/4.brand-reports/beiersdorf-sustainability-report-2025.md","Beiersdorf Sustainability Report 2025",{"type":689,"value":29371,"toc":29641},[29372,29375,29383,29386,29389,29391,29394,29437,29440,29442,29445,29448,29459,29462,29465,29467,29470,29480,29483,29486,29489,29491,29494,29497,29512,29515,29518,29520,29523,29525,29539,29542,29545,29549,29554,29559,29562,29565,29579,29582,29593,29595,29599,29613,29615,29626,29628,29631,29634,29636],[29056,29373,29369],{"id":29374},"beiersdorf-sustainability-report-2025",[692,29376,29061,29377,29065,29380,880],{},[702,29378,29379],{},"\"Is Beiersdorf actually eco-friendly?\"",[702,29381,29382],{},"Beiersdorf is one of the more rigorous beauty companies on measurable sustainability progress, even if some of its hardest risks are also unusually visible in the report",[692,29384,29385],{},"That is a good sign, not a bad one.",[692,29387,29388],{},"Based on publicly disclosed data, Beiersdorf's 2025 reporting is strong because it does not just present wins. It also exposes water stress, upstream labor risk, and the continued complexity of plastics and chemicals.",[882,29390,29078],{"id":29077},[692,29392,29393],{},"Based on publicly disclosed data, Beiersdorf reported several meaningful results:",[751,29395,29396,29411,29418,29425,29431],{},[754,29397,29398,29399,29402,29403,29406,29407,29410],{},"consumer-business ",[894,29400,29401],{},"Scope 1"," to ",[894,29404,29405],{},"Scope 3"," emissions were down ",[702,29408,29409],{},"33%"," versus 2018",[754,29412,29413,29414,29417],{},"plastic packaging reached ",[702,29415,29416],{},"50%"," recycled or renewable content",[754,29419,29420,29421,29424],{},"more than ",[702,29422,29423],{},"90%"," of packaging is now designed for recyclability",[754,29426,29427,29430],{},[702,29428,29429],{},"10,500"," women shea collectors received training support",[754,29432,29433,29436],{},[702,29434,29435],{},"201"," Indonesian smallholders achieved RSPO certification support",[692,29438,29439],{},"This is a report with real operating substance.",[882,29441,29137],{"id":29136},[692,29443,29444],{},"Beiersdorf performs strongly on the packaging side.",[692,29446,29447],{},"Based on publicly disclosed data:",[751,29449,29450,29454],{},[754,29451,29413,29452,29417],{},[702,29453,29416],{},[754,29455,29420,29456,29458],{},[702,29457,29423],{}," of packaging is designed for recyclability",[692,29460,29461],{},"That makes the resource-efficiency case much stronger than a typical beauty-company packaging refresh.",[692,29463,29464],{},"The main reason this matters is that the company is working on packaging as a system, not just as a design update. If you care about material intensity, recyclability, and regulatory readiness, Beiersdorf looks well ahead of average.",[882,29466,29161],{"id":29160},[692,29468,29469],{},"Based on publicly disclosed data, Beiersdorf's environmental performance is credible:",[751,29471,29472,29477],{},[754,29473,29474,29475,29410],{},"consumer-business absolute emissions were down ",[702,29476,29409],{},[754,29478,29479],{},"plants are adopting water-reduction and closed-loop measures",[692,29481,29482],{},"But this is also where the report gets more realistic.",[692,29484,29485],{},"Beiersdorf openly identifies water stress and upstream chemical exposure as material issues. In other words, the company is making progress while still acknowledging that environmental risk remains structurally real.",[692,29487,29488],{},"That balance makes the report more trustworthy than the usual all-positive corporate narrative.",[882,29490,29194],{"id":29193},[692,29492,29493],{},"This is another area where Beiersdorf performs better than many beauty peers.",[692,29495,29496],{},"Based on publicly disclosed data, the strongest signals are:",[751,29498,29499,29504,29509],{},[754,29500,29501,29503],{},[702,29502,29429],{}," trained women shea collectors",[754,29505,29506,29508],{},[702,29507,29435],{}," RSPO-certified supported smallholders",[754,29510,29511],{},"circularity programs aimed at women in informal waste systems",[692,29513,29514],{},"These are not cosmetic side projects. They show the company is trying to connect ingredient sourcing and circularity with social outcomes on the ground.",[692,29516,29517],{},"That said, the report also makes clear that upstream labor and rights risk still exist in high-risk raw-material chains. The company deserves credit for facing that reality rather than hiding it.",[882,29519,29218],{"id":29217},[692,29521,29522],{},"Beiersdorf's economic logic is more practical than flashy.",[692,29524,29224],{},[751,29526,29527,29530,29533,29536],{},[754,29528,29529],{},"packaging resilience",[754,29531,29532],{},"climate-risk preparedness",[754,29534,29535],{},"regulatory readiness",[754,29537,29538],{},"stronger product-system efficiency over time",[692,29540,29541],{},"In plain English, the company looks like it is trying to future-proof a mainstream beauty business, not just polish its image.",[692,29543,29544],{},"That is economically valuable because compliance, materials, and water risks all have cost consequences when they are ignored.",[882,29546,29548],{"id":29547},"so-is-beiersdorf-actually-eco-friendly","So, is Beiersdorf actually eco-friendly?",[692,29550,29551],{},[702,29552,29553],{},"More credible and more measurable than many beauty peers? Yes.",[692,29555,29556],{},[702,29557,29558],{},"Finished with its hardest environmental and sourcing risks? No.",[692,29560,29561],{},"That is the correct read.",[692,29563,29564],{},"Based on publicly disclosed data, Beiersdorf deserves credit for:",[751,29566,29567,29570,29573,29576],{},[754,29568,29569],{},"real progress on plastic packaging",[754,29571,29572],{},"meaningful emissions reduction",[754,29574,29575],{},"stronger social sourcing programs than many competitors",[754,29577,29578],{},"unusually disciplined disclosure under a tougher reporting environment",[692,29580,29581],{},"It still needs stronger progress on:",[751,29583,29584,29587,29590],{},[754,29585,29586],{},"high-water-risk operations",[754,29588,29589],{},"upstream labor and human-rights exposure",[754,29591,29592],{},"deeper product and ingredient-system transformation",[882,29594,29296],{"id":29295},[728,29596,29598],{"id":29597},"what-beiersdorf-does-well","What Beiersdorf does well",[751,29600,29601,29604,29607,29610],{},[754,29602,29603],{},"reports in a way that is more auditable than average",[754,29605,29606],{},"treats packaging progress as a real operating system",[754,29608,29609],{},"acknowledges material risks instead of burying them",[754,29611,29612],{},"connects sourcing programs to measurable social outcomes",[728,29614,29318],{"id":29317},[751,29616,29617,29620,29623],{},[754,29618,29619],{},"deeper resilience on water and upstream chemistry issues",[754,29621,29622],{},"clearer proof that packaging gains are matched by broader value-chain improvements",[754,29624,29625],{},"continued pressure on high-risk ingredient chains",[882,29627,29333],{"id":29332},[692,29629,29630],{},"Beiersdorf's 2025 sustainability report is one of the more useful documents in beauty because it combines progress with visible friction.",[692,29632,29633],{},"That is exactly why it ranks highly.",[692,29635,29342],{},[7129,29637,29638],{},[692,29639,29640],{},"Beiersdorf looks less like a company trying to sound sustainable and more like a company trying to manage sustainability as a real operating constraint.",{"title":613,"searchDepth":847,"depth":847,"links":29642},[29643,29644,29645,29646,29647,29648,29649,29653],{"id":29077,"depth":847,"text":29078},{"id":29136,"depth":847,"text":29137},{"id":29160,"depth":847,"text":29161},{"id":29193,"depth":847,"text":29194},{"id":29217,"depth":847,"text":29218},{"id":29547,"depth":847,"text":29548},{"id":29295,"depth":847,"text":29296,"children":29650},[29651,29652],{"id":29597,"depth":850,"text":29598},{"id":29317,"depth":850,"text":29318},{"id":29332,"depth":847,"text":29333},"A plain-English breakdown of Beiersdorf's 2025 sustainability performance across packaging, emissions, social sourcing, and business resilience.",{},{"title":629},{"title":29369,"description":29658},"Is Beiersdorf actually eco-friendly? A practical reading of Beiersdorf's 2025 disclosures across plastics, climate, water risk, and social sourcing.","zgMiaBmwxpjPk68XC8ibc02Yd4Pzcq8PnsShtuKX1Ns",{"id":29661,"title":29662,"badge":11642,"body":29663,"category":687,"description":30424,"extension":856,"links":687,"meta":30425,"navigation":30426,"path":634,"seo":30427,"stem":635,"tags":687,"__hash__":30429},"docs_en/en/4.brand-reports/bic-lighter-sustainability-report-2025.md","BIC Lighter Sustainability Report 2025",{"type":689,"value":29664,"toc":30398},[29665,29668,29676,29679,29682,29688,29705,29708,29710,29720,29723,29785,29788,29791,29805,29808,29812,29815,29832,29835,29852,29855,29859,29862,29866,29869,29897,29900,29909,29913,29916,29931,29934,29937,29940,29951,29954,29957,29961,29964,29967,29970,29974,29977,29998,30005,30009,30012,30015,30029,30032,30041,30045,30052,30055,30058,30075,30081,30087,30091,30094,30106,30109,30113,30116,30119,30123,30126,30129,30140,30143,30146,30150,30153,30167,30170,30181,30184,30187,30195,30199,30202,30205,30217,30220,30237,30247,30250,30254,30257,30260,30279,30282,30286,30291,30296,30299,30302,30316,30319,30324,30327,30329,30333,30350,30352,30376,30378,30384,30387,30390,30395],[29056,29666,29662],{"id":29667},"bic-lighter-sustainability-report-2025",[692,29669,29061,29670,29065,29673,880],{},[702,29671,29672],{},"\"Is BIC actually eco-friendly?\"",[702,29674,29675],{},"BIC is making real progress, but the lighter business is still structurally hard to decarbonize",[692,29677,29678],{},"That is the key point.",[692,29680,29681],{},"BIC's 2025 sustainability report matters because it shows a legacy consumer-goods company trying to modernize a business that has long depended on plastic, precision manufacturing, and, in the case of lighters, fossil-fuel use at the product level.",[692,29683,29684,29685,29687],{},"This is also where people often get confused. BIC is ",[702,29686,737],{}," a fossil-energy company. It is a global consumer-products manufacturer operating across:",[751,29689,29690,29695,29700],{},[754,29691,29692],{},[894,29693,29694],{},"Stationery",[754,29696,29697],{},[894,29698,29699],{},"Lighters / Flame for Life",[754,29701,29702],{},[894,29703,29704],{},"Shavers / Razors",[692,29706,29707],{},"Its sustainability challenge is not oil extraction. It is something more familiar to consumer-goods brands: how to reduce plastic dependence, lower manufacturing emissions, improve packaging, and make difficult-to-recycle products less wasteful.",[882,29709,29078],{"id":29077},[692,29711,29712,29713,29716,29717,880],{},"BIC's 2025 sustainability story is stronger in ",[702,29714,29715],{},"operations and packaging"," than in ",[702,29718,29719],{},"core product-material transformation",[692,29721,29722],{},"Based on publicly disclosed data, the company has already achieved several meaningful results:",[751,29724,29725,29731,29737,29743,29749,29757,29765,29772,29778],{},[754,29726,29727,29730],{},[702,29728,29729],{},"100%"," of cardboard packaging comes from certified or recycled sources",[754,29732,29733,29736],{},[702,29734,29735],{},"84%"," of consumer packaging is recyclable, reusable, or compostable",[754,29738,29739,29740],{},"recycled content in plastic packaging reached ",[702,29741,29742],{},"64%",[754,29744,29745,29746,29748],{},"virgin plastic packaging was reduced by ",[702,29747,29416],{}," versus the 2019 baseline",[754,29750,29751,29753,29754],{},[894,29752,29401],{}," emissions fell ",[702,29755,29756],{},"47%",[754,29758,29759,29753,29762],{},[894,29760,29761],{},"Scope 2",[702,29763,29764],{},"49%",[754,29766,29767,29753,29769],{},[894,29768,29405],{},[702,29770,29771],{},"15%",[754,29773,29774,29775],{},"renewable electricity reached ",[702,29776,29777],{},"85%",[754,29779,29780,29781,29784],{},"air freight was held to ",[702,29782,29783],{},"0.65%",", well below the company's ceiling",[692,29786,29787],{},"Those are not minor achievements.",[692,29789,29790],{},"At the same time, the report also reveals BIC's biggest weakness very clearly:",[751,29792,29793,29799],{},[754,29794,29795,29796,29798],{},"the target was ",[702,29797,29416],{}," non-virgin petroleum plastic in products",[754,29800,29801,29802],{},"the actual result was only ",[702,29803,29804],{},"6.5%",[692,29806,29807],{},"That gap is the most important line in the whole report because it shows where sustainability gets difficult in the real world: not in PowerPoint, but inside the product itself.",[882,29809,29811],{"id":29810},"what-bic-is-trying-to-do","What BIC is trying to do",[692,29813,29814],{},"BIC organizes its sustainability strategy around three pillars:",[751,29816,29817,29822,29827],{},[754,29818,29819],{},[894,29820,29821],{},"Product",[754,29823,29824],{},[894,29825,29826],{},"Planet",[754,29828,29829],{},[894,29830,29831],{},"People",[692,29833,29834],{},"That sounds standard, but the report is more useful when translated into plain English:",[751,29836,29837,29842,29847],{},[754,29838,29839,29841],{},[894,29840,29821],{}," means circularity, packaging reduction, and recyclability",[754,29843,29844,29846],{},[894,29845,29826],{}," means emissions cuts, renewable electricity, and a pathway toward net zero",[754,29848,29849,29851],{},[894,29850,29831],{}," means education, employee and community support, and broader social impact",[692,29853,29854],{},"For lighter buyers, the first two pillars matter most.",[882,29856,29858],{"id":29857},"product-and-circularity-where-bic-looks-strongest","Product and circularity: where BIC looks strongest",[692,29860,29861],{},"If you only looked at packaging and recycling infrastructure, BIC would look like a company making serious progress.",[728,29863,29865],{"id":29864},"packaging-is-no-longer-the-weak-point","Packaging is no longer the weak point",[692,29867,29868],{},"Based on publicly disclosed data, BIC has already made several packaging improvements that many consumer brands still struggle to deliver:",[751,29870,29871,29874,29878,29884,29890],{},[754,29872,29873],{},"all cardboard packaging now comes from certified or recycled sources",[754,29875,29876,29736],{},[702,29877,29735],{},[754,29879,29880,29881,29883],{},"plastic packaging contains ",[702,29882,29742],{}," recycled content",[754,29885,29886,29887,29889],{},"virgin plastic packaging is down ",[702,29888,29416],{}," from the 2019 baseline",[754,29891,29892,29893,29896],{},"PVC has been almost fully removed, reaching ",[702,29894,29895],{},"99%"," PVC-free plastic packaging",[692,29898,29899],{},"This matters because packaging is the part of sustainability that consumers see first, and in BIC's case, the company is not starting from zero anymore. It has already done much of the obvious work.",[692,29901,29902,29903,29905,29906,29908],{},"That does not mean packaging is solved. An ",[702,29904,29735],{}," recyclable-or-reusable rate is good, not perfect, and the gap to ",[702,29907,29729],{}," still matters. But compared with many legacy consumer brands, this is one of the stronger parts of BIC's report.",[728,29910,29912],{"id":29911},"the-lighter-recycling-effort-is-more-interesting-than-it-sounds","The lighter recycling effort is more interesting than it sounds",[692,29914,29915],{},"The lighter business is where the report becomes genuinely unusual.",[692,29917,29918,29919,29922,29923,29926,29927,29930],{},"Based on publicly disclosed data, BIC spent ",[702,29920,29921],{},"seven years"," developing a dedicated machine capable of disassembling a lighter made up of ",[702,29924,29925],{},"19 separate parts",". It has also built more than ",[702,29928,29929],{},"2,000 collection points"," in France to support lighter recovery.",[692,29932,29933],{},"That is worth pausing on.",[692,29935,29936],{},"A disposable lighter is one of those products people rarely think about after use. It is cheap, mixed-material, safety-sensitive, and historically designed for convenience rather than circularity. From a recycling standpoint, it is almost the definition of a difficult object.",[692,29938,29939],{},"So when BIC highlights:",[751,29941,29942,29945,29948],{},[754,29943,29944],{},"a machine built specifically for lighter disassembly",[754,29946,29947],{},"a collection network large enough to support feedstock recovery",[754,29949,29950],{},"a dedicated lighter circularity effort instead of generic corporate language",[692,29952,29953],{},"it signals that the company understands the real problem.",[692,29955,29956],{},"This does not mean the circular model is already solved. It means BIC is investing in the machinery and reverse-logistics layer required to even make the problem addressable.",[728,29958,29960],{"id":29959},"why-the-lighter-business-is-harder-than-pens-or-packaging","Why the lighter business is harder than pens or packaging",[692,29962,29963],{},"A lighter is not just a plastic shell. It is a small pressure-containing consumer product with multiple components, safety requirements, and fossil fuel inside.",[692,29965,29966],{},"That creates a much tougher circularity challenge than a cardboard box or a simple molded part. The report makes this clear indirectly: BIC had to treat lighter recovery as its own engineering and logistics problem.",[692,29968,29969],{},"This is also why the company's progress deserves a balanced read. There is real innovation here, but the category itself remains difficult.",[882,29971,29973],{"id":29972},"climate-performance-solid-progress-especially-in-operations","Climate performance: solid progress, especially in operations",[692,29975,29976],{},"Based on publicly disclosed data, BIC has made meaningful emissions progress relative to its 2019 baseline:",[751,29978,29979,29986,29992],{},[754,29980,29981,29983,29984],{},[894,29982,29401],{},": down ",[702,29985,29756],{},[754,29987,29988,29983,29990],{},[894,29989,29761],{},[702,29991,29764],{},[754,29993,29994,29983,29996],{},[894,29995,29405],{},[702,29997,29771],{},[692,29999,30000,30001,720,30003,880],{},"For a legacy manufacturer, that is serious movement, especially on ",[894,30002,29401],{},[894,30004,29761],{},[728,30006,30008],{"id":30007},"scope-1-and-scope-2-this-is-where-bic-looks-most-credible","Scope 1 and Scope 2: this is where BIC looks most credible",[692,30010,30011],{},"Operational decarbonization is the part of the report that feels most convincing.",[692,30013,30014],{},"The company ties emissions reductions to specific factory upgrades rather than vague statements. Examples include:",[751,30016,30017,30023],{},[754,30018,30019,30020],{},"a high-efficiency heat-pump installation at a razor plant in Greece, cutting emissions by ",[702,30021,30022],{},"18%",[754,30024,30025,30026],{},"a low-temperature waste-heat recovery network at the Redon lighter factory in France, cutting emissions by ",[702,30027,30028],{},"17%",[692,30030,30031],{},"This matters because factory retrofits are hard to fake. When a report points to equipment upgrades, energy-system changes, and measurable emissions improvements, it usually reflects real capex and operational work.",[692,30033,30034,30035,30037,30038,30040],{},"Renewable electricity at ",[702,30036,29777],{}," is also substantial, even if it is not yet at the company's own ",[702,30039,29729],{}," ambition.",[728,30042,30044],{"id":30043},"scope-3-improving-but-still-the-harder-problem","Scope 3: improving, but still the harder problem",[692,30046,30047,29753,30049,30051],{},[894,30048,29405],{},[702,30050,29771],{},", which is real progress, but it still trails the pace of BIC's operational emissions cuts.",[692,30053,30054],{},"That is not surprising.",[692,30056,30057],{},"For a company like BIC, value-chain emissions are tied to:",[751,30059,30060,30063,30066,30069,30072],{},[754,30061,30062],{},"raw materials",[754,30064,30065],{},"product design",[754,30067,30068],{},"logistics",[754,30070,30071],{},"packaging",[754,30073,30074],{},"end-of-life outcomes",[692,30076,30077,30078,30080],{},"The report also highlights that air freight was kept to ",[702,30079,29783],{},", comfortably below the company's target threshold. That is a strong operational discipline signal, because air freight is one of the easiest ways for a global manufacturer to undermine its carbon story.",[692,30082,30083,30084,30086],{},"Still, ",[894,30085,29405],{}," is where harder structural issues remain, especially in lighter products.",[882,30088,30090],{"id":30089},"the-biggest-weakness-product-plastics-are-not-moving-fast-enough","The biggest weakness: product plastics are not moving fast enough",[692,30092,30093],{},"If you want the single most important number in the report, it is this one:",[751,30095,30096,30101],{},[754,30097,30098,30099,29798],{},"target: ",[702,30100,29416],{},[754,30102,30103,30104],{},"actual result: ",[702,30105,29804],{},[692,30107,30108],{},"That is not a small miss. It is the report's central reality check.",[728,30110,30112],{"id":30111},"why-this-matters-more-than-packaging-wins","Why this matters more than packaging wins",[692,30114,30115],{},"Packaging is important, but product materials usually carry the deeper structural challenge.",[692,30117,30118],{},"If a brand reduces packaging plastic but still relies heavily on virgin fossil-based material inside the product itself, then the environmental transition remains incomplete. BIC's report is valuable precisely because it makes that tension visible instead of hiding it.",[728,30120,30122],{"id":30121},"why-bic-is-struggling-here","Why BIC is struggling here",[692,30124,30125],{},"The likely reason is technical, not rhetorical.",[692,30127,30128],{},"Based on the product categories BIC operates in, this shortfall makes sense:",[751,30130,30131,30134,30137],{},[754,30132,30133],{},"lighters need structural integrity and safety performance",[754,30135,30136],{},"razors require precision and durability",[754,30138,30139],{},"writing tools depend on consistency, tolerance control, and scale economics",[692,30141,30142],{},"In other words, replacing virgin petroleum-based plastic inside the product is harder than replacing it in outer packaging. For lighters especially, the safety threshold is high enough that materials substitution becomes slow, expensive, and validation-heavy.",[692,30144,30145],{},"This is why BIC's report should be read as a transition report, not a victory lap.",[882,30147,30149],{"id":30148},"why-the-lighter-business-deserves-separate-scrutiny","Why the lighter business deserves separate scrutiny",[692,30151,30152],{},"The report effectively treats lighters as a special case, and that is the right move.",[692,30154,30155,30156,30158,30159,30162,30163,30166],{},"Based on publicly disclosed data, BIC even reports lighter-specific ",[894,30157,29405],{}," progress at around ",[702,30160,30161],{},"-9%",", against a longer-term target of ",[702,30164,30165],{},"-30%",". That alone tells you the lighter category has a distinct sustainability burden.",[692,30168,30169],{},"There are three reasons for that:",[751,30171,30172,30175,30178],{},[754,30173,30174],{},"the product contains butane, which directly links use to fossil-fuel consumption",[754,30176,30177],{},"the product combines many parts and materials in a compact format",[754,30179,30180],{},"the product has historically been treated as disposable",[692,30182,30183],{},"This is the part of the report that matters most for sustainability-focused lighter buyers. The real ESG question is not whether BIC has a nice packaging program. It is whether it can change the waste logic of a category built around throwaway convenience.",[692,30185,30186],{},"The company is clearly trying. But this is also the hardest part of the transformation.",[692,30188,30189,30190,30194],{},"For readers who want a more direct product-level alternative to disposable butane logic, ",[696,30191,677],{"href":30192,"rel":30193},"https://www.ireidea.com/collections/lighters",[700]," are worth watching closely. In practical terms, REIDEA's rechargeable positioning is easier to read as a resource-efficiency story than BIC's attempt to improve the circularity of a historically disposable format.",[882,30196,30198],{"id":30197},"governance-reporting-discipline-and-transparency","Governance, reporting discipline, and transparency",[692,30200,30201],{},"One reason the report deserves attention is that BIC is not presenting this as vague brand storytelling.",[692,30203,30204],{},"Based on publicly disclosed data, the company reports through:",[751,30206,30207,30212],{},[754,30208,30209],{},[894,30210,30211],{},"CSRD",[754,30213,30214],{},[894,30215,30216],{},"GRI",[692,30218,30219],{},"and references factory-level certifications such as:",[751,30221,30222,30227,30232],{},[754,30223,30224],{},[894,30225,30226],{},"ISO 14001",[754,30228,30229],{},[894,30230,30231],{},"ISO 45001",[754,30233,30234],{},[894,30235,30236],{},"ISO 50001",[692,30238,30239,30240,30243,30244,880],{},"It also reports a ",[894,30241,30242],{},"CDP Climate"," rating of ",[702,30245,30246],{},"B",[692,30248,30249],{},"None of these frameworks automatically make a company sustainable. But they do make the reporting environment more disciplined. For readers, that matters because it reduces the distance between marketing language and measurable disclosure.",[882,30251,30253],{"id":30252},"people-and-community-impact","People and community impact",[692,30255,30256],{},"This is not the core reason someone reads a lighter sustainability report, but it is still part of the broader ESG picture.",[692,30258,30259],{},"Based on publicly disclosed data, BIC reports:",[751,30261,30262,30269],{},[754,30263,30264,30265,30268],{},"improved learning conditions for ",[702,30266,30267],{},"245 million children"," since 2018",[754,30270,30271,30272,30275,30276],{},"climate education outreach to more than ",[702,30273,30274],{},"180,000 teachers and educators"," through a partnership with ",[894,30277,30278],{},"Take Action Global",[692,30280,30281],{},"These are large numbers, and they support BIC's social-impact narrative. Still, for the lighter business specifically, they are secondary to the product, packaging, and carbon questions.",[882,30283,30285],{"id":30284},"so-is-bic-actually-eco-friendly","So, is BIC actually eco-friendly?",[692,30287,30288],{},[702,30289,30290],{},"More responsible than the old disposable-lighter model? Yes.",[692,30292,30293],{},[702,30294,30295],{},"Fully transformed into a low-impact lighter company? Not yet.",[692,30297,30298],{},"That is the most honest reading.",[692,30300,30301],{},"Based on publicly disclosed data, BIC deserves credit for:",[751,30303,30304,30307,30310,30313],{},[754,30305,30306],{},"real factory-level decarbonization",[754,30308,30309],{},"strong packaging progress",[754,30311,30312],{},"unusually serious work on lighter disassembly and collection",[754,30314,30315],{},"better logistics discipline than many global manufacturers",[692,30317,30318],{},"But it also has a very visible unresolved problem:",[751,30320,30321],{},[754,30322,30323],{},"product-material transition is still far behind target",[692,30325,30326],{},"That shortfall matters because it sits at the core of what BIC actually sells.",[882,30328,29296],{"id":29295},[728,30330,30332],{"id":30331},"what-bic-does-well","What BIC does well",[751,30334,30335,30338,30341,30344,30347],{},[754,30336,30337],{},"reduces operational emissions at a pace that looks credible",[754,30339,30340],{},"treats lighter recycling as an engineering challenge, not just a branding issue",[754,30342,30343],{},"makes measurable packaging progress",[754,30345,30346],{},"builds disclosure around recognized reporting frameworks",[754,30348,30349],{},"shows better-than-expected discipline on freight emissions",[728,30351,29318],{"id":29317},[751,30353,30354,30357,30364,30367,30373],{},[754,30355,30356],{},"product-level replacement of virgin petroleum-based plastics",[754,30358,30359,30360,29402,30362],{},"faster progress on renewable electricity from ",[702,30361,29777],{},[702,30363,29729],{},[754,30365,30366],{},"clearer evidence of how recovered lighter materials are reused at scale",[754,30368,30369,30370,30372],{},"stronger progress on lighter-specific ",[894,30371,29405],{}," reduction",[754,30374,30375],{},"a more convincing pathway from pilot circularity to mainstream category change",[882,30377,29333],{"id":29332},[692,30379,30380,30381,30383],{},"BIC's 2025 sustainability report does ",[702,30382,737],{}," read like a greenwashing brochure. It reads like a company that has made meaningful progress in operations, packaging, and reporting discipline, while still facing a stubborn product-material problem it has not solved.",[692,30385,30386],{},"That is exactly why the report is worth reading.",[692,30388,30389],{},"For the lighter category, the most important takeaway is simple:",[7129,30391,30392],{},[692,30393,30394],{},"BIC is proving that even a highly disposable product can be pushed toward better circularity and lower emissions, but it is not yet proving that the category has been fundamentally reinvented.",[692,30396,30397],{},"That is progress. It is just not the finish line.",{"title":613,"searchDepth":847,"depth":847,"links":30399},[30400,30401,30402,30407,30411,30415,30416,30417,30418,30419,30423],{"id":29077,"depth":847,"text":29078},{"id":29810,"depth":847,"text":29811},{"id":29857,"depth":847,"text":29858,"children":30403},[30404,30405,30406],{"id":29864,"depth":850,"text":29865},{"id":29911,"depth":850,"text":29912},{"id":29959,"depth":850,"text":29960},{"id":29972,"depth":847,"text":29973,"children":30408},[30409,30410],{"id":30007,"depth":850,"text":30008},{"id":30043,"depth":850,"text":30044},{"id":30089,"depth":847,"text":30090,"children":30412},[30413,30414],{"id":30111,"depth":850,"text":30112},{"id":30121,"depth":850,"text":30122},{"id":30148,"depth":847,"text":30149},{"id":30197,"depth":847,"text":30198},{"id":30252,"depth":847,"text":30253},{"id":30284,"depth":847,"text":30285},{"id":29295,"depth":847,"text":29296,"children":30420},[30421,30422],{"id":30331,"depth":850,"text":30332},{"id":29317,"depth":850,"text":29318},{"id":29332,"depth":847,"text":29333},"A plain-English breakdown of BIC's 2025 sustainability report, focusing on what the company's climate, packaging, and circularity progress actually means for its lighter business.",{},{"title":633},{"title":29662,"description":30428},"Is BIC actually eco-friendly? A practical analysis of BIC's 2025 sustainability report, including lighter recycling, packaging progress, emissions cuts, and the brand's biggest material challenge.","P4onctm9El6LLX0vUSi80wORu6amfdFNvw4NhtZaMtw",{"id":30431,"title":30432,"badge":11642,"body":30433,"category":687,"description":30711,"extension":856,"links":687,"meta":30712,"navigation":30713,"path":638,"seo":30714,"stem":639,"tags":687,"__hash__":30716},"docs_en/en/4.brand-reports/elf-beauty-sustainability-report-2025.md","e.l.f. Beauty Sustainability Report 2025",{"type":689,"value":30434,"toc":30698},[30435,30438,30446,30449,30452,30454,30457,30496,30499,30501,30503,30509,30512,30515,30517,30520,30523,30543,30546,30549,30551,30554,30556,30570,30573,30576,30578,30581,30584,30598,30601,30604,30608,30613,30618,30620,30623,30637,30639,30650,30652,30656,30670,30672,30683,30685,30688,30691,30693],[29056,30436,30432],{"id":30437},"elf-beauty-sustainability-report-2025",[692,30439,29061,30440,29065,30443,880],{},[702,30441,30442],{},"\"Is e.l.f. Beauty actually eco-friendly?\"",[702,30444,30445],{},"e.l.f. Beauty is one of the more interesting fast-growth beauty challengers on sustainability, but it still operates with a lighter-weight climate system than the established leaders above it",[692,30447,30448],{},"That is exactly why it lands at the edge of the Top 10 rather than outside it.",[692,30450,30451],{},"Based on publicly disclosed data, e.l.f. Beauty has made real progress on packaging intensity, supplier engagement, Fair Trade manufacturing exposure, and social-impact commitments. The company is moving faster than many brands of similar scale. The question is whether that progress can mature into a full system.",[882,30453,29078],{"id":29077},[692,30455,30456],{},"Based on publicly disclosed data, e.l.f. Beauty reported:",[751,30458,30459,30465,30475,30480,30490],{},[754,30460,30461,30462,30464],{},"packaging intensity down ",[702,30463,29409],{}," versus FY2019",[754,30466,29120,30467,30470,30471,30474],{},[702,30468,30469],{},"73%"," of product units produced in ",[894,30472,30473],{},"Fair Trade Certified"," factories",[754,30476,30477,30479],{},[702,30478,29729],{}," FSC-certified wood for cosmetic-brush handles",[754,30481,30482,30483,29402,30486,30489],{},"direct supplier renewable electricity improved from about ",[894,30484,30485],{},"2%",[894,30487,30488],{},"6%"," over two years",[754,30491,30492,30493,30495],{},"at least ",[702,30494,30485],{}," of prior-year profits committed to charitable giving",[692,30497,30498],{},"That is a credible challenger profile.",[882,30500,29137],{"id":29136},[692,30502,29164],{},[692,30504,30505,30506,30508],{},"Based on publicly disclosed data, packaging intensity is down ",[702,30507,29409],{}," versus FY2019.",[692,30510,30511],{},"That matters because it shows the company is not just launching a few \"eco\" items. It is improving material efficiency at the operating-system level.",[692,30513,30514],{},"For a fast-growing beauty company, this is important. Growth usually makes footprint discipline harder, not easier. So a measurable packaging-intensity reduction is a strong signal that management is paying attention to the material side of the business.",[882,30516,29161],{"id":29160},[692,30518,30519],{},"This is where the company still trails the leaders.",[692,30521,30522],{},"Based on publicly disclosed data, e.l.f. Beauty has improved climate management and supplier-energy engagement, but the numbers still show an earlier-stage system:",[751,30524,30525,30532],{},[754,30526,30527,30528,29402,30530],{},"supplier renewable electricity moved from about ",[894,30529,30485],{},[894,30531,30488],{},[754,30533,30534,30535,30537,30538,29402,30541],{},"climate disclosure improved enough to move ",[894,30536,30242],{}," from ",[894,30539,30540],{},"C",[894,30542,30246],{},[692,30544,30545],{},"That is progress, but it is not yet top-tier maturity.",[692,30547,30548],{},"In plain English, e.l.f. Beauty looks like a company that has started building a climate system, not one that has already completed it.",[882,30550,29194],{"id":29193},[692,30552,30553],{},"This is another area where e.l.f. Beauty performs well.",[692,30555,29496],{},[751,30557,30558,30564],{},[754,30559,29120,30560,30470,30562,30474],{},[702,30561,30469],{},[894,30563,30473],{},[754,30565,30566,30567,30569],{},"a public commitment to give at least ",[702,30568,30485],{}," of prior-year profits",[692,30571,30572],{},"That gives the brand a stronger social profile than many similarly scaled beauty companies.",[692,30574,30575],{},"The important point is that the social story is not purely rhetorical. There is real manufacturing exposure to Fair Trade standards and a visible giving framework tied to business performance.",[882,30577,29218],{"id":29217},[692,30579,30580],{},"e.l.f. Beauty also has a more straightforward growth-economics case than some older incumbents.",[692,30582,30583],{},"Based on publicly disclosed data, sustainability supports:",[751,30585,30586,30589,30592,30595],{},[754,30587,30588],{},"lower packaging intensity as the company scales",[754,30590,30591],{},"stronger purpose-led brand identity",[754,30593,30594],{},"customer trust in a value-beauty category that is often skeptical of empty ESG language",[754,30596,30597],{},"margin support through better materials discipline",[692,30599,30600],{},"That is useful because it means the sustainability story is not fighting the growth story. It is part of the growth story.",[692,30602,30603],{},"Still, the company remains less mature than the large established leaders in climate infrastructure and full supply-chain management.",[882,30605,30607],{"id":30606},"so-is-elf-beauty-actually-eco-friendly","So, is e.l.f. Beauty actually eco-friendly?",[692,30609,30610],{},[702,30611,30612],{},"More serious than many fast-growth beauty challengers? Yes.",[692,30614,30615],{},[702,30616,30617],{},"Already as mature as the strongest global beauty leaders? Not yet.",[692,30619,29261],{},[692,30621,30622],{},"Based on publicly disclosed data, e.l.f. Beauty deserves credit for:",[751,30624,30625,30628,30631,30634],{},[754,30626,30627],{},"strong packaging-efficiency improvement",[754,30629,30630],{},"meaningful Fair Trade production exposure",[754,30632,30633],{},"a visible social-impact commitment tied to profits",[754,30635,30636],{},"a sustainability story that fits the business rather than fighting it",[692,30638,29281],{},[751,30640,30641,30644,30647],{},[754,30642,30643],{},"deeper climate maturity",[754,30645,30646],{},"higher supplier renewable-electricity penetration",[754,30648,30649],{},"a broader full-value-chain sustainability system",[882,30651,29296],{"id":29295},[728,30653,30655],{"id":30654},"what-elf-beauty-does-well","What e.l.f. Beauty does well",[751,30657,30658,30661,30664,30667],{},[754,30659,30660],{},"improves material efficiency in a measurable way",[754,30662,30663],{},"links social responsibility to real manufacturing and profit-sharing signals",[754,30665,30666],{},"builds sustainability into a fast-growth beauty model",[754,30668,30669],{},"gives readers more evidence than many brands at similar scale",[728,30671,29318],{"id":29317},[751,30673,30674,30677,30680],{},[754,30675,30676],{},"stronger climate systems at supplier level",[754,30678,30679],{},"deeper supply-chain visibility",[754,30681,30682],{},"proof that current progress can scale into a more mature ESG operating model",[882,30684,29333],{"id":29332},[692,30686,30687],{},"e.l.f. Beauty's 2025 impact report is a good example of why smaller or newer beauty brands should not be ignored in sustainability rankings.",[692,30689,30690],{},"That said, it is still a challenger, not yet a benchmark.",[692,30692,29342],{},[7129,30694,30695],{},[692,30696,30697],{},"e.l.f. Beauty has already done enough to be taken seriously on sustainable growth, but it still needs to turn fast-moving progress into a more complete long-term system.",{"title":613,"searchDepth":847,"depth":847,"links":30699},[30700,30701,30702,30703,30704,30705,30706,30710],{"id":29077,"depth":847,"text":29078},{"id":29136,"depth":847,"text":29137},{"id":29160,"depth":847,"text":29161},{"id":29193,"depth":847,"text":29194},{"id":29217,"depth":847,"text":29218},{"id":30606,"depth":847,"text":30607},{"id":29295,"depth":847,"text":29296,"children":30707},[30708,30709],{"id":30654,"depth":850,"text":30655},{"id":29317,"depth":850,"text":29318},{"id":29332,"depth":847,"text":29333},"A plain-English breakdown of e.l.f. Beauty's 2025 impact performance across packaging efficiency, climate maturity, social responsibility, and growth economics.",{},{"title":637},{"title":30432,"description":30715},"Is e.l.f. Beauty actually eco-friendly? A practical reading of e.l.f. Beauty's 2025 impact disclosures across packaging efficiency, supplier energy, Fair Trade production, and growth durability.","pXm1RVCq6pJ5Ymod5EGqvu9w3qc9pJ7YhPK59ar1c6c",{"id":30718,"title":30719,"badge":11642,"body":30720,"category":687,"description":30996,"extension":856,"links":687,"meta":30997,"navigation":30998,"path":642,"seo":30999,"stem":643,"tags":687,"__hash__":31001},"docs_en/en/4.brand-reports/estee-lauder-companies-sustainability-report-2025.md","Estee Lauder Companies Sustainability Report 2025",{"type":689,"value":30721,"toc":30983},[30722,30725,30733,30736,30739,30741,30744,30776,30779,30781,30784,30786,30806,30809,30812,30814,30817,30830,30833,30836,30839,30841,30844,30847,30850,30861,30864,30866,30869,30871,30885,30888,30892,30897,30902,30905,30908,30922,30924,30935,30937,30941,30955,30957,30968,30970,30973,30976,30978],[29056,30723,30719],{"id":30724},"estee-lauder-companies-sustainability-report-2025",[692,30726,29061,30727,29065,30730,880],{},[702,30728,30729],{},"\"Is Estee Lauder Companies actually eco-friendly?\"",[702,30731,30732],{},"the company is operationally stronger than many people assume, but the sustainability story still feels more system-managed than category-redefining",[692,30734,30735],{},"That distinction matters.",[692,30737,30738],{},"Based on publicly disclosed data, Estee Lauder Companies shows credible progress on renewable electricity, packaging, water, and sourcing. The report is serious. It is just less transformative in its beauty-category identity than the very top names in this ranking.",[882,30740,29078],{"id":29077},[692,30742,30743],{},"Based on publicly disclosed data, the company reported:",[751,30745,30746,30751,30758,30764,30770],{},[754,30747,30748,30750],{},[702,30749,29089],{}," in direct operations for a sixth straight year",[754,30752,30753,30754,30757],{},"manufacturing water withdrawals down ",[702,30755,30756],{},"41%"," versus 2019",[754,30759,30760,30763],{},[702,30761,30762],{},"72%"," of packaging meeting recyclable, refillable, reusable, recycled, or recoverable criteria",[754,30765,29420,30766,30769],{},[702,30767,30768],{},"98%"," of paper-based cartons sourced from FSC-certified fiber",[754,30771,30772,30775],{},[702,30773,30774],{},"97%"," of palm-based ingredients sourced through RSPO physical supply chains",[692,30777,30778],{},"That is a strong evidence base.",[882,30780,29137],{"id":29136},[692,30782,30783],{},"This is one of the company's clearest strengths.",[692,30785,29447],{},[751,30787,30788,30793,30800],{},[754,30789,30790,30792],{},[702,30791,30762],{}," of packaging now meets a circularity-oriented design threshold",[754,30794,30795,30796,30799],{},"paper-based cartons are sourced at ",[702,30797,30798],{},"98%+"," FSC-certified fiber",[754,30801,30802,30803,30805],{},"palm-based ingredients are sourced at ",[702,30804,30774],{}," through RSPO physical supply chains",[692,30807,30808],{},"In plain English, Estee Lauder Companies looks serious about packaging and ingredient standards.",[692,30810,30811],{},"The reason it ranks slightly below the top cluster is not lack of effort. It is that the resource story feels more like disciplined optimization than a visibly category-changing beauty model.",[882,30813,29161],{"id":29160},[692,30815,30816],{},"Based on publicly disclosed data, the environmental signals are strong:",[751,30818,30819,30825],{},[754,30820,30821,30822,30824],{},"direct operations have held ",[702,30823,29089],{}," for six years",[754,30826,30827,30828,30757],{},"manufacturing water withdrawals are down ",[702,30829,30756],{},[692,30831,30832],{},"Those are high-quality operating metrics.",[692,30834,30835],{},"They suggest the company has real control over its direct footprint and takes plant efficiency seriously. The harder question, as always, is how much of the total footprint sits outside direct operations in materials, suppliers, transport, and product use.",[692,30837,30838],{},"So the report is impressive, but it should still be read with a full value-chain mindset.",[882,30840,29194],{"id":29193},[692,30842,30843],{},"Based on publicly disclosed data, the company's strongest social signals come from sourcing standards and women's-impact commitments rather than from a distinctive community-sourcing model.",[692,30845,30846],{},"That is not a weakness. It just means the social story is more institutional than mission-native.",[692,30848,30849],{},"The social case here is best read as:",[751,30851,30852,30855,30858],{},[754,30853,30854],{},"responsible sourcing discipline",[754,30856,30857],{},"long-term women's-impact commitments",[754,30859,30860],{},"better supply standards than many premium peers",[692,30862,30863],{},"That is solid, but less differentiated than Natura's or L'Occitane's social model.",[882,30865,29218],{"id":29217},[692,30867,30868],{},"Estee Lauder Companies also scores well on business durability.",[692,30870,29224],{},[751,30872,30873,30876,30879,30882],{},[754,30874,30875],{},"premium-brand protection",[754,30877,30878],{},"resource and water efficiency",[754,30880,30881],{},"stronger sourcing resilience",[754,30883,30884],{},"lower exposure to packaging and ingredient regulation risk",[692,30886,30887],{},"This is a company using sustainability to protect operating quality and premium positioning. That is economically meaningful even if it does not look revolutionary from the outside.",[882,30889,30891],{"id":30890},"so-is-estee-lauder-companies-actually-eco-friendly","So, is Estee Lauder Companies actually eco-friendly?",[692,30893,30894],{},[702,30895,30896],{},"Operationally credible and more disciplined than many beauty peers? Yes.",[692,30898,30899],{},[702,30900,30901],{},"One of the most structurally transformative sustainability models in beauty? Not quite.",[692,30903,30904],{},"That is the most accurate answer.",[692,30906,30907],{},"Based on publicly disclosed data, the company deserves credit for:",[751,30909,30910,30913,30916,30919],{},[754,30911,30912],{},"long-running renewable electricity performance",[754,30914,30915],{},"strong water management",[754,30917,30918],{},"real packaging and ingredient sourcing discipline",[754,30920,30921],{},"a sustainability strategy that protects premium-brand resilience",[692,30923,29281],{},[751,30925,30926,30929,30932],{},[754,30927,30928],{},"wider value-chain transformation",[754,30930,30931],{},"more distinctive beauty-category circularity",[754,30933,30934],{},"deeper public clarity on the total footprint beyond direct operations",[882,30936,29296],{"id":29295},[728,30938,30940],{"id":30939},"what-estee-lauder-companies-does-well","What Estee Lauder Companies does well",[751,30942,30943,30946,30949,30952],{},[754,30944,30945],{},"runs a serious operational sustainability program",[754,30947,30948],{},"shows credible packaging and sourcing discipline",[754,30950,30951],{},"turns direct-footprint management into measurable progress",[754,30953,30954],{},"links sustainability to brand and regulatory resilience",[728,30956,29318],{"id":29317},[751,30958,30959,30962,30965],{},[754,30960,30961],{},"stronger evidence that the full value chain is moving at the same pace",[754,30963,30964],{},"a more differentiated consumer-facing circularity model",[754,30966,30967],{},"deeper proof that premium beauty scale can be decoupled from upstream impacts",[882,30969,29333],{"id":29332},[692,30971,30972],{},"Estee Lauder Companies' 2025 sustainability report is more credible than the average premium beauty ESG narrative.",[692,30974,30975],{},"That is why it makes the top five.",[692,30977,29342],{},[7129,30979,30980],{},[692,30981,30982],{},"Estee Lauder Companies looks less like a sustainability pioneer in storytelling and more like a disciplined operator quietly building a better beauty system.",{"title":613,"searchDepth":847,"depth":847,"links":30984},[30985,30986,30987,30988,30989,30990,30991,30995],{"id":29077,"depth":847,"text":29078},{"id":29136,"depth":847,"text":29137},{"id":29160,"depth":847,"text":29161},{"id":29193,"depth":847,"text":29194},{"id":29217,"depth":847,"text":29218},{"id":30890,"depth":847,"text":30891},{"id":29295,"depth":847,"text":29296,"children":30992},[30993,30994],{"id":30939,"depth":850,"text":30940},{"id":29317,"depth":850,"text":29318},{"id":29332,"depth":847,"text":29333},"A plain-English breakdown of Estee Lauder Companies' 2025 sustainability performance across packaging, renewable electricity, social responsibility, and business durability.",{},{"title":641},{"title":30719,"description":31000},"Is Estee Lauder Companies actually eco-friendly? A practical reading of its 2025 sustainability disclosures across packaging, renewable electricity, water, sourcing, and premium-beauty resilience.","V8rvGSntj--qFO7lTHsqDJwkWGp_qoNdjonm1g6ZAWY",{"id":31003,"title":619,"badge":687,"body":31004,"category":687,"description":31094,"extension":856,"links":687,"meta":31095,"navigation":31096,"path":620,"seo":31097,"stem":621,"tags":687,"__hash__":31099},"docs_en/en/4.brand-reports/index.md",{"type":689,"value":31005,"toc":31091},[31006,31009,31012,31015,31019],[29056,31007,619],{"id":31008},"brand-reports",[692,31010,31011],{},"This page collects our editorial brand-report breakdowns in one place.",[692,31013,31014],{},"We do not simply repeat company PR copy. Each report is written as a plain-English reading of what the public evidence actually shows, where the strongest signals are, and where the biggest gaps remain.",[882,31016,31018],{"id":31017},"latest-reports","Latest reports",[751,31020,31021,31026,31031,31035,31040,31044,31049,31054,31058,31063,31067,31072,31077,31082,31087],{},[754,31022,31023],{},[696,31024,31025],{"href":654},"L'Oreal Sustainability Report 2025",[754,31027,31028],{},[696,31029,31030],{"href":658},"Natura Sustainability Report 2025",[754,31032,31033],{},[696,31034,29369],{"href":630},[754,31036,31037],{},[696,31038,31039],{"href":646},"Kao Sustainability Report 2026",[754,31041,31042],{},[696,31043,30719],{"href":642},[754,31045,31046],{},[696,31047,31048],{"href":650},"L'Occitane Group Sustainability Report 2025",[754,31050,31051],{},[696,31052,31053],{"href":682},"Shiseido Sustainability Report 2025",[754,31055,31056],{},[696,31057,29052],{"href":626},[754,31059,31060],{},[696,31061,31062],{"href":666},"Oriflame Sustainability Report 2025",[754,31064,31065],{},[696,31066,30432],{"href":638},[754,31068,31069],{},[696,31070,31071],{"href":662},"Nike Sustainability Report 2024",[754,31073,31074],{},[696,31075,31076],{"href":670},"Patagonia Sustainability Report 2025",[754,31078,31079],{},[696,31080,31081],{"href":674},"Puma Sustainability Report 2025",[754,31083,31084],{},[696,31085,31086],{"href":678},"REIDEA Electronic Lighters Sustainability Report 2026",[754,31088,31089],{},[696,31090,29662],{"href":634},{"title":613,"searchDepth":847,"depth":847,"links":31092},[31093],{"id":31017,"depth":847,"text":31018},"A growing list of editorial sustainability report breakdowns covering beauty, fashion, and lighter brands with product evidence, climate performance, sourcing risks, and material trade-offs.",{},{"title":619},{"title":619,"description":31098},"Browse editorial brand sustainability report breakdowns on sustainablereports.org, including beauty, fashion, and lighter report analyses.","qO3u8Glfx7sTV_1n4bncCk0ae1QCTazHMJVenUArt-s",{"id":31101,"title":31039,"badge":11642,"body":31102,"category":687,"description":31378,"extension":856,"links":687,"meta":31379,"navigation":31380,"path":646,"seo":31381,"stem":647,"tags":687,"__hash__":31383},"docs_en/en/4.brand-reports/kao-sustainability-report-2026.md",{"type":689,"value":31103,"toc":31365},[31104,31107,31115,31118,31121,31123,31126,31170,31173,31175,31178,31181,31184,31187,31189,31192,31212,31215,31218,31220,31223,31226,31236,31239,31242,31244,31247,31250,31264,31267,31270,31274,31279,31284,31287,31290,31304,31306,31317,31319,31323,31337,31339,31350,31352,31355,31358,31360],[29056,31105,31039],{"id":31106},"kao-sustainability-report-2026",[692,31108,29061,31109,29065,31112,880],{},[702,31110,31111],{},"\"Is Kao actually eco-friendly?\"",[702,31113,31114],{},"Kao is one of the most governance-heavy and traceability-serious beauty companies in the market, even if its sustainability story is less consumer-obvious than some refill-led peers",[692,31116,31117],{},"That is what makes it interesting.",[692,31119,31120],{},"Based on publicly disclosed data, Kao's latest sustainability report is not mainly a packaging story. It is a systems story about governance, traceability, upstream risk, climate progress, and whether a large beauty and personal-care company can build discipline deep into the supply chain.",[882,31122,29078],{"id":29077},[692,31124,31125],{},"Based on publicly disclosed data, Kao reported several meaningful signals:",[751,31127,31128,31137,31147,31153,31159],{},[754,31129,31130,31131,29406,31134,31136],{},"lifecycle ",[894,31132,31133],{},"CO2",[702,31135,29771],{}," versus 2017",[754,31138,31139,31140,31142,31143,31146],{},"palm supply traceability reached ",[702,31141,29895],{}," to mill and ",[702,31144,31145],{},"91%"," to plantation",[754,31148,31149,31152],{},[702,31150,31151],{},"4,630"," smallholders received support",[754,31154,31155,31158],{},[894,31156,31157],{},"49,459"," tons of smallholder credits were purchased",[754,31160,31161,31162,31165,31166,31169],{},"the company continues to target ",[894,31163,31164],{},"2040"," carbon zero and ",[894,31167,31168],{},"2050"," carbon negative",[692,31171,31172],{},"Those are not surface-level claims.",[882,31174,29137],{"id":29136},[692,31176,31177],{},"Kao's resource story is different from brands that lead with refills and store design. It is stronger upstream.",[692,31179,31180],{},"Based on publicly disclosed data, the company has built unusually detailed visibility into palm sourcing, including high traceability to both mills and plantations.",[692,31182,31183],{},"That matters because in beauty and personal care, the hardest resource question is often not the bottle. It is the agricultural and chemical system behind the bottle.",[692,31185,31186],{},"In plain English, Kao looks stronger at responsible input management than at consumer-facing circular theater.",[882,31188,29161],{"id":29160},[692,31190,31191],{},"Based on publicly disclosed data, Kao reported:",[751,31193,31194,31201,31207],{},[754,31195,31130,31196,31198,31199,31136],{},[894,31197,31133],{}," down ",[702,31200,29771],{},[754,31202,31203,31204,31206],{},"a long-range pathway to ",[894,31205,31164],{}," carbon zero",[754,31208,31209,31210,31169],{},"an ambition to become ",[894,31211,31168],{},[692,31213,31214],{},"The company also treats forest risk, water, and land-use issues as part of the environmental picture, which makes the report more complete than a pure carbon document.",[692,31216,31217],{},"The limitation is that the pace of absolute climate progress is less dramatic than the very top operational decarbonizers. So Kao scores high, but not because it has the flashiest headline number. It scores high because the system is serious.",[882,31219,29194],{"id":29193},[692,31221,31222],{},"This is a major strength.",[692,31224,31225],{},"Based on publicly disclosed data, Kao has built supplier-side support and grievance systems that many beauty peers still lack:",[751,31227,31228,31233],{},[754,31229,31230,31232],{},[702,31231,31151],{}," smallholders supported",[754,31234,31235],{},"grievance handling extended to hundreds of smallholders",[692,31237,31238],{},"That makes the social story more credible because it is tied to real supply-chain relationships instead of only employee or philanthropic messaging.",[692,31240,31241],{},"When a company ties traceability to smallholder support and grievance systems, it signals that responsible sourcing is being treated as an operational responsibility.",[882,31243,29218],{"id":29217},[692,31245,31246],{},"Kao's sustainability strategy also makes business sense.",[692,31248,31249],{},"Based on publicly disclosed data, the economic value comes from:",[751,31251,31252,31255,31258,31261],{},[754,31253,31254],{},"lower long-run supply disruption risk",[754,31256,31257],{},"stronger input traceability",[754,31259,31260],{},"better regulatory preparedness",[754,31262,31263],{},"a more defensible premium-quality system across beauty and personal care",[692,31265,31266],{},"This is not the easiest story to sell in one campaign line, but it is a durable one.",[692,31268,31269],{},"In practical terms, Kao looks like a company trying to reduce the cost of future risk, not just the cost of current packaging.",[882,31271,31273],{"id":31272},"so-is-kao-actually-eco-friendly","So, is Kao actually eco-friendly?",[692,31275,31276],{},[702,31277,31278],{},"More disciplined and more transparent upstream than many beauty companies? Yes.",[692,31280,31281],{},[702,31282,31283],{},"The simplest or most visible consumer-facing sustainability story in the category? No.",[692,31285,31286],{},"That is the right reading.",[692,31288,31289],{},"Based on publicly disclosed data, Kao deserves credit for:",[751,31291,31292,31295,31298,31301],{},[754,31293,31294],{},"unusually strong traceability systems",[754,31296,31297],{},"real supplier-side social infrastructure",[754,31299,31300],{},"environmental risk management that goes beyond carbon headlines",[754,31302,31303],{},"a sustainability model tied to long-run operating resilience",[692,31305,29281],{},[751,31307,31308,31311,31314],{},[754,31309,31310],{},"faster visible absolute climate improvement",[754,31312,31313],{},"clearer consumer-facing circularity wins",[754,31315,31316],{},"continued pressure on the highest-risk agricultural inputs",[882,31318,29296],{"id":29295},[728,31320,31322],{"id":31321},"what-kao-does-well","What Kao does well",[751,31324,31325,31328,31331,31334],{},[754,31326,31327],{},"treats traceability as real infrastructure",[754,31329,31330],{},"combines environmental and social risk management better than most peers",[754,31332,31333],{},"builds sustainability around supplier-side execution, not only packaging",[754,31335,31336],{},"makes the governance case highly credible",[728,31338,29318],{"id":29317},[751,31340,31341,31344,31347],{},[754,31342,31343],{},"stronger consumer-legible circularity proof",[754,31345,31346],{},"more dramatic near-term climate gains",[754,31348,31349],{},"continued closure of the remaining plantation-traceability gap",[882,31351,29333],{"id":29332},[692,31353,31354],{},"Kao's latest sustainability report is worth reading because it shows what beauty sustainability looks like when it is managed from the inside out.",[692,31356,31357],{},"That is why it lands near the top of this ranking.",[692,31359,29342],{},[7129,31361,31362],{},[692,31363,31364],{},"Kao may not have the loudest sustainability aesthetic in beauty, but it has one of the more serious operating systems behind the claims.",{"title":613,"searchDepth":847,"depth":847,"links":31366},[31367,31368,31369,31370,31371,31372,31373,31377],{"id":29077,"depth":847,"text":29078},{"id":29136,"depth":847,"text":29137},{"id":29160,"depth":847,"text":29161},{"id":29193,"depth":847,"text":29194},{"id":29217,"depth":847,"text":29218},{"id":31272,"depth":847,"text":31273},{"id":29295,"depth":847,"text":29296,"children":31374},[31375,31376],{"id":31321,"depth":850,"text":31322},{"id":29317,"depth":850,"text":29318},{"id":29332,"depth":847,"text":29333},"A plain-English breakdown of Kao's latest sustainability disclosures across traceability, climate progress, social responsibility, and business durability.",{},{"title":645},{"title":31039,"description":31382},"Is Kao actually eco-friendly? A practical reading of Kao's latest sustainability disclosures across palm traceability, climate progress, social systems, and operational resilience.","3fKv8KtBHggwXpAdVdH4CJD9KfhaXIzgWAYaXQNtxRg",{"id":31385,"title":31048,"badge":11642,"body":31386,"category":687,"description":31645,"extension":856,"links":687,"meta":31646,"navigation":31647,"path":650,"seo":31648,"stem":651,"tags":687,"__hash__":31650},"docs_en/en/4.brand-reports/loccitane-group-sustainability-report-2025.md",{"type":689,"value":31387,"toc":31632},[31388,31391,31399,31402,31405,31407,31410,31442,31445,31447,31450,31453,31456,31459,31461,31463,31480,31483,31486,31488,31491,31493,31505,31508,31511,31513,31516,31518,31531,31534,31537,31541,31546,31551,31554,31557,31571,31573,31584,31586,31590,31604,31606,31617,31619,31622,31625,31627],[29056,31389,31048],{"id":31390},"loccitane-group-sustainability-report-2025",[692,31392,29061,31393,29065,31396,880],{},[702,31394,31395],{},"\"Is L'Occitane Group actually eco-friendly?\"",[702,31397,31398],{},"L'Occitane Group is one of the more beauty-native sustainability stories in the market, but parts of its upstream traceability system are still incomplete",[692,31400,31401],{},"That is the balance to keep in mind.",[692,31403,31404],{},"Based on publicly disclosed data, the group scores well because refill systems, renewable electricity, biodiversity language, supplier assessment, and living-wage coverage all show up in the same report. That combination is stronger than a standard premium-beauty ESG presentation.",[882,31406,29078],{"id":29077},[692,31408,31409],{},"Based on publicly disclosed data, L'Occitane Group reported:",[751,31411,31412,31417,31425,31430,31436],{},[754,31413,31414,31416],{},[702,31415,30774],{}," renewable electricity",[754,31418,31419,31198,31421,31424],{},[894,31420,29401],{},[702,31422,31423],{},"30%"," versus the FY2020 baseline",[754,31426,31427,31429],{},[702,31428,29895],{}," living-wage coverage for employees",[754,31431,31432,31435],{},[702,31433,31434],{},"78.5%"," of direct suppliers assessed through EcoVadis",[754,31437,31438,31441],{},[702,31439,31440],{},"54%"," traceability for plant ingredients",[692,31443,31444],{},"That is enough to treat the report seriously.",[882,31446,29137],{"id":29136},[692,31448,31449],{},"This is where the group feels most category-native.",[692,31451,31452],{},"Based on publicly disclosed data, refill systems and lower-plastic product formats remain central to the beauty proposition. The company's packaging and refill story is easier for ordinary shoppers to understand than the more governance-heavy strategies used by some peers.",[692,31454,31455],{},"That matters because in beauty, consumer behavior only changes when the lower-waste option is still attractive, premium, and convenient.",[692,31457,31458],{},"L'Occitane performs well here because the sustainability design feels close to the product experience, not separate from it.",[882,31460,29161],{"id":29160},[692,31462,29447],{},[751,31464,31465,31469,31477],{},[754,31466,29774,31467],{},[702,31468,30774],{},[754,31470,31471,31473,31474,31476],{},[894,31472,29401],{}," emissions are down ",[702,31475,31423],{}," from the FY2020 baseline",[754,31478,31479],{},"biodiversity-positive land-footprint work is already visible in parts of the portfolio",[692,31481,31482],{},"This makes the environmental story broader than \"less plastic.\"",[692,31484,31485],{},"The strongest point is that the group tries to connect climate and biodiversity in a way that makes sense for ingredient-led beauty brands. The main limitation is that not every upstream system is yet fully traceable.",[882,31487,29194],{"id":29193},[692,31489,31490],{},"This is another area where the group performs well.",[692,31492,29447],{},[751,31494,31495,31500],{},[754,31496,31497,31499],{},[702,31498,29895],{}," of employees are covered by a living wage",[754,31501,31502,31504],{},[702,31503,31434],{}," of direct suppliers are assessed through EcoVadis",[692,31506,31507],{},"Those are serious signals because they move the report beyond brand sentiment and into labor and supplier-management practice.",[692,31509,31510],{},"The social story is especially strong when combined with the group's broader language around empowerment and producer relationships. It is not perfect, but it is more structured than average.",[882,31512,29218],{"id":29217},[692,31514,31515],{},"L'Occitane Group also has a sensible beauty-economics case.",[692,31517,30583],{},[751,31519,31520,31523,31525,31528],{},[754,31521,31522],{},"refill-driven repeat purchasing",[754,31524,29229],{},[754,31526,31527],{},"ingredient-story credibility",[754,31529,31530],{},"lower long-run regulatory and sourcing friction",[692,31532,31533],{},"This is not just a compliance investment. It is part of how the group defends a premium beauty position.",[692,31535,31536],{},"That gives the strategy more staying power than a model based only on one-off campaigns.",[882,31538,31540],{"id":31539},"so-is-loccitane-group-actually-eco-friendly","So, is L'Occitane Group actually eco-friendly?",[692,31542,31543],{},[702,31544,31545],{},"More credible than the average premium beauty company? Yes.",[692,31547,31548],{},[702,31549,31550],{},"Fully through the hardest upstream traceability work? Not yet.",[692,31552,31553],{},"That is the honest answer.",[692,31555,31556],{},"Based on publicly disclosed data, the group deserves credit for:",[751,31558,31559,31562,31565,31568],{},[754,31560,31561],{},"refill and lower-plastic systems that are easy to understand",[754,31563,31564],{},"strong renewable-electricity performance",[754,31566,31567],{},"serious living-wage coverage",[754,31569,31570],{},"supplier assessment depth that is better than many peers",[692,31572,29581],{},[751,31574,31575,31578,31581],{},[754,31576,31577],{},"fuller plant-ingredient traceability",[754,31579,31580],{},"more complete supplier coverage",[754,31582,31583],{},"continued proof that biodiversity claims are scaling across the whole group",[882,31585,29296],{"id":29295},[728,31587,31589],{"id":31588},"what-loccitane-group-does-well","What L'Occitane Group does well",[751,31591,31592,31595,31598,31601],{},[754,31593,31594],{},"makes sustainability legible inside the product experience",[754,31596,31597],{},"combines refill logic with premium-brand positioning",[754,31599,31600],{},"shows better labor and supplier signals than many beauty peers",[754,31602,31603],{},"gives biodiversity a more operational role than average",[728,31605,29318],{"id":29317},[751,31607,31608,31611,31614],{},[754,31609,31610],{},"full upstream traceability",[754,31612,31613],{},"wider supplier assessment coverage",[754,31615,31616],{},"more complete evidence that group-wide execution matches the strongest brand-level stories",[882,31618,29333],{"id":29332},[692,31620,31621],{},"L'Occitane Group's FY2025 sustainability report stands out because it feels like beauty sustainability, not just corporate sustainability applied to beauty.",[692,31623,31624],{},"That is why it places in the upper tier of this list.",[692,31626,29342],{},[7129,31628,31629],{},[692,31630,31631],{},"L'Occitane Group is strongest when sustainability shows up in the refill, ingredient, and premium-brand experience all at once, but the remaining upstream traceability gap still matters.",{"title":613,"searchDepth":847,"depth":847,"links":31633},[31634,31635,31636,31637,31638,31639,31640,31644],{"id":29077,"depth":847,"text":29078},{"id":29136,"depth":847,"text":29137},{"id":29160,"depth":847,"text":29161},{"id":29193,"depth":847,"text":29194},{"id":29217,"depth":847,"text":29218},{"id":31539,"depth":847,"text":31540},{"id":29295,"depth":847,"text":29296,"children":31641},[31642,31643],{"id":31588,"depth":850,"text":31589},{"id":29317,"depth":850,"text":29318},{"id":29332,"depth":847,"text":29333},"A plain-English breakdown of L'Occitane Group's FY2025 sustainability performance across refill systems, biodiversity, social responsibility, and premium-beauty economics.",{},{"title":649},{"title":31048,"description":31649},"Is L'Occitane Group actually eco-friendly? A practical reading of its FY2025 sustainability disclosures across refill systems, renewable electricity, biodiversity, and living-wage progress.","EEFJy2MyTz2SxNXd5dyroBHYfEX8UoYrxhp3zAxRvqY",{"id":31652,"title":31025,"badge":11642,"body":31653,"category":687,"description":31943,"extension":856,"links":687,"meta":31944,"navigation":31945,"path":654,"seo":31946,"stem":655,"tags":687,"__hash__":31948},"docs_en/en/4.brand-reports/loreal-sustainability-report-2025.md",{"type":689,"value":31654,"toc":31930},[31655,31658,31666,31669,31672,31674,31677,31718,31721,31723,31726,31729,31746,31749,31752,31754,31757,31772,31775,31778,31780,31783,31786,31799,31802,31805,31807,31810,31813,31816,31819,31832,31835,31839,31844,31849,31851,31854,31868,31871,31882,31884,31888,31902,31904,31915,31917,31920,31923,31925],[29056,31656,31025],{"id":31657},"loreal-sustainability-report-2025",[692,31659,29061,31660,29065,31663,880],{},[702,31661,31662],{},"\"Is L'Oreal actually eco-friendly?\"",[702,31664,31665],{},"L'Oreal is one of the strongest large-scale beauty companies on sustainability, but it is still not fully through the hardest part of the climate transition",[692,31667,31668],{},"That is the key takeaway.",[692,31670,31671],{},"Based on publicly disclosed data, L'Oreal is no longer just talking about nicer packaging or softer brand language. It is operating a large sustainability system across materials, energy, water, sourcing, and disclosure. The reason it ranks so highly is not that it has solved everything. It is that it can show real progress at global scale.",[882,31673,29078],{"id":29077},[692,31675,31676],{},"Based on publicly disclosed data, L'Oreal reported several high-signal results in 2025:",[751,31678,31679,31688,31694,31700,31706,31712],{},[754,31680,31681,720,31683,29406,31685,30757],{},[894,31682,29401],{},[894,31684,29761],{},[702,31686,31687],{},"58%",[754,31689,31690,31691],{},"operated sites and stores reached ",[702,31692,31693],{},"100% renewable energy",[754,31695,31696,31699],{},[702,31697,31698],{},"67%"," of formula ingredients were bio-based, derived from abundant minerals, or from circular processes",[754,31701,31702,31705],{},[702,31703,31704],{},"44%"," of packaging materials came from recycled or bio-based sources",[754,31707,31708,31711],{},[702,31709,31710],{},"56%"," of industrial water used in plants came from recycled or reused water",[754,31713,31714,31717],{},[702,31715,31716],{},"114,900"," people accessed work opportunities through inclusive sourcing programs",[692,31719,31720],{},"Those numbers do not make L'Oreal low-impact. They do make it one of the more credible beauty companies at turning sustainability into repeatable operating practice.",[882,31722,29137],{"id":29136},[692,31724,31725],{},"This is one of L'Oreal's strongest areas.",[692,31727,31728],{},"Based on publicly disclosed data, the company has made measurable progress on both formulas and packaging:",[751,31730,31731,31736,31741],{},[754,31732,31733,31734],{},"ingredients with lower-resource profiles reached ",[702,31735,31698],{},[754,31737,31738,31739],{},"recycled or bio-based packaging materials reached ",[702,31740,31704],{},[754,31742,31743,31744],{},"water reuse in industrial plants reached ",[702,31745,31710],{},[692,31747,31748],{},"That matters because beauty sustainability is often reduced to outer packaging. L'Oreal's disclosures suggest the company is pushing the resource question deeper into product formulation, plant operations, and packaging inputs at the same time.",[692,31750,31751],{},"The important nuance is that a company of this size still moves a very large volume of product. So the story is not \"small footprint.\" The story is \"better resource discipline than most companies operating at this scale.\"",[882,31753,29161],{"id":29160},[692,31755,31756],{},"Based on publicly disclosed data, L'Oreal's operational climate performance looks strong:",[751,31758,31759,31768],{},[754,31760,31761,720,31763,31765,31766,30757],{},[894,31762,29401],{},[894,31764,29761],{}," were down ",[702,31767,31687],{},[754,31769,31690,31770],{},[702,31771,31693],{},[692,31773,31774],{},"That is serious progress, especially for a global beauty company with a large manufacturing and retail footprint.",[692,31776,31777],{},"But the report also needs to be read carefully. Operational decarbonization is only part of the environmental picture. The harder issue remains upstream and downstream emissions, where packaging, ingredients, transport, and consumer use all matter. In plain English, L'Oreal looks strongest where it has direct control and still has more work where the system is more distributed.",[882,31779,29194],{"id":29193},[692,31781,31782],{},"Based on publicly disclosed data, the social story is stronger than many beauty peers because it extends beyond employee messaging into sourcing and supplier oversight.",[692,31784,31785],{},"The clearest signals are:",[751,31787,31788,31793],{},[754,31789,31790,31792],{},[702,31791,31716],{}," work opportunities created through inclusive sourcing",[754,31794,31795,31798],{},[702,31796,31797],{},"1,499"," supplier social audits",[692,31800,31801],{},"That does not eliminate supply-chain risk. But it shows that L'Oreal is at least building the governance and monitoring architecture needed to manage labor and sourcing issues at global scale.",[692,31803,31804],{},"This matters because beauty brands often look responsible in campaigns while saying little about who actually makes or supplies the products. L'Oreal is not fully transparent on everything, but it is more structured than average.",[882,31806,29218],{"id":29217},[692,31808,31809],{},"This is where L'Oreal gains an advantage over many sustainability narratives in beauty.",[692,31811,31812],{},"Based on publicly disclosed data, the company has the scale, margins, and capital base to keep funding energy transition, packaging redesign, factory improvements, and sourcing oversight. That sounds unglamorous, but it is important.",[692,31814,31815],{},"Sustainability programs look different when a company can actually pay for them over multiple years.",[692,31817,31818],{},"In business terms, L'Oreal's sustainability work supports:",[751,31820,31821,31824,31827,31829],{},[754,31822,31823],{},"regulatory resilience",[754,31825,31826],{},"supply security",[754,31828,30875],{},[754,31830,31831],{},"lower long-run resource inefficiency",[692,31833,31834],{},"That does not mean sustainability is automatically profitable in every line item. It means L'Oreal has made the strategy financially durable.",[882,31836,31838],{"id":31837},"so-is-loreal-actually-eco-friendly","So, is L'Oreal actually eco-friendly?",[692,31840,31841],{},[702,31842,31843],{},"More credible than most large beauty peers? Yes.",[692,31845,31846],{},[702,31847,31848],{},"Fully low-impact across the whole value chain? Not yet.",[692,31850,29261],{},[692,31852,31853],{},"Based on publicly disclosed data, L'Oreal deserves credit for:",[751,31855,31856,31859,31862,31865],{},[754,31857,31858],{},"large-scale operational decarbonization",[754,31860,31861],{},"strong resource-efficiency progress",[754,31863,31864],{},"better-than-average disclosure quality",[754,31866,31867],{},"a sustainability strategy that looks financially durable",[692,31869,31870],{},"But it still needs stronger proof on:",[751,31872,31873,31876,31879],{},[754,31874,31875],{},"deeper value-chain emissions cuts",[754,31877,31878],{},"the full absolute footprint of a very large product portfolio",[754,31880,31881],{},"how quickly upstream material systems can improve further",[882,31883,29296],{"id":29295},[728,31885,31887],{"id":31886},"what-loreal-does-well","What L'Oreal does well",[751,31889,31890,31893,31896,31899],{},[754,31891,31892],{},"executes sustainability at a scale few beauty companies can match",[754,31894,31895],{},"moves beyond packaging aesthetics into formulas, water, and energy",[754,31897,31898],{},"discloses enough hard metrics to make external scrutiny possible",[754,31900,31901],{},"has the economic strength to keep investing in the transition",[728,31903,29318],{"id":29317},[751,31905,31906,31909,31912],{},[754,31907,31908],{},"faster improvement on full value-chain emissions",[754,31910,31911],{},"clearer evidence that scale is being decoupled from total footprint",[754,31913,31914],{},"continued pressure on supplier-side and ingredient-side impacts",[882,31916,29333],{"id":29332},[692,31918,31919],{},"L'Oreal's 2025 sustainability report does not read like a niche green-beauty story. It reads like a global beauty giant trying to turn sustainability into infrastructure.",[692,31921,31922],{},"That is why it ranks first here.",[692,31924,29342],{},[7129,31926,31927],{},[692,31928,31929],{},"L'Oreal is not the lowest-impact beauty company in the market, but it is one of the most convincing examples of a large beauty company making sustainability operational rather than decorative.",{"title":613,"searchDepth":847,"depth":847,"links":31931},[31932,31933,31934,31935,31936,31937,31938,31942],{"id":29077,"depth":847,"text":29078},{"id":29136,"depth":847,"text":29137},{"id":29160,"depth":847,"text":29161},{"id":29193,"depth":847,"text":29194},{"id":29217,"depth":847,"text":29218},{"id":31837,"depth":847,"text":31838},{"id":29295,"depth":847,"text":29296,"children":31939},[31940,31941],{"id":31886,"depth":850,"text":31887},{"id":29317,"depth":850,"text":29318},{"id":29332,"depth":847,"text":29333},"A plain-English breakdown of L'Oreal's 2025 sustainability performance across resource efficiency, climate execution, social responsibility, and business durability.",{},{"title":653},{"title":31025,"description":31947},"Is L'Oreal actually eco-friendly? A practical reading of L'Oreal's 2025 sustainability disclosures across packaging, climate, sourcing, and long-run business strength.","OmXixoifDt8C7BuS5mFUcTo2gjoPYzOWEkvbd8UCEQg",{"id":31950,"title":31030,"badge":11642,"body":31951,"category":687,"description":32195,"extension":856,"links":687,"meta":32196,"navigation":32197,"path":658,"seo":32198,"stem":659,"tags":687,"__hash__":32200},"docs_en/en/4.brand-reports/natura-sustainability-report-2025.md",{"type":689,"value":31952,"toc":32182},[31953,31956,31964,31967,31970,31972,31975,31999,32002,32004,32007,32009,32022,32025,32027,32030,32039,32042,32045,32047,32050,32053,32056,32059,32061,32064,32067,32081,32084,32087,32091,32096,32101,32103,32106,32120,32123,32134,32136,32140,32154,32156,32167,32169,32172,32175,32177],[29056,31954,31030],{"id":31955},"natura-sustainability-report-2025",[692,31957,29061,31958,29065,31961,880],{},[702,31959,31960],{},"\"Is Natura actually eco-friendly?\"",[702,31962,31963],{},"Natura is still one of the few beauty companies where sustainability looks built into the brand model itself, not added on later",[692,31965,31966],{},"That is why it ranks so highly.",[692,31968,31969],{},"Based on publicly disclosed data, Natura's sustainability story is stronger than a standard beauty packaging narrative. The company links products to biodiversity sourcing, refill systems, community livelihoods, and long-term brand identity in a way that is unusually coherent.",[882,31971,29078],{"id":29077},[692,31973,31974],{},"Based on publicly disclosed data, Natura's latest disclosures show several signals that matter:",[751,31976,31977,31983,31989,31996],{},[754,31978,31979,31980],{},"the product portfolio is about ",[702,31981,31982],{},"95% vegan",[754,31984,31985,31986],{},"the company has maintained a long-running carbon-neutral pathway since ",[702,31987,31988],{},"2007",[754,31990,31991,31992,31995],{},"its sourcing model supports more than ",[702,31993,31994],{},"2.2 million hectares"," of conserved Amazon forest",[754,31997,31998],{},"the biodiversity model has supported thousands of families through long-term community relationships",[692,32000,32001],{},"This does not make Natura impact-free. It does make Natura one of the strongest examples of a beauty company whose sustainability logic reaches ingredients, communities, and brand economics at the same time.",[882,32003,29137],{"id":29136},[692,32005,32006],{},"Natura performs well here because the resource story is not limited to outer packaging.",[692,32008,29496],{},[751,32010,32011,32014,32019],{},[754,32012,32013],{},"refill logic is built into the commercial model",[754,32015,32016,32017],{},"the portfolio is about ",[702,32018,31982],{},[754,32020,32021],{},"biodiversity ingredients are positioned as long-term renewable inputs rather than purely extractive commodities",[692,32023,32024],{},"In plain English, Natura tries to make beauty products with lower dependence on animal-derived inputs and a more circular consumption pattern. That is more substantial than simply launching a few refill pilots and turning them into campaign language.",[882,32026,29161],{"id":29160},[692,32028,32029],{},"Based on publicly disclosed data, Natura remains notable because climate and nature are closely linked in its business narrative.",[692,32031,32032,32033,32035,32036,32038],{},"The company has maintained a carbon-neutral pathway since ",[702,32034,31988],{},", and its sourcing ecosystem is tied to more than ",[702,32037,31994],{}," of conserved Amazon forest.",[692,32040,32041],{},"That matters because many beauty brands speak fluently about climate but less clearly about biodiversity. Natura's environmental story is stronger precisely because it treats forests, ingredients, and climate as connected systems.",[692,32043,32044],{},"The main caution is that nature-linked business models are only as strong as their execution and traceability over time. So the company deserves credit, but also continued scrutiny.",[882,32046,29194],{"id":29193},[692,32048,32049],{},"This is arguably Natura's most differentiated strength.",[692,32051,32052],{},"Based on publicly disclosed data, the company has built long-term relationships with sourcing communities and family networks connected to biodiversity supply chains. That gives the social case more substance than a simple philanthropy program.",[692,32054,32055],{},"The important point is not just that Natura supports communities. It is that community relationships are presented as part of how the company creates product value in the first place.",[692,32057,32058],{},"That is a stronger sustainability model than one where social impact sits off to the side of the business.",[882,32060,29218],{"id":29217},[692,32062,32063],{},"Natura also performs well here, though in a different way from L'Oreal.",[692,32065,32066],{},"Based on publicly disclosed data, the economic value of Natura's sustainability strategy comes from:",[751,32068,32069,32072,32075,32078],{},[754,32070,32071],{},"brand differentiation",[754,32073,32074],{},"refill and repeat-purchase logic",[754,32076,32077],{},"premium identity linked to biodiversity credibility",[754,32079,32080],{},"consumer trust built around long-term mission consistency",[692,32082,32083],{},"This is less about brute-scale capital strength and more about strategic coherence.",[692,32085,32086],{},"In plain English: sustainability is part of why Natura is Natura.",[882,32088,32090],{"id":32089},"so-is-natura-actually-eco-friendly","So, is Natura actually eco-friendly?",[692,32092,32093],{},[702,32094,32095],{},"More structurally sustainable than most beauty brands? Yes.",[692,32097,32098],{},[702,32099,32100],{},"Completely free of supply-chain and scaling risk? No.",[692,32102,30298],{},[692,32104,32105],{},"Based on publicly disclosed data, Natura deserves real credit for:",[751,32107,32108,32111,32114,32117],{},[754,32109,32110],{},"treating biodiversity as a business system, not a slogan",[754,32112,32113],{},"building refill and lower-waste logic into product culture",[754,32115,32116],{},"connecting social impact to actual sourcing relationships",[754,32118,32119],{},"making sustainability central to long-term brand economics",[692,32121,32122],{},"It still needs continued proof on:",[751,32124,32125,32128,32131],{},[754,32126,32127],{},"supply-chain consistency at scale",[754,32129,32130],{},"how much of the model remains resilient under economic and portfolio pressure",[754,32132,32133],{},"the long-term measurability of all biodiversity-linked claims",[882,32135,29296],{"id":29295},[728,32137,32139],{"id":32138},"what-natura-does-well","What Natura does well",[751,32141,32142,32145,32148,32151],{},[754,32143,32144],{},"embeds sustainability into product identity rather than campaign language",[754,32146,32147],{},"makes the social and environmental story feel operationally connected",[754,32149,32150],{},"gives beauty buyers a more legible nature-positive model than most peers",[754,32152,32153],{},"turns mission consistency into commercial differentiation",[728,32155,29318],{"id":29317},[751,32157,32158,32161,32164],{},[754,32159,32160],{},"even deeper quantified disclosure across all operating segments",[754,32162,32163],{},"clearer year-to-year evidence on the hardest value-chain trade-offs",[754,32165,32166],{},"continued discipline as governance and portfolio structures evolve",[882,32168,29333],{"id":29332},[692,32170,32171],{},"Natura's 2025 sustainability report is valuable because it shows what beauty sustainability looks like when it shapes the business model instead of decorating it.",[692,32173,32174],{},"That is rare.",[692,32176,29342],{},[7129,32178,32179],{},[692,32180,32181],{},"Natura is not just selling lower-impact products. It is trying to prove that beauty can create value through biodiversity, refill behavior, and community-linked sourcing at the same time.",{"title":613,"searchDepth":847,"depth":847,"links":32183},[32184,32185,32186,32187,32188,32189,32190,32194],{"id":29077,"depth":847,"text":29078},{"id":29136,"depth":847,"text":29137},{"id":29160,"depth":847,"text":29161},{"id":29193,"depth":847,"text":29194},{"id":29217,"depth":847,"text":29218},{"id":32089,"depth":847,"text":32090},{"id":29295,"depth":847,"text":29296,"children":32191},[32192,32193],{"id":32138,"depth":850,"text":32139},{"id":29317,"depth":850,"text":29318},{"id":29332,"depth":847,"text":29333},"A plain-English breakdown of Natura's 2025 sustainability performance across biodiversity sourcing, circular beauty, social responsibility, and long-run brand economics.",{},{"title":657},{"title":31030,"description":32199},"Is Natura actually eco-friendly? A practical reading of Natura's 2025 disclosures across Amazon sourcing, refill logic, social impact, and business durability.","VAg1W1mSmBfp1ay5JL00QCUrzQBABBxZ5cKTJE0HoQ4",{"id":32202,"title":31071,"badge":11642,"body":32203,"category":687,"description":32765,"extension":856,"links":687,"meta":32766,"navigation":32767,"path":662,"seo":32768,"stem":663,"tags":687,"__hash__":32770},"docs_en/en/4.brand-reports/nike-sustainability-report-2024.md",{"type":689,"value":32204,"toc":32742},[32205,32208,32216,32218,32221,32229,32232,32234,32237,32282,32285,32288,32314,32317,32321,32325,32328,32331,32352,32355,32358,32362,32365,32385,32388,32391,32395,32398,32413,32416,32420,32424,32427,32436,32439,32442,32453,32456,32459,32463,32475,32478,32484,32495,32498,32502,32506,32509,32531,32534,32537,32541,32548,32575,32578,32581,32584,32592,32596,32599,32601,32613,32616,32619,32630,32633,32636,32641,32645,32650,32655,32657,32660,32674,32677,32685,32687,32691,32705,32707,32724,32726,32729,32731,32734,32739],[29056,32206,31071],{"id":32207},"nike-sustainability-report-2024",[692,32209,29061,32210,29065,32213,880],{},[702,32211,32212],{},"\"Is Nike actually eco-friendly?\"",[702,32214,32215],{},"Nike is highly capable at scale, but its biggest sustainability problems now sit in the harder parts of the system, not the easy ones",[692,32217,31668],{},[692,32219,32220],{},"Based on publicly disclosed data, NIKE's FY24 performance looks strongest in operational decarbonization, materials strategy, and manufacturing waste reduction. But the report also exposes two problems that matter a lot:",[751,32222,32223,32226],{},[754,32224,32225],{},"finished-product circularity slowed sharply",[754,32227,32228],{},"broader supply-chain labor compliance became weaker once Nike looked beyond its core strategic factories",[692,32230,32231],{},"So this is not a simple \"Nike is green\" story. It is a story about a giant company making serious progress while still struggling where sustainability becomes operationally messy.",[882,32233,29078],{"id":29077},[692,32235,32236],{},"Based on publicly disclosed data, Nike's FY24 sustainability story has four clear signals:",[751,32238,32239,32246,32253,32259,32269,32275],{},[754,32240,32241,32242,32245],{},"preferred materials reached ",[702,32243,32244],{},"48%"," of material use",[754,32247,32248,32249,32252],{},"recycled polyester reached ",[702,32250,32251],{},"63%"," of total polyester use",[754,32254,32255,32256],{},"waste per product manufactured fell ",[702,32257,32258],{},"11%",[754,32260,32261,720,32263,29753,32265,32268],{},[894,32262,29401],{},[894,32264,29761],{},[702,32266,32267],{},"69%"," versus the FY20 baseline",[754,32270,32271,32272],{},"renewable electricity in owned or operated facilities reached ",[702,32273,32274],{},"96%",[754,32276,32277,32278,32281],{},"manufacturing and transportation emissions fell ",[702,32279,32280],{},"36%"," versus FY20",[692,32283,32284],{},"Those are strong results.",[692,32286,32287],{},"But the same report also shows where pressure is building:",[751,32289,32290,32299,32305],{},[754,32291,32292,32293,29402,32296],{},"finished-product waste recovery fell from ",[702,32294,32295],{},"17.9 million units",[702,32297,32298],{},"6.9 million units",[754,32300,32301,32302],{},"supply-chain compliance in expanded audit scope fell to ",[702,32303,32304],{},"87%",[754,32306,32307,32309,32310,32313],{},[894,32308,29405],{}," still represented about ",[702,32311,32312],{},"99.16%"," of total emissions",[692,32315,32316],{},"That combination makes Nike's report impressive and uncomfortable at the same time.",[882,32318,32320],{"id":32319},"where-nike-looks-strongest","Where Nike looks strongest",[728,32322,32324],{"id":32323},"materials-and-source-reduction-are-still-moving-forward","Materials and source reduction are still moving forward",[692,32326,32327],{},"Based on publicly disclosed data, Nike continues to make visible progress on the front end of resource efficiency.",[692,32329,32330],{},"The strongest signals are:",[751,32332,32333,32338,32342,32347],{},[754,32334,32241,32335,32337],{},[702,32336,32244],{}," of overall material use",[754,32339,32248,32340,32252],{},[702,32341,32251],{},[754,32343,32344,32345],{},"manufacturing waste per product fell ",[702,32346,32258],{},[754,32348,32349,32350],{},"operational waste was diverted from disposal at a rate of ",[702,32351,30768],{},[692,32353,32354],{},"This matters because front-end material decisions are where a lot of environmental leverage sits for a company of Nike's size. When a global brand increases recycled-content use and reduces waste intensity at the unit level, that change compounds across a very large product volume.",[692,32356,32357],{},"In plain English: Nike is still very good at optimizing the industrial side of the system.",[728,32359,32361],{"id":32360},"operational-decarbonization-is-not-the-weak-point","Operational decarbonization is not the weak point",[692,32363,32364],{},"Based on publicly disclosed data, Nike's owned and operated emissions profile improved sharply:",[751,32366,32367,32375,32380],{},[754,32368,32369,720,32371,29406,32373,32281],{},[894,32370,29401],{},[894,32372,29761],{},[702,32374,32267],{},[754,32376,32377,32378],{},"renewable electricity in owned and operated facilities reached ",[702,32379,32274],{},[754,32381,32382,32383,32281],{},"manufacturing and transportation emissions were down ",[702,32384,32280],{},[692,32386,32387],{},"Those numbers suggest real momentum rather than cosmetic progress.",[692,32389,32390],{},"The important point here is that Nike is no longer starting from a low bar in its own operations. At this stage, the harder question is not whether the company can clean up offices, stores, or direct facility electricity. It is whether it can push deeper into the supply chain and product-life cycle without losing speed.",[728,32392,32394],{"id":32393},"water-and-chemistry-work-also-show-real-discipline","Water and chemistry work also show real discipline",[692,32396,32397],{},"Based on publicly disclosed data, Nike also reported:",[751,32399,32400,32406],{},[754,32401,32402,32403,32405],{},"a ",[702,32404,29771],{}," reduction in freshwater use in textile dyeing and finishing",[754,32407,32408,32409,32412],{},"cleaner alternatives identified for ",[702,32410,32411],{},"6 of 10"," priority chemicals",[692,32414,32415],{},"That may sound less dramatic than carbon numbers, but it matters. Water and chemistry controls are often where apparel sustainability gets highly technical and easy for readers to overlook. These are real process-level improvements, not just brand-language upgrades.",[882,32417,32419],{"id":32418},"where-nikes-report-gets-more-difficult","Where Nike's report gets more difficult",[728,32421,32423],{"id":32422},"finished-product-circularity-took-a-clear-step-backward","Finished-product circularity took a clear step backward",[692,32425,32426],{},"This is one of the most important lines in the whole report.",[692,32428,32429,32430,32432,32433,32435],{},"Based on publicly disclosed data, finished-product waste processed through refurbishment, recycling, or donation fell from ",[702,32431,32295],{}," in FY23 to ",[702,32434,32298],{}," in FY24.",[692,32437,32438],{},"That is not a small decline. It is a major drop.",[692,32440,32441],{},"Why this matters:",[751,32443,32444,32447,32450],{},[754,32445,32446],{},"it weakens the back-end circularity story",[754,32448,32449],{},"it suggests friction in returns, refurbishment, redistribution, or recovery systems",[754,32451,32452],{},"it reduces the commercial and environmental value Nike could otherwise extract from returned or unsellable inventory",[692,32454,32455],{},"For a company that talks seriously about circularity, this is a meaningful setback.",[692,32457,32458],{},"It does not erase the materials and waste-reduction progress on the front end. But it does show that Nike is still much stronger at optimizing production than at closing the product loop after sale.",[728,32460,32462],{"id":32461},"scope-3-still-defines-the-environmental-reality","Scope 3 still defines the environmental reality",[692,32464,32465,32466,32469,32470,32472,32473,880],{},"Based on publicly disclosed data, Nike's total annual carbon footprint was about ",[702,32467,32468],{},"8.266 million metric tons CO2e",", and roughly ",[702,32471,32312],{}," of that sat in ",[894,32474,29405],{},[692,32476,32477],{},"That number matters more than any headline operational cut.",[692,32479,32480,32481,32483],{},"Because once ",[894,32482,29405],{}," dominates the total by that degree, the company faces a different kind of problem:",[751,32485,32486,32489,32492],{},[754,32487,32488],{},"it cannot decarbonize mainly through owned operations",[754,32490,32491],{},"it must influence suppliers, raw materials, transport, and product design",[754,32493,32494],{},"absolute scale itself becomes a structural sustainability challenge",[692,32496,32497],{},"This is why Nike's report should be read carefully. The company is making strong progress where it has direct control, but its real climate burden still sits where control is indirect and change is slower.",[882,32499,32501],{"id":32500},"the-social-story-is-strong-at-the-core-weaker-at-the-edges","The social story is strong at the core, weaker at the edges",[728,32503,32505],{"id":32504},"strategic-suppliers-look-much-better-than-before","Strategic suppliers look much better than before",[692,32507,32508],{},"Based on publicly disclosed data, Nike's core strategic supplier network showed major improvement:",[751,32510,32511,32520,32525],{},[754,32512,32513,32514,32517,32518],{},"health and safety maturity at ",[894,32515,32516],{},"Level 3"," reached ",[702,32519,32274],{},[754,32521,32522,32523],{},"gender-equity capability reached ",[702,32524,31698],{},[754,32526,32527,32528],{},"worker engagement reached ",[702,32529,32530],{},"75%",[692,32532,32533],{},"Those are serious gains, especially compared with Nike's own earlier baseline.",[692,32535,32536],{},"This suggests Nike has become much more capable at upgrading labor performance where it has close operational relationships and concentrated leverage.",[728,32538,32540],{"id":32539},"the-long-tail-supply-chain-is-where-the-comfort-disappears","The long-tail supply chain is where the comfort disappears",[692,32542,32543,32544,32547],{},"Based on publicly disclosed data, once Nike expanded its audit scope to include ",[894,32545,32546],{},"Tier 2"," suppliers and distribution centers, the picture became weaker:",[751,32549,32550,32555,32562,32569],{},[754,32551,32552,32553],{},"basic compliance fell to ",[702,32554,32304],{},[754,32556,32557,32558,32561],{},"this was ",[702,32559,32560],{},"7.6 percentage points below"," the FY20 baseline",[754,32563,32564,32565,32568],{},"working-hours violations reached ",[702,32566,32567],{},"48.5%"," in distribution centers",[754,32570,32564,32571,32574],{},[702,32572,32573],{},"15.6%"," in Tier 2 facilities",[692,32576,32577],{},"This is the kind of disclosure that matters.",[692,32579,32580],{},"It shows Nike's labor story is not uniform across the whole supply chain. The company looks much stronger in strategic factory programs than in the longer tail of materials and logistics operations.",[692,32582,32583],{},"That is a real ESG risk because it creates a familiar pattern:",[751,32585,32586,32589],{},[754,32587,32588],{},"polished performance at the center",[754,32590,32591],{},"weaker controls at the perimeter",[882,32593,32595],{"id":32594},"economic-implications-progress-and-friction-exist-together","Economic implications: progress and friction exist together",[692,32597,32598],{},"Nike's sustainability work still carries real economic logic.",[692,32600,29447],{},[751,32602,32603,32606],{},[754,32604,32605],{},"higher renewable electricity use and lower waste intensity should reduce long-run energy and material losses",[754,32607,32608,32609,32612],{},"programs such as ",[894,32610,32611],{},"Nike Refurbished"," still point to a credible resale and circular-value opportunity",[692,32614,32615],{},"But the downside is just as clear.",[692,32617,32618],{},"The sharp fall in finished-product recovery volume means:",[751,32620,32621,32624,32627],{},[754,32622,32623],{},"more inventory may lose value instead of being recovered",[754,32625,32626],{},"more units may require discounting, disposal, or lower-value handling",[754,32628,32629],{},"the circular business case becomes weaker when throughput drops",[692,32631,32632],{},"On top of that, weaker compliance in Tier 2 and distribution-center operations implies more audit, remediation, and risk-management cost ahead.",[692,32634,32635],{},"So the business reading is not \"sustainability is expensive\" or \"sustainability is profitable.\" It is more precise than that:",[7129,32637,32638],{},[692,32639,32640],{},"Nike is good at turning sustainability efficiency into value, but weak execution in circularity and compliance can still destroy part of that value.",[882,32642,32644],{"id":32643},"so-is-nike-actually-eco-friendly","So, is Nike actually eco-friendly?",[692,32646,32647],{},[702,32648,32649],{},"More efficient and more operationally disciplined than many peers? Yes.",[692,32651,32652],{},[702,32653,32654],{},"Fully aligned across the whole product life cycle and supply chain? Not yet.",[692,32656,29261],{},[692,32658,32659],{},"Based on publicly disclosed data, Nike deserves real credit for:",[751,32661,32662,32665,32668,32671],{},[754,32663,32664],{},"scaling preferred and recycled materials",[754,32666,32667],{},"cutting manufacturing waste",[754,32669,32670],{},"sharply reducing operational emissions",[754,32672,32673],{},"pushing renewable electricity close to full coverage in owned facilities",[692,32675,32676],{},"But the report also makes clear that Nike still faces two major unresolved issues:",[751,32678,32679,32682],{},[754,32680,32681],{},"finished-product circularity is not running smoothly enough",[754,32683,32684],{},"long-tail supply-chain labor controls are weaker than the headline story suggests",[882,32686,29296],{"id":29295},[728,32688,32690],{"id":32689},"what-nike-does-well","What Nike does well",[751,32692,32693,32696,32699,32702],{},[754,32694,32695],{},"executes large-scale operational decarbonization credibly",[754,32697,32698],{},"treats materials and manufacturing efficiency as real levers, not just messaging",[754,32700,32701],{},"shows measurable progress in water and chemical management",[754,32703,32704],{},"discloses uncomfortable issues instead of pretending the system is fully solved",[728,32706,29318],{"id":29317},[751,32708,32709,32712,32718,32721],{},[754,32710,32711],{},"restoring finished-product recovery, refurbishment, and circular throughput",[754,32713,32714,32715,32717],{},"turning ",[894,32716,29405],{}," ambition into deeper absolute supply-chain decarbonization",[754,32719,32720],{},"strengthening labor compliance beyond the most strategic suppliers",[754,32722,32723],{},"proving that circularity works at scale after the product leaves primary sale channels",[882,32725,29333],{"id":29332},[692,32727,32728],{},"Nike's FY24 sustainability report does not read like a failure. It reads like a very large company that has become highly competent in operational sustainability while still confronting harder structural problems in circularity and supply-chain governance.",[692,32730,30735],{},[692,32732,32733],{},"The strongest version of the story is this:",[7129,32735,32736],{},[692,32737,32738],{},"Nike is no longer struggling with the basics. It is now struggling with the advanced sustainability problems that appear once the basics are already in place.",[692,32740,32741],{},"That is still progress. But it is not the same thing as being fully sustainable.",{"title":613,"searchDepth":847,"depth":847,"links":32743},[32744,32745,32750,32754,32758,32759,32760,32764],{"id":29077,"depth":847,"text":29078},{"id":32319,"depth":847,"text":32320,"children":32746},[32747,32748,32749],{"id":32323,"depth":850,"text":32324},{"id":32360,"depth":850,"text":32361},{"id":32393,"depth":850,"text":32394},{"id":32418,"depth":847,"text":32419,"children":32751},[32752,32753],{"id":32422,"depth":850,"text":32423},{"id":32461,"depth":850,"text":32462},{"id":32500,"depth":847,"text":32501,"children":32755},[32756,32757],{"id":32504,"depth":850,"text":32505},{"id":32539,"depth":850,"text":32540},{"id":32594,"depth":847,"text":32595},{"id":32643,"depth":847,"text":32644},{"id":29295,"depth":847,"text":29296,"children":32761},[32762,32763],{"id":32689,"depth":850,"text":32690},{"id":29317,"depth":850,"text":29318},{"id":29332,"depth":847,"text":29333},"A plain-English breakdown of NIKE's FY24 sustainability performance, focusing on resource efficiency, carbon progress, supply-chain risk, and the business implications of stalled finished-product circularity.",{},{"title":661},{"title":31071,"description":32769},"Is Nike actually eco-friendly? A practical reading of NIKE's FY24 sustainability performance across materials, emissions, labor risk, and finished-product circularity.","QSz0O2NDjxKPgYyH8x_aOMKPTUXfmkZ4NB8H4fmg_r4",{"id":32772,"title":31062,"badge":11642,"body":32773,"category":687,"description":33037,"extension":856,"links":687,"meta":33038,"navigation":33039,"path":666,"seo":33040,"stem":667,"tags":687,"__hash__":33042},"docs_en/en/4.brand-reports/oriflame-sustainability-report-2025.md",{"type":689,"value":32774,"toc":33024},[32775,32778,32786,32789,32792,32794,32797,32832,32835,32837,32840,32843,32854,32857,32860,32862,32868,32871,32874,32876,32879,32882,32890,32893,32900,32902,32905,32908,32922,32925,32928,32931,32935,32940,32945,32947,32950,32964,32966,32976,32978,32982,32996,32998,33009,33011,33014,33017,33019],[29056,32776,31062],{"id":32777},"oriflame-sustainability-report-2025",[692,32779,29061,32780,29065,32783,880],{},[702,32781,32782],{},"\"Is Oriflame actually eco-friendly?\"",[702,32784,32785],{},"Oriflame looks more credible than many mid-tier beauty companies on disclosed sustainability metrics, but commercial weakness makes the long-run execution story less comfortable",[692,32787,32788],{},"That tension defines the report.",[692,32790,32791],{},"Based on publicly disclosed data, Oriflame's 2025 sustainability report is specific and useful. It gives real numbers on renewable electricity, recycled materials, refill savings, and supplier coverage. That is a better evidence base than many beauty companies provide. The challenge is that a weaker business backdrop can limit how aggressively those systems keep scaling.",[882,32793,29078],{"id":29077},[692,32795,32796],{},"Based on publicly disclosed data, Oriflame reported:",[751,32798,32799,32804,32810,32816,32823],{},[754,32800,32801,32803],{},[702,32802,29089],{}," across owned manufacturing, warehouses, and offices",[754,32805,29420,32806,32809],{},[702,32807,32808],{},"600 tons"," of recycled materials used in packaging",[754,32811,32812,32813],{},"packaging changes avoiding about ",[702,32814,32815],{},"659 tons CO2",[754,32817,32818,32819,32822],{},"refill initiatives avoiding about ",[702,32820,32821],{},"34.5 tons"," of plastic",[754,32824,29120,32825,32827,32828,32831],{},[702,32826,30774],{}," of Tier 1 suppliers assessed through ",[894,32829,32830],{},"EcoVadis"," or equivalent",[692,32833,32834],{},"Those are not vague claims.",[882,32836,29137],{"id":29136},[692,32838,32839],{},"This is one of Oriflame's clearest strengths.",[692,32841,32842],{},"Based on publicly disclosed data, the company is quantifying:",[751,32844,32845,32848,32851],{},[754,32846,32847],{},"recycled packaging material input",[754,32849,32850],{},"plastic savings from refill systems",[754,32852,32853],{},"carbon savings associated with packaging redesign",[692,32855,32856],{},"That matters because it makes the resource story concrete. It is not just \"we want to use less plastic.\" It is \"here is how much material and carbon we believe we avoided.\"",[692,32858,32859],{},"For a company at this scale, that is meaningful and comparatively transparent.",[882,32861,29161],{"id":29160},[692,32863,32864,32865,32867],{},"Based on publicly disclosed data, Oriflame already uses ",[702,32866,29089],{}," across owned operations.",[692,32869,32870],{},"That is a strong operational result.",[692,32872,32873],{},"But it also needs to be read in context. The bigger environmental question sits deeper in the supply chain, where ingredient sourcing, third-party manufacturing, and transport remain harder to see in full. So the report is strong on direct operations and more limited on the harder upstream picture.",[882,32875,29194],{"id":29193},[692,32877,32878],{},"Based on publicly disclosed data, the social story is strongest through supplier oversight and the broader beauty-entrepreneur network.",[692,32880,32881],{},"The key signal is:",[751,32883,32884],{},[754,32885,29120,32886,32827,32888,32831],{},[702,32887,30774],{},[894,32889,32830],{},[692,32891,32892],{},"That shows the company is using a real supplier-screening process rather than relying on brand sentiment alone.",[692,32894,32895,32896,32899],{},"The limitation is that most of this visibility remains concentrated at ",[894,32897,32898],{},"Tier 1",". For beauty, the harder questions often sit deeper in raw-material sourcing and processing.",[882,32901,29218],{"id":29217},[692,32903,32904],{},"This is where Oriflame becomes harder to score well.",[692,32906,32907],{},"Based on publicly disclosed data, the sustainability strategy should support:",[751,32909,32910,32913,32916,32919],{},[754,32911,32912],{},"lower energy risk",[754,32914,32915],{},"lower packaging intensity",[754,32917,32918],{},"stronger supplier discipline",[754,32920,32921],{},"some commercial value through refill and product-design improvements",[692,32923,32924],{},"But the company also faces a weaker business profile, and that matters.",[692,32926,32927],{},"In plain English, sustainability work is more fragile when the underlying company has less room for error.",[692,32929,32930],{},"That does not erase the environmental and resource-efficiency progress. It does make the long-run durability of the system less certain than at the higher-ranked brands.",[882,32932,32934],{"id":32933},"so-is-oriflame-actually-eco-friendly","So, is Oriflame actually eco-friendly?",[692,32936,32937],{},[702,32938,32939],{},"More transparent and more measurable than many beauty peers in its tier? Yes.",[692,32941,32942],{},[702,32943,32944],{},"Backed by the same level of strategic and financial durability as the top-ranked names? No.",[692,32946,30298],{},[692,32948,32949],{},"Based on publicly disclosed data, Oriflame deserves credit for:",[751,32951,32952,32955,32958,32961],{},[754,32953,32954],{},"clear reporting on recycled materials and refill savings",[754,32956,32957],{},"full renewable electricity in owned operations",[754,32959,32960],{},"strong Tier 1 supplier assessment coverage",[754,32962,32963],{},"a practical rather than theatrical sustainability style",[692,32965,29281],{},[751,32967,32968,32970,32973],{},[754,32969,30679],{},[754,32971,32972],{},"the durability of investment under commercial pressure",[754,32974,32975],{},"whether refill and materials programs can keep scaling without financial strain",[882,32977,29296],{"id":29295},[728,32979,32981],{"id":32980},"what-oriflame-does-well","What Oriflame does well",[751,32983,32984,32987,32990,32993],{},[754,32985,32986],{},"gives useful quantified packaging and materials evidence",[754,32988,32989],{},"already runs owned operations on renewable electricity",[754,32991,32992],{},"applies a real supplier-assessment system",[754,32994,32995],{},"makes the sustainability case understandable to readers",[728,32997,29318],{"id":29317},[751,32999,33000,33003,33006],{},[754,33001,33002],{},"deeper raw-material transparency beyond Tier 1 suppliers",[754,33004,33005],{},"stronger proof of long-run commercial resilience",[754,33007,33008],{},"more evidence that current programs can scale rather than plateau",[882,33010,29333],{"id":29332},[692,33012,33013],{},"Oriflame's 2025 sustainability report is better than many beauty readers would expect.",[692,33015,33016],{},"That is why it makes the Top 10.",[692,33018,29342],{},[7129,33020,33021],{},[692,33022,33023],{},"Oriflame looks like a company doing credible practical sustainability work, but its business pressure means the durability of that work still needs to be watched closely.",{"title":613,"searchDepth":847,"depth":847,"links":33025},[33026,33027,33028,33029,33030,33031,33032,33036],{"id":29077,"depth":847,"text":29078},{"id":29136,"depth":847,"text":29137},{"id":29160,"depth":847,"text":29161},{"id":29193,"depth":847,"text":29194},{"id":29217,"depth":847,"text":29218},{"id":32933,"depth":847,"text":32934},{"id":29295,"depth":847,"text":29296,"children":33033},[33034,33035],{"id":32980,"depth":850,"text":32981},{"id":29317,"depth":850,"text":29318},{"id":29332,"depth":847,"text":29333},"A plain-English breakdown of Oriflame's 2025 sustainability performance across packaging, renewable electricity, supplier responsibility, and commercial resilience.",{},{"title":665},{"title":31062,"description":33041},"Is Oriflame actually eco-friendly? A practical reading of Oriflame's 2025 sustainability disclosures across recycled materials, refill formats, renewable electricity, and execution risk.","5bqFChPevypaakdhePWm-OXKf_v7ktJ2lZeNlnbqWwQ",{"id":33044,"title":31076,"badge":11642,"body":33045,"category":687,"description":33691,"extension":856,"links":687,"meta":33692,"navigation":33693,"path":670,"seo":33694,"stem":671,"tags":687,"__hash__":33696},"docs_en/en/4.brand-reports/patagonia-sustainability-report-2025.md",{"type":689,"value":33046,"toc":33662},[33047,33050,33058,33060,33067,33070,33072,33075,33127,33130,33133,33150,33153,33157,33161,33164,33181,33184,33187,33195,33198,33202,33205,33208,33226,33229,33232,33236,33240,33243,33245,33258,33261,33264,33272,33275,33289,33293,33297,33300,33303,33323,33326,33330,33336,33339,33342,33345,33356,33359,33363,33372,33375,33382,33386,33390,33392,33433,33436,33439,33443,33446,33461,33464,33468,33472,33475,33477,33502,33505,33508,33512,33514,33532,33535,33538,33549,33552,33555,33559,33564,33569,33571,33574,33591,33594,33605,33607,33611,33628,33630,33644,33646,33649,33652,33654,33659],[29056,33048,31076],{"id":33049},"patagonia-sustainability-report-2025",[692,33051,29061,33052,29065,33055,880],{},[702,33053,33054],{},"\"Is Patagonia actually eco-friendly?\"",[702,33056,33057],{},"Patagonia remains one of the clearest mission-led sustainability brands in public view, but even here the hard parts of circularity and supply-chain decarbonization are not fully solved",[692,33059,30386],{},[692,33061,33062,33063,33066],{},"Based on publicly disclosed data, Patagonia's latest ",[894,33064,33065],{},"Work in Progress Report"," is unusually useful because it does not only celebrate wins. It also names uncomfortable gaps, especially around secondary-waste inputs and short-term emissions pressure.",[692,33068,33069],{},"That kind of honesty matters.",[882,33071,29078],{"id":29077},[692,33073,33074],{},"Based on publicly disclosed data, Patagonia looks especially strong in:",[751,33076,33077,33083,33088,33094,33099,33107,33117],{},[754,33078,33079,33080,33082],{},"preferred-material adoption at ",[702,33081,29735],{}," of fabric and trim by weight",[754,33084,33085,33087],{},[702,33086,29729],{}," organic cotton use",[754,33089,29120,33090,33093],{},[702,33091,33092],{},"80%"," recycled content across synthetic materials",[754,33095,33096,33098],{},[702,33097,30768],{}," renewable electricity in owned and operated offices and facilities",[754,33100,29420,33101,33104,33105,30474],{},[702,33102,33103],{},"95%"," of products made in ",[894,33106,30473],{},[754,33108,29120,33109,33112,33113,33116],{},[702,33110,33111],{},"$37 million"," in additional premiums delivered to more than ",[702,33114,33115],{},"85,000"," workers",[754,33118,33119,33120,33123,33124],{},"a business structure that has already directed about ",[702,33121,33122],{},"$180 million"," in dividends to ",[894,33125,33126],{},"Holdfast Collective",[692,33128,33129],{},"Those are unusually strong signals.",[692,33131,33132],{},"But the same report also makes clear that Patagonia still has real challenges:",[751,33134,33135,33144],{},[754,33136,33137,33138,33140,33141,33143],{},"only ",[702,33139,30488],{}," of synthetic fabrics came from secondary-waste sources, far below the prior ",[702,33142,29416],{}," ambition",[754,33145,33146,33147,33149],{},"FY25 greenhouse-gas emissions rose ",[702,33148,30485],{}," versus FY24 because of product-mix changes",[692,33151,33152],{},"So Patagonia's report is not \"perfect brand, perfect sustainability.\" It is a better version of something more credible: a company willing to expose its own bottlenecks.",[882,33154,33156],{"id":33155},"why-patagonia-still-stands-out","Why Patagonia still stands out",[728,33158,33160],{"id":33159},"materials-are-treated-as-a-system-problem-not-just-a-marketing-claim","Materials are treated as a system problem, not just a marketing claim",[692,33162,33163],{},"Based on publicly disclosed data, Patagonia has pushed materials strategy further than many mainstream apparel brands:",[751,33165,33166,33171,33176],{},[754,33167,32241,33168,33170],{},[702,33169,29735],{}," of fabrics and trims by weight",[754,33172,33173,33175],{},[702,33174,29729],{}," of cotton came from organic sources",[754,33177,29120,33178,33180],{},[702,33179,33092],{}," of synthetic materials came from recycled sources",[692,33182,33183],{},"That already places Patagonia in a stronger position than brands that still present sustainability mainly through capsule collections or selective product storytelling.",[692,33185,33186],{},"But what makes Patagonia more interesting is that the company does not stop at generic recycled-content language. It also distinguishes between:",[751,33188,33189,33192],{},[754,33190,33191],{},"recycled material that still depends on single-use bottle feedstock",[754,33193,33194],{},"more difficult secondary-waste streams such as used textiles and discarded fishing nets",[692,33196,33197],{},"That distinction is important because not all recycled inputs represent the same level of circular progress.",[728,33199,33201],{"id":33200},"durability-still-matters-more-than-trend-driven-sustainability-language","Durability still matters more than trend-driven sustainability language",[692,33203,33204],{},"One of Patagonia's strongest advantages is that it still treats product life extension as a serious sustainability lever.",[692,33206,33207],{},"Based on publicly disclosed data, the company points to:",[751,33209,33210,33216,33219],{},[754,33211,33212,33213],{},"long-term stress testing on core products such as the ",[894,33214,33215],{},"Nano Puff",[754,33217,33218],{},"design changes intended to reduce seam failures and improve abrasion resistance",[754,33220,33221,33222,33225],{},"repair, resale, and trade-in systems through ",[894,33223,33224],{},"Worn Wear"," and related channels",[692,33227,33228],{},"In plain English, Patagonia is still one of the few large apparel brands whose sustainability logic is visibly tied to product longevity rather than simply lower-impact materials at the moment of sale.",[692,33230,33231],{},"That matters because a durable garment that stays in use can outperform a \"sustainable\" product that gets replaced too quickly.",[882,33233,33235],{"id":33234},"where-the-circularity-story-gets-harder","Where the circularity story gets harder",[728,33237,33239],{"id":33238},"secondary-waste-inputs-are-still-far-behind-ambition","Secondary-waste inputs are still far behind ambition",[692,33241,33242],{},"This is one of the most useful disclosures in the whole report.",[692,33244,29447],{},[751,33246,33247,33252],{},[754,33248,29120,33249,33251],{},[702,33250,33092],{}," of synthetic materials were recycled",[754,33253,33254,33255,33257],{},"but only ",[702,33256,30488],{}," came from secondary-waste sources such as old textiles or discarded fishing nets",[692,33259,33260],{},"That matters because Patagonia had previously targeted a much higher share from these harder circular sources.",[692,33262,33263],{},"The company is not hiding the issue. It is effectively saying:",[751,33265,33266,33269],{},[754,33267,33268],{},"yes, we use a lot of recycled synthetics",[754,33270,33271],{},"no, we have not yet shifted enough of that system toward more difficult waste-stream recovery",[692,33273,33274],{},"That is a real circularity bottleneck, not a cosmetic one.",[692,33276,10617,33277,33280,33281,33284,33285,33288],{},[894,33278,33279],{},"NetPlus"," work with ",[894,33282,33283],{},"Bureo",", including more than ",[702,33286,33287],{},"2,000 metric tons"," of recycled fishing nets, is still meaningful. But it is not yet enough to close the gap between aspiration and actual feedstock transition.",[882,33290,33292],{"id":33291},"climate-strategy-more-credible-than-most-but-still-exposed-to-product-mix","Climate strategy: more credible than most, but still exposed to product mix",[728,33294,33296],{"id":33295},"patagonias-climate-stance-is-stronger-than-the-average-brand-narrative","Patagonia's climate stance is stronger than the average brand narrative",[692,33298,33299],{},"Patagonia's climate position stands out because it explicitly rejects the easy shortcut.",[692,33301,33302],{},"Based on publicly disclosed data, the company:",[751,33304,33305,33308,33317],{},[754,33306,33307],{},"does not rely on carbon offsets as its core net-zero mechanism",[754,33309,33310,33311,33314,33315],{},"targets ",[894,33312,33313],{},"SBTi","-aligned net zero by ",[702,33316,31164],{},[754,33318,33319,33320,33322],{},"has already reached ",[702,33321,30768],{}," renewable electricity coverage in owned and operated facilities",[692,33324,33325],{},"That is a stronger climate posture than brands that lean heavily on offset purchases or long-dated aspirations without clear operational movement.",[728,33327,33329],{"id":33328},"the-fy25-emissions-increase-is-exactly-the-kind-of-detail-that-builds-credibility","The FY25 emissions increase is exactly the kind of detail that builds credibility",[692,33331,33332,33333,33335],{},"Based on publicly disclosed data, greenhouse-gas emissions rose ",[702,33334,30485],{}," in FY25 versus FY24 because the product mix shifted toward more accessories, bags, and travel products with heavier carbon profiles.",[692,33337,33338],{},"This is actually one of the most credible parts of the report.",[692,33340,33341],{},"Why?",[692,33343,33344],{},"Because it shows Patagonia is not pretending that sustainability metrics always move in a straight line. It acknowledges that:",[751,33346,33347,33350,33353],{},[754,33348,33349],{},"product-mix changes affect real emissions",[754,33351,33352],{},"even a mission-led brand can see short-term reversals",[754,33354,33355],{},"the right response is not denial, but engineering and supplier-side intervention",[692,33357,33358],{},"The report says the company expects emissions to resume downward movement from FY26. That is reasonable, but it still remains a forward claim that future reporting will need to prove.",[728,33360,33362],{"id":33361},"pfas-removal-is-a-serious-long-cycle-win","PFAS removal is a serious long-cycle win",[692,33364,33365,33366,33368,33369,880],{},"Based on publicly disclosed data, from Spring 2025 onward, ",[702,33367,29729],{}," of new styles no longer intentionally add ",[894,33370,33371],{},"PFAS",[692,33373,33374],{},"That is a major achievement because PFAS removal in performance apparel is technically hard and often slowed by durability, weatherproofing, and product-performance requirements.",[692,33376,33377,33378,33381],{},"The important point here is not only the number. It is the timeline. The company acknowledges this took nearly ",[702,33379,33380],{},"20 years"," of work. That is what real materials transition often looks like: slower, less glamorous, and far harder than campaign language suggests.",[882,33383,33385],{"id":33384},"social-responsibility-is-embedded-more-deeply-than-average","Social responsibility is embedded more deeply than average",[728,33387,33389],{"id":33388},"fair-trade-and-worker-benefit-distribution-remain-major-strengths","Fair Trade and worker benefit distribution remain major strengths",[692,33391,29447],{},[751,33393,33394,33401,33410,33417,33423],{},[754,33395,29420,33396,33398,33399,30474],{},[702,33397,33103],{}," of products were made in ",[894,33400,30473],{},[754,33402,33403,33404,33406,33407,33409],{},"over ",[702,33405,33115],{}," workers received roughly ",[702,33408,33111],{}," in additional premiums",[754,33411,33412,33413,33416],{},"factories covering more than ",[702,33414,33415],{},"65,000"," workers paid above local minimum wage",[754,33418,33419,33422],{},[702,33420,33421],{},"39%"," of factories met living-wage benchmarks",[754,33424,33425,33426,33429,33430,33432],{},"another ",[702,33427,33428],{},"29%"," were above ",[702,33431,33092],{}," of living wage",[692,33434,33435],{},"These numbers matter because Patagonia is not only publishing factory-compliance language. It is linking the brand's supply-chain story to tangible worker-benefit mechanisms.",[692,33437,33438],{},"That still does not mean the whole labor story is perfect. But it does mean the company is operating on a stronger baseline than brands that treat worker well-being as a disclosure checkbox.",[728,33440,33442],{"id":33441},"community-and-civic-positioning-are-also-unusually-coherent","Community and civic positioning are also unusually coherent",[692,33444,33445],{},"Based on publicly disclosed data, Patagonia continues to connect stores and brand presence to:",[751,33447,33448,33451,33458],{},[754,33449,33450],{},"local ecological and community context",[754,33452,33453,33454,33457],{},"Indigenous cultural respect, including ",[894,33455,33456],{},"Kaitiakitanga"," in New Zealand",[754,33459,33460],{},"civic participation, including election-related store closures to support voting access",[692,33462,33463],{},"For many brands, these would feel like side notes. For Patagonia, they fit the broader business model and public identity more naturally.",[882,33465,33467],{"id":33466},"economic-logic-this-is-where-patagonia-looks-structurally-different","Economic logic: this is where Patagonia looks structurally different",[728,33469,33471],{"id":33470},"the-ownership-model-is-not-normal-and-that-matters","The ownership model is not normal, and that matters",[692,33473,33474],{},"Patagonia's business story is not only about products. It is also about who the company is built to serve.",[692,33476,29447],{},[751,33478,33479,33487,33494],{},[754,33480,33481,33483,33484],{},[702,33482,30485],{}," of voting stock sits with ",[894,33485,33486],{},"Patagonia Purpose Trust",[754,33488,33489,33491,33492],{},[702,33490,30768],{}," of non-voting stock was transferred to ",[894,33493,33126],{},[754,33495,29120,33496,33498,33499,33501],{},[702,33497,33122],{}," in dividends have been directed to ",[894,33500,33126],{}," since August 2022",[692,33503,33504],{},"That is a major structural difference from a normal shareholder-value company.",[692,33506,33507],{},"It means Patagonia can frame sustainability less as a risk-management function and more as the operating logic of the business itself.",[728,33509,33511],{"id":33510},"patagonia-still-proves-that-mission-and-economics-can-coexist","Patagonia still proves that mission and economics can coexist",[692,33513,29447],{},[751,33515,33516,33522],{},[754,33517,33518,33519],{},"FY25 revenue reached about ",[702,33520,33521],{},"$1.47 billion",[754,33523,33524,33525,33528,33529],{},"annual giving through ",[894,33526,33527],{},"1% for the Planet"," reached about ",[702,33530,33531],{},"$14.7 million",[692,33533,33534],{},"The more interesting economic point is not just revenue size. It is the growth philosophy.",[692,33536,33537],{},"Patagonia explicitly argues against:",[751,33539,33540,33543,33546],{},[754,33541,33542],{},"growth for growth's sake",[754,33544,33545],{},"constant discounting",[754,33547,33548],{},"demand stimulation through aggressive platform advertising",[692,33550,33551],{},"Instead it leans on product quality, direct customer relationships, and carefully selected wholesale partners.",[692,33553,33554],{},"That does not make the model easy to copy. But it does make the report much more coherent than the sustainability claims of companies that still depend on accelerating overconsumption.",[882,33556,33558],{"id":33557},"so-is-patagonia-actually-eco-friendly","So, is Patagonia actually eco-friendly?",[692,33560,33561],{},[702,33562,33563],{},"More credible than almost any mainstream apparel sustainability story? Yes.",[692,33565,33566],{},[702,33567,33568],{},"Fully beyond trade-offs, compromises, and bottlenecks? No.",[692,33570,31553],{},[692,33572,33573],{},"Based on publicly disclosed data, Patagonia deserves real credit for:",[751,33575,33576,33579,33582,33585,33588],{},[754,33577,33578],{},"embedding preferred materials at meaningful scale",[754,33580,33581],{},"pushing durability, repair, and resale as real business functions",[754,33583,33584],{},"taking a more disciplined climate position than most apparel brands",[754,33586,33587],{},"supporting workers through stronger-than-average supply-chain benefit systems",[754,33589,33590],{},"aligning corporate ownership with long-term mission",[692,33592,33593],{},"But the report also shows what still needs work:",[751,33595,33596,33599,33602],{},[754,33597,33598],{},"secondary-waste feedstocks are still far below ambition",[754,33600,33601],{},"emissions can still rise when product mix shifts",[754,33603,33604],{},"circularity at the hardest material level remains slow",[882,33606,29296],{"id":29295},[728,33608,33610],{"id":33609},"what-patagonia-does-well","What Patagonia does well",[751,33612,33613,33616,33619,33622,33625],{},[754,33614,33615],{},"treats sustainability as operating logic rather than campaign language",[754,33617,33618],{},"publishes useful numbers instead of only values-based storytelling",[754,33620,33621],{},"links product durability to real environmental logic",[754,33623,33624],{},"uses ownership and profit structure to reinforce mission credibility",[754,33626,33627],{},"acknowledges gaps in ways that increase trust rather than weaken it",[728,33629,29318],{"id":29317},[751,33631,33632,33635,33638,33641],{},[754,33633,33634],{},"scaling secondary-waste synthetic inputs beyond niche levels",[754,33636,33637],{},"proving that emissions decline will resume after the FY25 rebound",[754,33639,33640],{},"moving more factories from above-minimum-wage toward full living-wage performance",[754,33642,33643],{},"maintaining growth discipline without losing material impact in larger categories",[882,33645,29333],{"id":29332},[692,33647,33648],{},"Patagonia's latest report does not show a brand that has solved sustainability. It shows a brand that is still doing something rarer and more useful: making sustainability visible as a set of real trade-offs, real systems, and real business decisions.",[692,33650,33651],{},"That is why the brand still stands out.",[692,33653,32733],{},[7129,33655,33656],{},[692,33657,33658],{},"Patagonia is not impressive because it is flawless. It is impressive because it keeps pushing on the hardest parts of the problem while openly admitting where progress remains incomplete.",[692,33660,33661],{},"That is much closer to what a credible sustainability brand should look like.",{"title":613,"searchDepth":847,"depth":847,"links":33663},[33664,33665,33669,33672,33677,33681,33685,33686,33690],{"id":29077,"depth":847,"text":29078},{"id":33155,"depth":847,"text":33156,"children":33666},[33667,33668],{"id":33159,"depth":850,"text":33160},{"id":33200,"depth":850,"text":33201},{"id":33234,"depth":847,"text":33235,"children":33670},[33671],{"id":33238,"depth":850,"text":33239},{"id":33291,"depth":847,"text":33292,"children":33673},[33674,33675,33676],{"id":33295,"depth":850,"text":33296},{"id":33328,"depth":850,"text":33329},{"id":33361,"depth":850,"text":33362},{"id":33384,"depth":847,"text":33385,"children":33678},[33679,33680],{"id":33388,"depth":850,"text":33389},{"id":33441,"depth":850,"text":33442},{"id":33466,"depth":847,"text":33467,"children":33682},[33683,33684],{"id":33470,"depth":850,"text":33471},{"id":33510,"depth":850,"text":33511},{"id":33557,"depth":847,"text":33558},{"id":29295,"depth":847,"text":29296,"children":33687},[33688,33689],{"id":33609,"depth":850,"text":33610},{"id":29317,"depth":850,"text":29318},{"id":29332,"depth":847,"text":29333},"A plain-English breakdown of Patagonia's latest Work in Progress Report, focusing on preferred materials, climate strategy, labor and community commitments, and the economics of a mission-led business model.",{},{"title":669},{"title":31076,"description":33695},"Is Patagonia actually eco-friendly? A practical reading of Patagonia's 2025 sustainability progress across materials, climate action, labor standards, and mission-led economics.","VurvEIQ3Bgu268EQqyNjY0Z4AFsVU5Wye4RhSrFO4Bw",{"id":33698,"title":31081,"badge":11642,"body":33699,"category":687,"description":34331,"extension":856,"links":687,"meta":34332,"navigation":34333,"path":674,"seo":34334,"stem":675,"tags":687,"__hash__":34336},"docs_en/en/4.brand-reports/puma-sustainability-report-2025.md",{"type":689,"value":33700,"toc":34304},[33701,33704,33712,33715,33718,33726,33729,33731,33734,33759,33762,33809,33812,33816,33820,33823,33842,33845,33848,33851,33855,33858,33861,33875,33878,33881,33885,33888,33891,33902,33905,33908,33912,33916,33922,33939,33942,33945,33949,33951,33984,33987,33990,33993,33997,34000,34011,34014,34017,34021,34025,34032,34035,34052,34055,34059,34062,34065,34076,34083,34086,34089,34093,34097,34100,34132,34135,34138,34142,34145,34172,34175,34178,34192,34195,34200,34204,34209,34214,34216,34219,34233,34236,34247,34249,34253,34270,34272,34286,34288,34291,34294,34296,34301],[29056,33702,31081],{"id":33703},"puma-sustainability-report-2025",[692,33705,29061,33706,29065,33709,880],{},[702,33707,33708],{},"\"Is PUMA actually eco-friendly?\"",[702,33710,33711],{},"PUMA still looks strategically serious on sustainability, but 2025 was a reset year in which operational and financial pressure became impossible to ignore",[692,33713,33714],{},"That does not make the sustainability story weaker. It makes it more real.",[692,33716,33717],{},"Based on publicly disclosed data, PUMA's 2025 report presents a company trying to do two things at once:",[751,33719,33720,33723],{},[754,33721,33722],{},"keep building a modern ESG and circularity framework",[754,33724,33725],{},"restructure the business after a year of weaker commercial performance",[692,33727,33728],{},"That tension matters because sustainability is easier to talk about when growth is strong. It becomes more revealing when the company is under pressure.",[882,33730,29078],{"id":29077},[692,33732,33733],{},"Based on publicly disclosed data, PUMA's report shows meaningful progress in:",[751,33735,33736,33739,33745,33750,33753,33756],{},[754,33737,33738],{},"circular-material adoption targets such as higher recycled polyester use",[754,33740,33741,33742],{},"product-level sourcing discipline through the ",[894,33743,33744],{},"S-Index",[754,33746,33747,33749],{},[894,33748,33313],{},"-aligned climate commitments",[754,33751,33752],{},"water and chemical compliance across core suppliers",[754,33754,33755],{},"living-wage and human-rights positioning",[754,33757,33758],{},"tying management incentives to ESG metrics",[692,33760,33761],{},"At the same time, 2025 was clearly a difficult business year:",[751,33763,33764,33770,33776,33785,33795,33803],{},[754,33765,33766,33767],{},"sales fell to about ",[702,33768,33769],{},"EUR 7.296 billion",[754,33771,33772,33773],{},"currency-adjusted sales fell ",[702,33774,33775],{},"8.1%",[754,33777,33778,33779,29402,33782],{},"gross margin fell from ",[702,33780,33781],{},"47.6%",[702,33783,33784],{},"45.0%",[754,33786,33787,33788,33791,33792],{},"adjusted ",[894,33789,33790],{},"EBIT"," was ",[702,33793,33794],{},"negative EUR 165.6 million",[754,33796,33797,33798,33791,33800],{},"reported ",[894,33799,33790],{},[702,33801,33802],{},"negative EUR 357.2 million",[754,33804,33805,33806],{},"consolidated net income was ",[702,33807,33808],{},"negative EUR 645.5 million",[692,33810,33811],{},"So PUMA's report reads less like a victory lap and more like a transition document from a company trying to protect long-term brand quality while absorbing short-term economic pain.",[882,33813,33815],{"id":33814},"resource-efficiency-the-direction-is-right-but-the-story-is-still-framework-heavy","Resource efficiency: the direction is right, but the story is still framework-heavy",[728,33817,33819],{"id":33818},"circularity-and-material-strategy-are-clearly-central","Circularity and material strategy are clearly central",[692,33821,33822],{},"Based on publicly disclosed data, PUMA continues to frame resource efficiency around:",[751,33824,33825,33828,33833,33836,33839],{},[754,33826,33827],{},"more recycled material use, especially polyester",[754,33829,33830,33832],{},[894,33831,33744],{}," qualification for lower-impact or sustainably sourced materials",[754,33834,33835],{},"take-back systems",[754,33837,33838],{},"more durable and circular design logic",[754,33840,33841],{},"SKU simplification to reduce overproduction and waste",[692,33843,33844],{},"This is directionally strong.",[692,33846,33847],{},"The important thing here is that PUMA is not treating sustainability only as a compliance issue. It is connecting it to product planning, material choice, and assortment discipline.",[692,33849,33850],{},"That last point deserves more attention than it usually gets.",[728,33852,33854],{"id":33853},"sku-simplification-may-be-one-of-the-more-practical-sustainability-moves","SKU simplification may be one of the more practical sustainability moves",[692,33856,33857],{},"Based on publicly disclosed data, PUMA has deliberately reduced the number of new seasonal products.",[692,33859,33860],{},"That matters because too many SKUs can create:",[751,33862,33863,33866,33869,33872],{},[754,33864,33865],{},"more development waste",[754,33867,33868],{},"more unsold inventory",[754,33870,33871],{},"more markdown dependence",[754,33873,33874],{},"more raw-material inefficiency across the line",[692,33876,33877],{},"In plain English, \"fewer unnecessary products\" is often a better sustainability move than one more marketing-friendly eco capsule.",[692,33879,33880],{},"This is one reason PUMA's resource-efficiency story looks commercially grounded rather than purely symbolic.",[728,33882,33884],{"id":33883},"the-limitation-some-of-the-strongest-claims-are-still-target-led-rather-than-result-led","The limitation: some of the strongest claims are still target-led rather than result-led",[692,33886,33887],{},"PUMA's materials and circularity story is clearly strategic, but parts of it still read more like direction than completion.",[692,33889,33890],{},"For readers, that means the report is most persuasive when it points to:",[751,33892,33893,33896,33899],{},[754,33894,33895],{},"supplier coverage",[754,33897,33898],{},"compliance rates",[754,33900,33901],{},"governance mechanisms",[692,33903,33904],{},"and less persuasive when it leans mainly on ambition statements.",[692,33906,33907],{},"That does not invalidate the direction. It just means the evidence is stronger in systems and governance than in a simple consumer-facing proof point.",[882,33909,33911],{"id":33910},"environmental-performance-disciplined-compliance-heavy-and-supply-chain-aware","Environmental performance: disciplined, compliance-heavy, and supply-chain aware",[728,33913,33915],{"id":33914},"climate-commitments-are-clearly-structured","Climate commitments are clearly structured",[692,33917,33918,33919,33921],{},"Based on publicly disclosed data, PUMA aligns with an ",[894,33920,33313],{}," 1.5°C pathway and targets:",[751,33923,33924,33934],{},[754,33925,32402,33926,33928,33929,720,33931,33933],{},[702,33927,29423],{}," reduction in ",[894,33930,29401],{},[894,33932,29761],{}," emissions from owned operations by 2030 versus 2017",[754,33935,32402,33936,33938],{},[702,33937,29409],{}," reduction in supply-chain emissions by 2030",[692,33940,33941],{},"The report also highlights phased efforts to remove coal boilers from supplier operations.",[692,33943,33944],{},"This matters because it shows PUMA is not limiting climate action to its direct facilities. It is at least attempting to push into the harder supply-chain layer where most apparel impact sits.",[728,33946,33948],{"id":33947},"water-and-chemistry-controls-are-among-the-reports-stronger-areas","Water and chemistry controls are among the report's stronger areas",[692,33950,29447],{},[751,33952,33953,33959,33969,33975],{},[754,33954,33955,33956,33958],{},"PUMA targets a ",[702,33957,29771],{}," reduction in water use per product versus a 2020 baseline",[754,33960,33961,33964,33965,33968],{},[702,33962,33963],{},"153"," core supplier factories completed ",[894,33966,33967],{},"ZDHC"," wastewater testing in 2025",[754,33970,33971,33972],{},"wastewater compliance reached ",[702,33973,33974],{},"99.2%",[754,33976,33977,33980,33981],{},[894,33978,33979],{},"MRSL"," compliance at core factories reached ",[702,33982,33983],{},"86.6%",[692,33985,33986],{},"These are strong process-control numbers.",[692,33988,33989],{},"For readers, this is one of the more convincing parts of the report because water and chemical governance are usually hard to fake and deeply tied to supplier systems.",[692,33991,33992],{},"If a brand can show structured factory testing and high compliance levels, that usually signals real management discipline.",[728,33994,33996],{"id":33995},"biodiversity-and-land-use-language-are-present-but-less-immediately-concrete","Biodiversity and land-use language are present, but less immediately concrete",[692,33998,33999],{},"Based on publicly disclosed data, PUMA also references:",[751,34001,34002,34005,34008],{},[754,34003,34004],{},"sustainable cotton",[754,34006,34007],{},"deforestation-free leather sourcing",[754,34009,34010],{},"regenerative agriculture support",[692,34012,34013],{},"These are directionally important. But compared with the water and chemical sections, they still feel less concrete in immediate reader terms.",[692,34015,34016],{},"So the environmental story is strongest where PUMA provides measurable compliance and systems evidence, not where it stays at the level of principle.",[882,34018,34020],{"id":34019},"social-responsibility-stronger-than-average-on-governance-integration","Social responsibility: stronger than average on governance integration",[728,34022,34024],{"id":34023},"living-wage-and-worker-safeguards-matter-here","Living wage and worker safeguards matter here",[692,34026,34027,34028,34031],{},"Based on publicly disclosed data, PUMA states that since 2021 it has used ",[894,34029,34030],{},"Fair Wage Network"," benchmarks to ensure all employees receive wages sufficient for basic living standards.",[692,34033,34034],{},"The report also highlights:",[751,34036,34037,34043,34046,34049],{},[754,34038,34039,34040],{},"a standard workweek cap of ",[702,34041,34042],{},"48 hours",[754,34044,34045],{},"rest and leave protections",[754,34047,34048],{},"additional heat-protection measures in high-temperature environments",[754,34050,34051],{},"zero tolerance for child labor and forced labor",[692,34053,34054],{},"These are not unusual commitments in wording, but they become more meaningful when placed next to the company's compliance architecture and incentive structure.",[728,34056,34058],{"id":34057},"esg-linked-compensation-strengthens-credibility","ESG-linked compensation strengthens credibility",[692,34060,34061],{},"One of the more important governance details is that PUMA directly links management incentives to ESG indicators.",[692,34063,34064],{},"Based on publicly disclosed data, short- and long-term compensation frameworks include metrics tied to:",[751,34066,34067,34070,34073],{},[754,34068,34069],{},"climate change",[754,34071,34072],{},"circular economy",[754,34074,34075],{},"human rights",[692,34077,34078,34079,34082],{},"with each carrying roughly ",[702,34080,34081],{},"3.33%"," weighting.",[692,34084,34085],{},"That is not enough on its own to guarantee good outcomes. But it does matter because it moves sustainability from communications into management accountability.",[692,34087,34088],{},"Many brand reports talk about ESG importance. Fewer make it part of executive pay logic.",[882,34090,34092],{"id":34091},"economic-benefits-this-is-where-the-report-becomes-a-reset-year-document","Economic benefits: this is where the report becomes a reset-year document",[728,34094,34096],{"id":34095},"_2025-was-clearly-painful","2025 was clearly painful",[692,34098,34099],{},"Based on publicly disclosed data, PUMA's financial picture in 2025 was weak:",[751,34101,34102,34107,34111,34116,34122,34128],{},[754,34103,34104,34105],{},"sales were about ",[702,34106,33769],{},[754,34108,33772,34109],{},[702,34110,33775],{},[754,34112,34113,34114],{},"gross margin fell to ",[702,34115,33784],{},[754,34117,33787,34118,33791,34120],{},[894,34119,33790],{},[702,34121,33794],{},[754,34123,33797,34124,33791,34126],{},[894,34125,33790],{},[702,34127,33802],{},[754,34129,33805,34130],{},[702,34131,33808],{},[692,34133,34134],{},"That is a serious short-term setback.",[692,34136,34137],{},"If a brand wanted to hide behind vague sustainability optimism, this would be the part to soften. But the report makes clear that PUMA was in a reset year, not a peak year.",[728,34139,34141],{"id":34140},"the-strategic-reset-does-have-sustainability-relevance","The strategic reset does have sustainability relevance",[692,34143,34144],{},"Based on publicly disclosed data, PUMA responded by:",[751,34146,34147,34150,34153,34159,34169],{},[754,34148,34149],{},"exiting lower-quality wholesale channels",[754,34151,34152],{},"reducing reliance on heavy discounting in direct-to-consumer operations",[754,34154,34155,34156],{},"launching cost-reduction measures under ",[894,34157,34158],{},"Nextlevel",[754,34160,34161,34162,34165,34166,34168],{},"planning roughly ",[702,34163,34164],{},"1,400"," administrative job reductions by the end of 2026, with about ",[702,34167,13038],{}," already completed in 2025",[754,34170,34171],{},"narrowing focus to core categories such as football, running, training, and selected sportstyle lines",[692,34173,34174],{},"This is not sustainability in the soft marketing sense. It is sustainability in the business-discipline sense.",[692,34176,34177],{},"Why that matters:",[751,34179,34180,34183,34186,34189],{},[754,34181,34182],{},"cleaner assortments can reduce waste",[754,34184,34185],{},"better channel quality can reduce destructive markdown cycles",[754,34187,34188],{},"sharper category focus can improve planning efficiency",[754,34190,34191],{},"but restructuring also carries real social and organizational cost",[692,34193,34194],{},"So the economic reading is mixed:",[7129,34196,34197],{},[692,34198,34199],{},"PUMA's reset may support a healthier long-term operating model, but 2025 itself was a year of significant financial pain and organizational strain.",[882,34201,34203],{"id":34202},"so-is-puma-actually-eco-friendly","So, is PUMA actually eco-friendly?",[692,34205,34206],{},[702,34207,34208],{},"More structured and more compliance-driven than many sportswear peers? Yes.",[692,34210,34211],{},[702,34212,34213],{},"A brand whose sustainability story is currently stronger than its short-term business performance? Also yes.",[692,34215,31553],{},[692,34217,34218],{},"Based on publicly disclosed data, PUMA deserves credit for:",[751,34220,34221,34224,34227,34230],{},[754,34222,34223],{},"building clear circular-material and climate frameworks",[754,34225,34226],{},"showing high water and wastewater compliance discipline",[754,34228,34229],{},"integrating ESG into management incentives",[754,34231,34232],{},"keeping supply-chain human-rights language tied to governance systems",[692,34234,34235],{},"But the report also shows what needs continued proof:",[751,34237,34238,34241,34244],{},[754,34239,34240],{},"stronger evidence that circular-material goals are landing broadly at product level",[754,34242,34243],{},"clearer commercialization of sustainability gains during a weak business cycle",[754,34245,34246],{},"a more stable path back to profitable growth without slipping into discount-driven overproduction",[882,34248,29296],{"id":29295},[728,34250,34252],{"id":34251},"what-puma-does-well","What PUMA does well",[751,34254,34255,34258,34261,34264,34267],{},[754,34256,34257],{},"treats sustainability as part of operating discipline rather than only image",[754,34259,34260],{},"connects assortment simplification with resource efficiency",[754,34262,34263],{},"provides strong supplier-side water and chemical compliance evidence",[754,34265,34266],{},"links ESG performance to executive accountability",[754,34268,34269],{},"maintains strategic clarity even during a commercially difficult year",[728,34271,29318],{"id":29317},[751,34273,34274,34277,34280,34283],{},[754,34275,34276],{},"converting materials and circularity strategy into easier-to-read product-level proof",[754,34278,34279],{},"proving that supply-chain decarbonization targets are landing at pace",[754,34281,34282],{},"balancing restructuring with workforce and organizational stability",[754,34284,34285],{},"showing how sustainability contributes to recovery rather than simply surviving alongside it",[882,34287,29333],{"id":29332},[692,34289,34290],{},"PUMA's 2025 report is not the story of a brand riding sustainability momentum into easy growth. It is the story of a brand trying to hold onto sustainability discipline while going through a painful commercial reset.",[692,34292,34293],{},"That makes the report more credible, not less.",[692,34295,32733],{},[7129,34297,34298],{},[692,34299,34300],{},"PUMA looks like a company that still believes in the long-term logic of sustainability, even in a year when the financial numbers made everything harder.",[692,34302,34303],{},"That is not the same thing as having solved the model. But it is still an important signal.",{"title":613,"searchDepth":847,"depth":847,"links":34305},[34306,34307,34312,34317,34321,34325,34326,34330],{"id":29077,"depth":847,"text":29078},{"id":33814,"depth":847,"text":33815,"children":34308},[34309,34310,34311],{"id":33818,"depth":850,"text":33819},{"id":33853,"depth":850,"text":33854},{"id":33883,"depth":850,"text":33884},{"id":33910,"depth":847,"text":33911,"children":34313},[34314,34315,34316],{"id":33914,"depth":850,"text":33915},{"id":33947,"depth":850,"text":33948},{"id":33995,"depth":850,"text":33996},{"id":34019,"depth":847,"text":34020,"children":34318},[34319,34320],{"id":34023,"depth":850,"text":34024},{"id":34057,"depth":850,"text":34058},{"id":34091,"depth":847,"text":34092,"children":34322},[34323,34324],{"id":34095,"depth":850,"text":34096},{"id":34140,"depth":850,"text":34141},{"id":34202,"depth":847,"text":34203},{"id":29295,"depth":847,"text":29296,"children":34327},[34328,34329],{"id":34251,"depth":850,"text":34252},{"id":29317,"depth":850,"text":29318},{"id":29332,"depth":847,"text":29333},"A plain-English breakdown of PUMA's 2025 sustainability performance, covering circular materials, carbon targets, water and chemical compliance, social safeguards, and the business costs of a strategic reset year.",{},{"title":673},{"title":31081,"description":34335},"Is PUMA actually eco-friendly? A practical reading of PUMA's 2025 sustainability performance across materials, emissions, labor safeguards, and reset-year economics.","wQ-ySjWvrAty_JrR8vpqScnN-BKRR8mdiz2ILxPlRNo",{"id":34338,"title":31086,"badge":11642,"body":34339,"category":687,"description":35372,"extension":856,"links":687,"meta":35373,"navigation":35374,"path":678,"seo":35375,"stem":679,"tags":687,"__hash__":35377},"docs_en/en/4.brand-reports/reidea-electronic-lighters-sustainability-report-2026.md",{"type":689,"value":34340,"toc":35335},[34341,34344,34353,34355,34358,34375,34378,34395,34397,34400,34444,34447,34451,34455,34461,34464,34467,34478,34481,34485,34493,34496,34504,34511,34522,34525,34529,34538,34541,34544,34558,34561,34565,34568,34587,34590,34593,34596,34600,34605,34608,34615,34618,34622,34625,34630,34633,34651,34654,34663,34669,34677,34680,34691,34701,34704,34709,34715,34718,34725,34735,34744,34747,34752,34755,34769,34772,34782,34791,34795,34798,34809,34811,34825,34828,34832,34835,34866,34869,34873,34876,34879,34899,34914,34917,34921,34924,34935,34939,34950,34957,34960,34964,34967,34969,34991,34994,35000,35004,35007,35013,35019,35023,35026,35040,35043,35047,35050,35053,35057,35064,35070,35073,35077,35083,35089,35096,35099,35103,35106,35116,35122,35125,35139,35142,35146,35149,35152,35166,35173,35176,35180,35185,35190,35192,35195,35215,35218,35221,35241,35252,35254,35258,35281,35285,35305,35307,35314,35317,35322,35332],[29056,34342,31086],{"id":34343},"reidea-electronic-lighters-sustainability-report-2026",[692,34345,34346,34347,29065,34350,880],{},"If you are trying to answer the question ",[702,34348,34349],{},"\"Is REIDEA actually eco-friendly?\"",[702,34351,34352],{},"there are some product-level sustainability signals here, but they are not the same thing as a full corporate ESG report",[692,34354,30735],{},[692,34356,34357],{},"Many brands talk about sustainability in broad terms. Based on publicly disclosed data, REIDEA's sustainability story is more concrete and product-focused. Instead of starting from a company-wide carbon report, we start from specific lighter optimizations across three consumer-facing products:",[751,34359,34360,34365,34370],{},[754,34361,34362],{},[894,34363,34364],{},"S4 Lighter",[754,34366,34367],{},[894,34368,34369],{},"R1 Pro Lighter",[754,34371,34372],{},[894,34373,34374],{},"F2 Ultra Flexible Lighter",[692,34376,34377],{},"This makes REIDEA interesting for consumers because product changes are easier to understand than abstract sustainability slogans.",[692,34379,34380,34381,34385,34386,4270,34389,5355,34392,880],{},"Readers who want to compare the lineup directly can start from the brand's main ",[696,34382,34384],{"href":30192,"rel":34383},[700],"REIDEA Lighter collection",", then review the three key models discussed in this report: ",[894,34387,34388],{},"S4",[894,34390,34391],{},"R1 Pro",[894,34393,34394],{},"F2 Ultra",[882,34396,29078],{"id":29077},[692,34398,34399],{},"REIDEA's strongest sustainability case is not \"we are a perfect green company.\" It is closer to this:",[751,34401,34402,34407,34417,34427,34437],{},[754,34403,34404,34405],{},"according to publicly disclosed data, plastic use was reduced by ",[702,34406,31423],{},[754,34408,34409,34410,34413,34414],{},"according to publicly disclosed data, the casing uses ",[702,34411,34412],{},"aluminum",", positioned as a shift toward ",[702,34415,34416],{},"recyclable aluminum material",[754,34418,34419,34420,34423,34424],{},"the product weight was reduced by about ",[702,34421,34422],{},"10 grams",", or roughly ",[702,34425,34426],{},"20%",[754,34428,34429,34430,34433,34434],{},"battery performance improved from ",[702,34431,34432],{},"30 uses to 40 uses per charge",", a ",[702,34435,34436],{},"30% increase",[754,34438,34439,34440,34443],{},"the internal PCB board length was reduced from ",[702,34441,34442],{},"98 mm to 38 mm",", which suggests a meaningful cut in unnecessary internal material volume",[692,34445,34446],{},"Those are tangible product optimization claims, and they are much more useful than generic \"eco-friendly\" branding.",[882,34448,34450],{"id":34449},"what-reidea-has-improved","What REIDEA has improved",[728,34452,34454],{"id":34453},"_1-less-plastic","1. Less plastic",[692,34456,34457,34458,880],{},"The clearest headline claim is simple: ",[702,34459,34460],{},"30% less plastic",[692,34462,34463],{},"For a lighter brand, this matters because the product category is usually associated with cheap, disposable, petroleum-heavy construction. A 30% plastic reduction shows that REIDEA has moved away from unnecessary material intensity at the product level.",[692,34465,34466],{},"What we still do not know from this claim alone:",[751,34468,34469,34472,34475],{},[754,34470,34471],{},"whether the reduction applies to one model or all three models",[754,34473,34474],{},"whether it refers only to housing materials or to the full product system",[754,34476,34477],{},"whether the packaging was also optimized",[692,34479,34480],{},"Still, as a product signal, this is meaningful.",[728,34482,34484],{"id":34483},"_2-aluminum-casing-and-recycled-material-direction","2. Aluminum casing and recycled-material direction",[692,34486,34487,34488,34490,34491,880],{},"Based on publicly disclosed data, REIDEA's casing is ",[702,34489,34412],{},", and the sustainability framing here is that the brand has shifted toward ",[702,34492,34416],{},[692,34494,34495],{},"That can be a positive change for two reasons:",[751,34497,34498,34501],{},[754,34499,34500],{},"aluminum is generally more durable than thin commodity plastic in everyday consumer goods",[754,34502,34503],{},"recycled aluminum, when actually used, can be far less resource-intensive than virgin aluminum production",[692,34505,34506,34507,34510],{},"However, this is also an area where the wording matters. Saying a product uses aluminum is not enough on its own. The stronger claim is the use of ",[702,34508,34509],{},"recycled aluminum",", but that usually needs more detail:",[751,34512,34513,34516,34519],{},[754,34514,34515],{},"what percentage is recycled content?",[754,34517,34518],{},"does the claim apply to all product lines?",[754,34520,34521],{},"is there documentation from the supplier side?",[692,34523,34524],{},"So the direction looks good, but the evidence is still product-marketing level rather than fully documented materials disclosure.",[728,34526,34528],{"id":34527},"_3-lighter-overall-product-weight","3. Lighter overall product weight",[692,34530,34531,34532,34423,34535,880],{},"Based on publicly disclosed data, the product became about ",[702,34533,34534],{},"10 grams lighter",[702,34536,34537],{},"20% lighter overall",[692,34539,34540],{},"This is easy to overlook, but it is actually one of the more interesting product-efficiency signals.",[692,34542,34543],{},"When a product becomes lighter without losing performance, that often means:",[751,34545,34546,34549,34552,34555],{},[754,34547,34548],{},"less raw material use",[754,34550,34551],{},"less energy embedded in production",[754,34553,34554],{},"lower shipping weight over time",[754,34556,34557],{},"less unnecessary structural bulk",[692,34559,34560],{},"In other words, light-weighting is one of the most credible forms of incremental sustainability improvement in small consumer hardware.",[728,34562,34564],{"id":34563},"_4-better-battery-efficiency","4. Better battery efficiency",[692,34566,34567],{},"One of the strongest practical improvements is battery performance:",[751,34569,34570,34576,34582],{},[754,34571,34572,34573],{},"before optimization: about ",[702,34574,34575],{},"30 uses",[754,34577,34578,34579],{},"after optimization: about ",[702,34580,34581],{},"40 uses",[754,34583,34584,34585],{},"improvement: about ",[702,34586,31423],{},[692,34588,34589],{},"This matters because rechargeable lighters live or die by how often users actually keep using them.",[692,34591,34592],{},"If the same battery now delivers more ignitions per charge, that implies better energy efficiency at the product level. It also improves the real-world case against disposable lighters because the product becomes more convenient to keep in rotation.",[692,34594,34595],{},"This is not just an engineering detail. It affects whether a reusable product is truly reusable in everyday life.",[728,34597,34599],{"id":34598},"_5-smaller-pcb-board-and-reduced-internal-excess","5. Smaller PCB board and reduced internal excess",[692,34601,34602,34603,880],{},"Based on publicly disclosed data, REIDEA reduced unnecessary internal board length from ",[702,34604,34442],{},[692,34606,34607],{},"That is a very large reduction in internal footprint, and it suggests the company reworked product architecture instead of simply changing exterior styling.",[692,34609,34610,34611,34614],{},"The note attached to this references ",[702,34612,34613],{},"FR-4",", the standard PCB substrate made from epoxy resin and woven glass fiber. In plain English, that means the product uses less board material by eliminating wasted internal space.",[692,34616,34617],{},"That is a real design-efficiency signal because PCB material is not just \"a tiny invisible part.\" Electronics manufacturing carries resource and process costs, and cutting oversized internal boards is a meaningful optimization.",[882,34619,34621],{"id":34620},"model-level-context","Model-level context",[728,34623,34364],{"id":34624},"s4-lighter",[692,34626,10617,34627,34629],{},[894,34628,34364],{}," is the brand's strongest proof-of-market product based on publicly disclosed data.",[692,34631,34632],{},"Based on publicly disclosed data, the S4:",[751,34634,34635,34644],{},[754,34636,34637,34638,30537,34641],{},"was an Amazon ",[702,34639,34640],{},"Best Selling Lighter",[702,34642,34643],{},"2021 to 2024",[754,34645,34646,34647,34650],{},"was featured by ",[702,34648,34649],{},"NBC / The Today Show"," in 2022 in a sustainable-products segment for the home",[692,34652,34653],{},"Reference:",[751,34655,34656],{},[754,34657,34658],{},[696,34659,34662],{"href":34660,"rel":34661},"https://www.today.com/video/these-sustainable-product-can-help-save-you-money-over-time-148321349701",[700],"NBC / The Today Show sustainable products segment",[692,34664,34665,34666,34668],{},"This does ",[702,34667,737],{}," automatically prove the product is environmentally superior in a rigorous lifecycle sense. But it does show two things:",[751,34670,34671,34674],{},[754,34672,34673],{},"the product has mainstream commercial relevance",[754,34675,34676],{},"the sustainability angle is strong enough to appear in broader consumer media, not only on the brand's own site",[692,34678,34679],{},"That makes the S4 the most credibility-supporting model in REIDEA's lineup right now.",[692,34681,34682],{},[696,34683,34686],{"href":34684,"rel":34685},"https://www.amazon.com/REIDEA-Electronic-Windproof-Flameless-Rechargeable/dp/B07D6LX9ZP",[700],[34687,34688],"img",{"alt":34689,"src":34690},"REIDEA S4 Lighter","https://images-na.ssl-images-amazon.com/images/I/61i3eWWufYL._AC_UL600_SR600,400_.jpg",[692,34692,34693,34694,34696,34697,880],{},"For readers who want the product page itself, the ",[894,34695,34388],{}," is available here: ",[696,34698,34700],{"href":34684,"rel":34699},[700],"REIDEA S4 Electronic Lighter",[728,34702,34369],{"id":34703},"r1-pro-lighter",[692,34705,10617,34706,34708],{},[894,34707,34369],{}," is positioned differently.",[692,34710,34711,34712,880],{},"Instead of leading with a sustainability media reference, its market signal is that it ranked in ",[702,34713,34714],{},"Best Sellers in Lighter Gift Sets",[692,34716,34717],{},"This matters less as a sustainability proof point and more as a consumer adoption signal. In practice, a product that performs well as a gift item may still help shift buyers away from disposable lighter habits, but the sustainability argument here is more indirect.",[692,34719,34720,34721,34724],{},"So for the R1 Pro, the evidence currently supports ",[702,34722,34723],{},"market traction",", not yet a uniquely strong environmental case.",[692,34726,34727],{},[696,34728,34731],{"href":34729,"rel":34730},"https://www.amazon.com/REIDEA-Electronic-R1-Windproof-Rechargeable/dp/B0BRRPJCSS",[700],[34687,34732],{"alt":34733,"src":34734},"REIDEA R1 Pro Lighter","https://images-na.ssl-images-amazon.com/images/I/61vDmDPjIbL._AC_UL600_SR600,400_.jpg",[692,34736,10617,34737,34739,34740,880],{},[894,34738,34391],{}," product listing is here: ",[696,34741,34743],{"href":34729,"rel":34742},[700],"REIDEA R1 Pro Electronic Lighter",[728,34745,34374],{"id":34746},"f2-ultra-flexible-lighter",[692,34748,10617,34749,34751],{},[894,34750,34374],{}," is part of the same optimized product story and matters because flexible long-neck lighters are often used in repeated household settings such as candles, kitchens, grills, and fireplaces.",[692,34753,34754],{},"That repeated-use context can strengthen the sustainability story if the product:",[751,34756,34757,34760,34763,34766],{},[754,34758,34759],{},"lasts longer",[754,34761,34762],{},"charges efficiently",[754,34764,34765],{},"uses less material",[754,34767,34768],{},"meaningfully replaces disposable alternatives",[692,34770,34771],{},"The key limitation is that we still need more model-specific evidence to say how much of the optimization package applies specifically to the F2 Ultra versus the broader product line.",[692,34773,34774],{},[696,34775,34778],{"href":34776,"rel":34777},"https://www.amazon.com/dp/B0BB2LXSBW",[700],[34687,34779],{"alt":34780,"src":34781},"REIDEA F2 Ultra Flexible Lighter","https://m.media-amazon.com/images/I/51uC7O38o7L._AC_SL1500_.jpg",[692,34783,34784,34785,34787,34788,880],{},"For readers focused on household and long-neck use cases, the ",[894,34786,34394],{}," listing is here: ",[696,34789,34780],{"href":34776,"rel":34790},[700],[882,34792,34794],{"id":34793},"annual-impact-assessment","Annual Impact Assessment",[692,34796,34797],{},"This is where the REIDEA story becomes more interesting.",[692,34799,34800,34801,34804,34805,34808],{},"Based on publicly disclosed sales data, REIDEA sells about ",[702,34802,34803],{},"400,000 units per year",", using the midpoint of the disclosed ",[702,34806,34807],{},"300,000 to 500,000 unit"," annual range. At that scale, the question shifts from \"is this lighter slightly better designed?\" to \"what happens if a reusable lighter replaces a meaningful number of disposable ones?\"",[692,34810,29447],{},[751,34812,34813,34819],{},[754,34814,34815,34816],{},"annual REIDEA sales: ",[702,34817,34818],{},"400,000 units",[754,34820,34821,34822],{},"equivalent disposable-lighter replacement: about ",[702,34823,34824],{},"2,000,000 single-use plastic butane lighters per year",[692,34826,34827],{},"That replacement ratio matters because reusable electric lighters do not just avoid one disposable lighter. They are intended to displace repeated purchases over time.",[728,34829,34831],{"id":34830},"the-environmental-cost-of-a-disposable-lighter","The environmental cost of a disposable lighter",[692,34833,34834],{},"For comparison, a typical disposable plastic butane lighter can be thought of as carrying several layers of environmental cost:",[751,34836,34837,34847,34856],{},[754,34838,34839,34842,34843,34846],{},[702,34840,34841],{},"butane fuel:"," about ",[702,34844,34845],{},"4 to 5 grams"," of liquefied butane",[754,34848,34849,34842,34852,34855],{},[702,34850,34851],{},"plastic shell:",[702,34853,34854],{},"12 to 15 grams"," of ABS or AS plastic",[754,34857,34858,34861,34862,34865],{},[702,34859,34860],{},"carbon footprint:"," roughly ",[702,34863,34864],{},"80 to 120 grams CO2e"," per unit once plastic production, butane refining, transport, and disposal are considered",[692,34867,34868],{},"That is why the replacement logic matters. The category is not just plastic-heavy. It is also directly tied to fossil-fuel extraction, refining, and combustion.",[728,34870,34872],{"id":34871},"the-electricity-use-of-a-rechargeable-reidea-lighter","The electricity use of a rechargeable REIDEA lighter",[692,34874,34875],{},"The rechargeable side of the comparison is relatively small.",[692,34877,34878],{},"Based on the figures provided here:",[751,34880,34881,34887,34893],{},[754,34882,34883,34884],{},"REIDEA battery capacity is about ",[702,34885,34886],{},"170 to 220 mAh",[754,34888,34889,34890],{},"that equals roughly ",[702,34891,34892],{},"0.8 Wh",[754,34894,34895,34896],{},"a full charge uses about ",[702,34897,34898],{},"0.001 kWh",[692,34900,34901,34902,34905,34906,34909,34910,34913],{},"Even if a lighter were charged ",[702,34903,34904],{},"100 times per year",", total electricity use would only be around ",[702,34907,34908],{},"0.1 kWh annually",". In carbon terms, that is extremely small, often below ",[702,34911,34912],{},"50 grams CO2e per year",", depending on the grid mix.",[692,34915,34916],{},"In plain English: the electricity needed to keep a REIDEA lighter running is tiny compared with the fossil-fuel and plastic burden of repeatedly buying disposable butane lighters.",[882,34918,34920],{"id":34919},"estimated-carbon-impact","Estimated carbon impact",[692,34922,34923],{},"The main climate benefit comes from avoiding three things:",[751,34925,34926,34929,34932],{},[754,34927,34928],{},"plastic production",[754,34930,34931],{},"butane refining and transport",[754,34933,34934],{},"direct fossil-fuel use through disposable-lighter consumption",[728,34936,34938],{"id":34937},"gross-avoided-emissions","Gross avoided emissions",[692,34940,34941,34942,34945,34946,34949],{},"If REIDEA's annual sales displace about ",[702,34943,34944],{},"2,000,000 disposable lighters",", and each disposable lighter represents about ",[702,34947,34948],{},"100 grams CO2e"," based on publicly disclosed lifecycle ranges, then the avoided emissions look like this:",[925,34951,34955],{"className":34952,"code":34954,"language":10142,"meta":613},[34953],"language-text","2,000,000 lighters x 100 g CO2e = 200,000,000 g CO2e\n= 200 metric tons CO2e\n",[894,34956,34954],{"__ignoreMap":613},[692,34958,34959],{},"That is the gross avoidance side of the equation.",[728,34961,34963],{"id":34962},"reideas-own-product-footprint","REIDEA's own product footprint",[692,34965,34966],{},"Of course, a rechargeable lighter is not carbon-free.",[692,34968,29447],{},[751,34970,34971,34978,34985],{},[754,34972,34973,34974,34977],{},"one REIDEA unit carries about ",[702,34975,34976],{},"300 to 400 grams CO2e"," of manufacturing and shipping footprint",[754,34979,34980,34981,34984],{},"spread over about ",[702,34982,34983],{},"1.5 years"," of useful life",[754,34986,34987,34988],{},"giving an annualized footprint of roughly ",[702,34989,34990],{},"250 grams CO2e per unit per year",[692,34992,34993],{},"That leads to:",[925,34995,34998],{"className":34996,"code":34997,"language":10142,"meta":613},[34953],"400,000 REIDEA units x 250 g CO2e/year = 100,000,000 g CO2e\n= 100 metric tons CO2e/year\n",[894,34999,34997],{"__ignoreMap":613},[728,35001,35003],{"id":35002},"net-avoided-emissions","Net avoided emissions",[692,35005,35006],{},"That produces a net annual reduction in the range of:",[925,35008,35011],{"className":35009,"code":35010,"language":10142,"meta":613},[34953],"200 tons CO2e avoided - 100 tons CO2e internal footprint\n= roughly 100 to 200 tons CO2e net avoided per year\n",[894,35012,35010],{"__ignoreMap":613},[692,35014,35015,35016,880],{},"The range reflects the disclosed lifecycle span used in the calculation, but the takeaway is clear: ",[702,35017,35018],{},"the reuse model delivers real annual climate benefit at current sales scale",[728,35020,35022],{"id":35021},"what-that-means-in-human-terms","What that means in human terms",[692,35024,35025],{},"Based on the disclosed figures used here, the annual avoided emissions are on the order of:",[751,35027,35028,35034],{},[754,35029,35030,35031],{},"the yearly emissions of roughly ",[702,35032,35033],{},"40 to 80 gasoline passenger cars",[754,35035,35036,35037],{},"or the annual carbon absorption of about ",[702,35038,35039],{},"4,500 to 9,000 trees",[692,35041,35042],{},"Those are not tiny numbers anymore. They move REIDEA from \"interesting product tweak\" into \"small but measurable dematerialization case.\"",[882,35044,35046],{"id":35045},"resource-efficiency-beyond-carbon","Resource efficiency beyond carbon",[692,35048,35049],{},"Carbon is not the whole story.",[692,35051,35052],{},"The more immediate benefit may be resource efficiency: avoiding fossil-fuel use and stopping disposable plastic waste before it exists.",[728,35054,35056],{"id":35055},"avoided-butane-consumption","Avoided butane consumption",[692,35058,35059,35060,35063],{},"Using ",[702,35061,35062],{},"4.5 grams"," of butane per disposable lighter as a midpoint:",[925,35065,35068],{"className":35066,"code":35067,"language":10142,"meta":613},[34953],"2,000,000 lighters x 4.5 g butane = 9,000,000 g\n= 9,000 kg\n= 9 metric tons of liquefied butane\n",[894,35069,35067],{"__ignoreMap":613},[692,35071,35072],{},"That is a meaningful amount of avoided fossil-fuel consumption in a product category that is usually treated as trivial.",[728,35074,35076],{"id":35075},"avoided-plastic-waste","Avoided plastic waste",[692,35078,35059,35079,35082],{},[702,35080,35081],{},"13 grams"," of plastic per disposable lighter as a midpoint:",[925,35084,35087],{"className":35085,"code":35086,"language":10142,"meta":613},[34953],"2,000,000 lighters x 13 g plastic = 26,000,000 g\n= 26,000 kg\n= 26 metric tons of plastic waste\n",[894,35088,35086],{"__ignoreMap":613},[692,35090,35091,35092,35095],{},"That means REIDEA's annual replacement effect prevents about ",[702,35093,35094],{},"26 tons of non-biodegradable plastic waste"," from entering the waste stream.",[692,35097,35098],{},"That matters not only for landfill pressure, but also for the broader problem of fragmented plastic and microplastic pollution over time.",[882,35100,35102],{"id":35101},"consumer-economics-why-reuse-can-actually-stick","Consumer economics: why reuse can actually stick",[692,35104,35105],{},"A reusable product only creates environmental value if people keep using it.",[692,35107,35108,35109,35111,35112,35115],{},"That is why the consumer-cost side is important. If ",[702,35110,34944],{}," would otherwise be bought at around ",[702,35113,35114],{},"$1 to $1.50 each",", then the avoided consumer spending is roughly:",[925,35117,35120],{"className":35118,"code":35119,"language":10142,"meta":613},[34953],"2,000,000 x $1.00 to $1.50\n= about $2,000,000 to $3,000,000\n",[894,35121,35119],{"__ignoreMap":613},[692,35123,35124],{},"This matters because sustainable products work best when they are also economically sticky. In REIDEA's case, the pitch is not just \"generate less waste.\" It is also:",[751,35126,35127,35130,35133,35136],{},[754,35128,35129],{},"buy fewer throwaway lighters",[754,35131,35132],{},"burn less fossil fuel directly",[754,35134,35135],{},"generate less plastic waste",[754,35137,35138],{},"spend less money over repeated use",[692,35140,35141],{},"That combination is one reason rechargeable lighters can become a high-resource-efficiency appliance category rather than a niche eco gadget.",[882,35143,35145],{"id":35144},"why-this-makes-reidea-a-dematerialization-case","Why this makes REIDEA a dematerialization case",[692,35147,35148],{},"Even with a lithium battery and PCB inside, a REIDEA lighter remains directionally favorable when it replaces repeated disposable purchases.",[692,35150,35151],{},"That is the key sustainability logic here:",[751,35153,35154,35157,35160,35163],{},[754,35155,35156],{},"a very small amount of electricity",[754,35158,35159],{},"a more durable piece of hardware",[754,35161,35162],{},"fewer disposable plastic shells",[754,35164,35165],{},"less butane burned across the system",[692,35167,35168,35169,35172],{},"In sustainability language, this is a classic ",[702,35170,35171],{},"dematerialization"," story: using one longer-lived product system to cut repeated low-value material throughput.",[692,35174,35175],{},"This does not mean there are no trade-offs. The battery and electronics still need responsible end-of-life handling, and the company would be stronger if it published recycling and take-back guidance. But as a resource-efficiency model, the basic logic is compelling.",[882,35177,35179],{"id":35178},"so-is-reidea-actually-eco-friendly","So, is REIDEA actually eco-friendly?",[692,35181,35182],{},[702,35183,35184],{},"More eco-efficient? Yes.",[692,35186,35187],{},[702,35188,35189],{},"Fully proven as a sustainability leader? Not yet.",[692,35191,29261],{},[692,35193,35194],{},"Based on publicly disclosed data, REIDEA has a clear product-level sustainability narrative built around:",[751,35196,35197,35200,35203,35206,35209,35212],{},[754,35198,35199],{},"lower plastic use",[754,35201,35202],{},"lighter material footprint",[754,35204,35205],{},"improved battery efficiency",[754,35207,35208],{},"more compact electronics design",[754,35210,35211],{},"recyclable aluminum housing",[754,35213,35214],{},"a meaningful annual replacement effect versus disposable butane lighters",[692,35216,35217],{},"These are all better signals than vague \"green lifestyle\" branding.",[692,35219,35220],{},"At the same time, this is still not the same as having a full public sustainability report with:",[751,35222,35223,35226,35229,35232,35235,35238],{},[754,35224,35225],{},"carbon accounting",[754,35227,35228],{},"supply-chain labor disclosures",[754,35230,35231],{},"packaging data by market",[754,35233,35234],{},"recycled material percentages",[754,35236,35237],{},"end-of-life or repair guidance",[754,35239,35240],{},"third-party audited environmental claims",[692,35242,35243,35244,35247,35248,35251],{},"So the brand is making ",[702,35245,35246],{},"real engineering improvements",", but the public evidence still sits closer to ",[702,35249,35250],{},"credible product optimization"," than to a fully transparent ESG program.",[882,35253,29296],{"id":29295},[728,35255,35257],{"id":35256},"what-reidea-does-well","What REIDEA does well",[751,35259,35260,35263,35266,35269,35272,35278],{},[754,35261,35262],{},"makes concrete optimization claims instead of only abstract sustainability language",[754,35264,35265],{},"improves rechargeable lighter efficiency in a way consumers can understand",[754,35267,35268],{},"reduces plastic and overall product weight",[754,35270,35271],{},"shrinks internal PCB footprint, which suggests genuine design refinement",[754,35273,35274,35275,35277],{},"has at least one product, the ",[894,35276,34388],{},", with both commercial and editorial visibility",[754,35279,35280],{},"is capable of preventing significant disposable-lighter waste at current sales scale",[728,35282,35284],{"id":35283},"what-still-needs-stronger-disclosure","What still needs stronger disclosure",[751,35286,35287,35290,35293,35296,35299,35302],{},[754,35288,35289],{},"model-by-model breakdown of material changes",[754,35291,35292],{},"clearer confirmation of recycled aluminum content",[754,35294,35295],{},"packaging reduction data",[754,35297,35298],{},"lifecycle or durability evidence",[754,35300,35301],{},"broader company-level sustainability reporting beyond product claims",[754,35303,35304],{},"recycling guidance for batteries and electronics at end of life",[882,35306,29333],{"id":29332},[692,35308,35309,35310,35313],{},"REIDEA is ",[702,35311,35312],{},"more credible than a typical disposable-lighter sustainability claim",", mainly because the evidence points to specific product improvements rather than empty branding.",[692,35315,35316],{},"But the strongest version of the story is still this:",[7129,35318,35319],{},[692,35320,35321],{},"REIDEA is a product-optimization case, not yet a fully disclosed corporate sustainability case.",[692,35323,35324,35325,35328,35329,880],{},"That is still valuable. And at ",[702,35326,35327],{},"400,000 units sold per year",", the impact is already large enough to matter beyond the product itself: fewer disposable lighters, less butane, less plastic waste, and an annual net reduction of ",[702,35330,35331],{},"100 to 200 tons CO2e",[692,35333,35334],{},"For many consumers, that kind of practical improvement is exactly where sustainability begins.",{"title":613,"searchDepth":847,"depth":847,"links":35336},[35337,35338,35345,35350,35354,35360,35364,35365,35366,35367,35371],{"id":29077,"depth":847,"text":29078},{"id":34449,"depth":847,"text":34450,"children":35339},[35340,35341,35342,35343,35344],{"id":34453,"depth":850,"text":34454},{"id":34483,"depth":850,"text":34484},{"id":34527,"depth":850,"text":34528},{"id":34563,"depth":850,"text":34564},{"id":34598,"depth":850,"text":34599},{"id":34620,"depth":847,"text":34621,"children":35346},[35347,35348,35349],{"id":34624,"depth":850,"text":34364},{"id":34703,"depth":850,"text":34369},{"id":34746,"depth":850,"text":34374},{"id":34793,"depth":847,"text":34794,"children":35351},[35352,35353],{"id":34830,"depth":850,"text":34831},{"id":34871,"depth":850,"text":34872},{"id":34919,"depth":847,"text":34920,"children":35355},[35356,35357,35358,35359],{"id":34937,"depth":850,"text":34938},{"id":34962,"depth":850,"text":34963},{"id":35002,"depth":850,"text":35003},{"id":35021,"depth":850,"text":35022},{"id":35045,"depth":847,"text":35046,"children":35361},[35362,35363],{"id":35055,"depth":850,"text":35056},{"id":35075,"depth":850,"text":35076},{"id":35101,"depth":847,"text":35102},{"id":35144,"depth":847,"text":35145},{"id":35178,"depth":847,"text":35179},{"id":29295,"depth":847,"text":29296,"children":35368},[35369,35370],{"id":35256,"depth":850,"text":35257},{"id":35283,"depth":850,"text":35284},{"id":29332,"depth":847,"text":29333},"A plain-English breakdown of REIDEA's lighter product optimization claims, including plastic reduction, aluminum casing, lighter weight, improved battery efficiency, and smaller PCB usage across the S4, R1 Pro, and F2 Ultra lines.",{},{"title":677},{"title":31086,"description":35376},"Is REIDEA actually eco-friendly? A practical breakdown of its S4, R1 Pro, and F2 Ultra lighter product improvements, material changes, energy efficiency, and award signals.","0Wje87OQxy2wxQXycImLLpjaaq66lFsT1GijIKaTJGQ",{"id":35379,"title":31053,"badge":11642,"body":35380,"category":687,"description":35681,"extension":856,"links":687,"meta":35682,"navigation":35683,"path":682,"seo":35684,"stem":683,"tags":687,"__hash__":35686},"docs_en/en/4.brand-reports/shiseido-sustainability-report-2025.md",{"type":689,"value":35381,"toc":35668},[35382,35385,35393,35396,35399,35401,35404,35456,35459,35461,35464,35467,35480,35483,35486,35488,35491,35506,35509,35512,35514,35517,35519,35537,35540,35543,35545,35548,35551,35565,35568,35571,35575,35580,35585,35587,35590,35604,35606,35617,35619,35623,35637,35639,35653,35655,35658,35661,35663],[29056,35383,31053],{"id":35384},"shiseido-sustainability-report-2025",[692,35386,29061,35387,29065,35390,880],{},[702,35388,35389],{},"\"Is Shiseido actually eco-friendly?\"",[702,35391,35392],{},"Shiseido looks more credible as a disciplined premium-beauty operator than as a category-reinventing circularity leader",[692,35394,35395],{},"That is the right way to read the report.",[692,35397,35398],{},"Based on publicly disclosed data, Shiseido's 2025 sustainability disclosure is serious, structured, and measurable. The company is strongest where management systems matter most: packaging technology, climate and water oversight, governance, and responsible procurement. It is less convincing when the question becomes whether the whole beauty model has already been redesigned around circular consumption.",[882,35400,29078],{"id":29077},[692,35402,35403],{},"Based on publicly disclosed data, Shiseido reported several meaningful signals:",[751,35405,35406,35416,35424,35430,35439,35447],{},[754,35407,35408,720,35410,35412,35413],{},[894,35409,29401],{},[894,35411,29761],{}," emissions were about ",[894,35414,35415],{},"24,178 tCO2e",[754,35417,35418,35420,35421],{},[894,35419,29405],{}," emissions remained far larger at about ",[894,35422,35423],{},"885,000 tCO2e",[754,35425,35426,35427],{},"refill and reusable product formats reduced about ",[702,35428,35429],{},"5,200 tons CO2",[754,35431,35432,35433,35436,35437],{},"the ",[894,35434,35435],{},"LiquiForm"," packaging system can reduce plastic by about ",[702,35438,31710],{},[754,35440,35441,35442,35444,35445],{},"the same packaging approach can reduce ",[894,35443,31133],{}," by about ",[702,35446,32244],{},[754,35448,35449,35450,720,35453],{},"Shiseido was included in the ",[894,35451,35452],{},"CDP Climate A List",[894,35454,35455],{},"CDP Water A List",[692,35457,35458],{},"Those are strong management signals, even if they do not yet prove that the whole product system has been transformed.",[882,35460,29137],{"id":29136},[692,35462,35463],{},"This is where Shiseido looks strongest to ordinary beauty buyers.",[692,35465,35466],{},"Based on publicly disclosed data, the company is pushing resource efficiency through:",[751,35468,35469,35472,35475],{},[754,35470,35471],{},"refill and reusable formats",[754,35473,35474],{},"lighter packaging systems",[754,35476,35477,35479],{},[894,35478,35435],{},", which reduces both plastic use and carbon intensity at the packaging level",[692,35481,35482],{},"That matters because premium beauty often struggles to reconcile packaging experience with material efficiency. Shiseido is trying to solve that tension through packaging engineering rather than by simply asking consumers to accept lower-quality presentation.",[692,35484,35485],{},"The limitation is that these improvements still sit inside a much larger premium beauty portfolio. So the story is good, but not yet category-defining.",[882,35487,29161],{"id":29160},[692,35489,35490],{},"Based on publicly disclosed data, Shiseido's environmental story is serious in climate and water management:",[751,35492,35493,35500],{},[754,35494,35495,35496,35499],{},"it remains strong enough to achieve ",[894,35497,35498],{},"CDP A List"," scores in both climate and water",[754,35501,35502,35503,35505],{},"it reports direct emissions and much larger ",[894,35504,29405],{}," emissions in a reasonably transparent way",[692,35507,35508],{},"This matters because the company is not pretending that operational progress alone solves the footprint. The report makes clear that the main environmental reality still sits in the wider value chain.",[692,35510,35511],{},"In plain English, Shiseido looks like a company that understands the hard part of beauty sustainability. It just has not solved all of it yet.",[882,35513,29194],{"id":29193},[692,35515,35516],{},"Based on publicly disclosed data, the social case is credible mainly through governance and procurement discipline rather than through a dramatic community-sourcing identity.",[692,35518,32330],{},[751,35520,35521,35527,35534],{},[754,35522,35523,35524,35526],{},"women hold about ",[702,35525,29416],{}," of board seats",[754,35528,35529,35530,35533],{},"women account for roughly ",[702,35531,35532],{},"49.4%"," of senior management",[754,35535,35536],{},"responsible procurement and raw-material risk management are treated as formal systems",[692,35538,35539],{},"That is meaningful because it shows sustainability is not operating as a side team with weak leverage. It is embedded into decision-making and supply management.",[692,35541,35542],{},"Still, upstream sourcing risk remains part of the story, especially where raw-material traceability and human-rights exposure become more complex.",[882,35544,29218],{"id":29217},[692,35546,35547],{},"Shiseido also has a credible business case.",[692,35549,35550],{},"Based on publicly disclosed data, the value of the sustainability strategy comes from:",[751,35552,35553,35556,35559,35562],{},[754,35554,35555],{},"reducing packaging intensity without abandoning premium positioning",[754,35557,35558],{},"lowering climate and water risk over time",[754,35560,35561],{},"improving regulatory preparedness",[754,35563,35564],{},"strengthening procurement resilience in a global premium-beauty system",[692,35566,35567],{},"This is not a low-cost beauty model. It is a premium resilience model.",[692,35569,35570],{},"That distinction matters because Shiseido is not trying to win by being the simplest sustainability brand. It is trying to prove that premium beauty can become more efficient and less risky without losing its product quality logic.",[882,35572,35574],{"id":35573},"so-is-shiseido-actually-eco-friendly","So, is Shiseido actually eco-friendly?",[692,35576,35577],{},[702,35578,35579],{},"More disciplined and more transparent than many premium beauty peers? Yes.",[692,35581,35582],{},[702,35583,35584],{},"A fully circular beauty leader already? Not yet.",[692,35586,29261],{},[692,35588,35589],{},"Based on publicly disclosed data, Shiseido deserves credit for:",[751,35591,35592,35595,35598,35601],{},[754,35593,35594],{},"meaningful packaging innovation",[754,35596,35597],{},"strong climate and water governance",[754,35599,35600],{},"credible disclosure on direct and value-chain emissions",[754,35602,35603],{},"a sustainability model tied to premium-beauty resilience",[692,35605,29281],{},[751,35607,35608,35611,35614],{},[754,35609,35610],{},"larger-scale circular product adoption",[754,35612,35613],{},"deeper value-chain decarbonization",[754,35615,35616],{},"continued tightening of responsible raw-material systems",[882,35618,29296],{"id":29295},[728,35620,35622],{"id":35621},"what-shiseido-does-well","What Shiseido does well",[751,35624,35625,35628,35631,35634],{},[754,35626,35627],{},"treats sustainability as an engineering and management problem",[754,35629,35630],{},"improves packaging without collapsing premium-brand logic",[754,35632,35633],{},"reports climate and water issues with more discipline than average",[754,35635,35636],{},"gives governance real weight inside the sustainability story",[728,35638,29318],{"id":29317},[751,35640,35641,35644,35650],{},[754,35642,35643],{},"stronger consumer-visible circularity at portfolio scale",[754,35645,35646,35647,35649],{},"faster progress on the much larger ",[894,35648,29405],{}," footprint",[754,35651,35652],{},"more legible proof that procurement systems are reducing the hardest upstream risks",[882,35654,29333],{"id":29332},[692,35656,35657],{},"Shiseido's 2025 sustainability report is worth reading because it shows a premium beauty company trying to modernize the system without pretending the system is already fixed.",[692,35659,35660],{},"That is why it makes this Top 10.",[692,35662,29342],{},[7129,35664,35665],{},[692,35666,35667],{},"Shiseido is strongest when sustainability is treated as premium-beauty risk management and product engineering, not when it is judged as a pure refill-first beauty story.",{"title":613,"searchDepth":847,"depth":847,"links":35669},[35670,35671,35672,35673,35674,35675,35676,35680],{"id":29077,"depth":847,"text":29078},{"id":29136,"depth":847,"text":29137},{"id":29160,"depth":847,"text":29161},{"id":29193,"depth":847,"text":29194},{"id":29217,"depth":847,"text":29218},{"id":35573,"depth":847,"text":35574},{"id":29295,"depth":847,"text":29296,"children":35677},[35678,35679],{"id":35621,"depth":850,"text":35622},{"id":29317,"depth":850,"text":29318},{"id":29332,"depth":847,"text":29333},"A plain-English breakdown of Shiseido's 2025 sustainability performance across packaging innovation, climate and water management, social responsibility, and premium-beauty economics.",{},{"title":681},{"title":31053,"description":35685},"Is Shiseido actually eco-friendly? A practical reading of Shiseido's 2025 sustainability disclosures across refill systems, climate, water, procurement, and premium-beauty resilience.","yi78koRTgC-vz80p3AVLQ-tLxnSpdmOf-Ts0qWQPUrw",{"id":17637,"title":332,"badge":687,"body":35688,"category":267,"description":17787,"extension":856,"links":687,"meta":35819,"navigation":859,"path":333,"seo":35820,"stem":334,"tags":35821,"__hash__":17791},{"type":689,"value":35689,"toc":35817},[35690],[5728,35691,35692,35810],{":component-files":17642,"component-id":17643,"config":17644,"demo-file":17645},[3549,35693,35694,35696,35792,35794,35796],{"v-slot:api":613},[882,35695,5856],{"id":5855},[5858,35697,35698,35710],{},[5861,35699,35700],{},[5864,35701,35702,35704,35706,35708],{},[5867,35703,5869],{},[5867,35705,5872],{},[5867,35707,5875],{},[5867,35709,5878],{},[5880,35711,35712,35728,35744,35760,35776],{},[5864,35713,35714,35718,35722,35726],{},[5885,35715,35716],{},[894,35717,5889],{},[5885,35719,35720],{},[894,35721,5894],{},[5885,35723,35724],{},[894,35725,17127],{},[5885,35727,17682],{},[5864,35729,35730,35734,35738,35742],{},[5885,35731,35732],{},[894,35733,17689],{},[5885,35735,35736],{},[894,35737,5914],{},[5885,35739,35740],{},[894,35741,7446],{},[5885,35743,17700],{},[5864,35745,35746,35750,35754,35758],{},[5885,35747,35748],{},[894,35749,17707],{},[5885,35751,35752],{},[894,35753,5914],{},[5885,35755,35756],{},[894,35757,7446],{},[5885,35759,17718],{},[5864,35761,35762,35766,35770,35774],{},[5885,35763,35764],{},[894,35765,16915],{},[5885,35767,35768],{},[894,35769,5914],{},[5885,35771,35772],{},[894,35773,7446],{},[5885,35775,17735],{},[5864,35777,35778,35782,35786,35790],{},[5885,35779,35780],{},[894,35781,17742],{},[5885,35783,35784],{},[894,35785,6016],{},[5885,35787,35788],{},[894,35789,6236],{},[5885,35791,17753],{},[882,35793,16751],{"id":16750},[692,35795,17758],{},[751,35797,35798,35804],{},[754,35799,35800,17768],{},[702,35801,35802],{},[894,35803,17767],{},[754,35805,35806,17776],{},[702,35807,35808],{},[894,35809,17775],{},[3549,35811,35812],{"v-slot:credits":613},[754,35813,6857,35814,880],{},[696,35815,725],{"href":17783,"rel":35816},[700],{"title":613,"searchDepth":847,"depth":847,"links":35818},[],{},{"title":332,"description":17787},[1067,5952,6732],[35823,35824],{"title":328,"path":329,"stem":330,"description":17631,"children":-1},{"title":336,"path":337,"stem":338,"description":17927,"children":-1},1784770250055]