Easy to use, run and install Svelte component for building SVG stars-rating. It can be used to make unlimited stars with fractional rating and any colors. Component compatible with Server Side Rendering (SSR).

Installation

npm install svelte-rating-svg

Usage

<script>
  import Rating from 'svelte-rating-svg'
</script>

<Rating value="0.25"/>

Properties

| Property | Description | Type | Default | | --- | --- | --- | --- | | value | Value between 0 and 1 | Number | 0 | | color | Color of stars | String | red | | max | Maximum number of stars | Number | 5 | | duration | Transition duration in milliseconds | Number | 1000 |

Examples

| Code | Result | | --- | --- | | <Rating value="0.5" color="green" max="3"/> | | | <Rating value="0.9" color="#AAA" duration="10000"/> | | | <Rating value="0.4321" max="1"/> | |