{"repo":"LoStis-World/svelte-textcircle","free":true,"listed":false,"github":"https://github.com/LoStis-World/svelte-textcircle","clone":"git clone https://github.com/LoStis-World/svelte-textcircle.git","description":"A Svelte component that displays text in a circular layout with customizable animations and styling.","language":"Svelte","stars":18,"topics":["animation","svelte","svelte5","sveltejs","sveltekit","textcircle","svelte-component"],"license":null,"category":"saas-starters-boilerplates","readme_excerpt":"svelte-textcircle A Svelte component that displays text in a circular layout with customizable animations and styling. You can check out the Demo in a Svelte Playground! Features - Display text strings in a circular arrangement. - Customize circle size, typography (font size, weight, transform), and appearance. - Add a custom divider character between words. - Set initial rotation. - Control animation: duration, easing, delay, direction, iteration count. - Trigger animation on component hover or when it enters the viewport. - Option to stop animation on hover. - Place custom content (like images, icons, or other components) in the center. - Highly customizable via props. - Automatically pauses animation when the component scrolls out of view and resumes it upon re-entry, leveraging IntersectionObserver for improved performance. - Built for Svelte 5 using runes. - Respects prefers-reduced-motion . Installation Basic Usage Props Main Props Property Type Default Description --------- -------- -------- -------------------------------------------------- text string[] Required An array of text strings to display in the circle. class string '' Additional CSS class(es) for the main container. options object {} Object for visual customization options. animation object {} Object for animation settings. children Snippet null Svelte Snippet for content in the center. Options Props ( options={{...}} ) Property Type Default Description --- --- --- --- circlesize string '250px' Size (width ","default_branch":null,"files":null,"tree":[],"storefront":"/r/LoStis-World","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/LoStis-World/svelte-textcircle/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}