https://github.com/thetrisatria/svelte-gradient-typography

Gradient typography for Svelte inspired by Apple's HomePod Mini landing page
https://github.com/thetrisatria/svelte-gradient-typography

component gradient svelte typography

Last synced: 25 days ago
JSON representation

Gradient typography for Svelte inspired by Apple's HomePod Mini landing page

• Host: GitHub
• URL: https://github.com/thetrisatria/svelte-gradient-typography
• Owner: thetrisatria
• Created: 2021-01-21T08:54:19.000Z (almost 4 years ago)
• Default Branch: master
• Last Pushed: 2021-01-21T11:08:27.000Z (almost 4 years ago)
• Last Synced: 2024-10-01T15:48:44.675Z (about 1 month ago)
• Topics: component, gradient, svelte, typography
• Language: Svelte
• Homepage:
• Size: 35.2 KB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# svelte-gradient-typography

![sample gradient text](https://raw.githubusercontent.com/thetrisatria/svelte-gradient-typography/master/misc/sample.jpg)

Gradient typography for [Svelte](https://svelte.dev) inspired by Apple's HomePod Mini landing page

## Get started

### Installation

```sh

npm install svelte-gradient-typography

```

### Usage

First you need to import it on the script section

```js

// ...

	import GradientText from 'svelte-gradient-typography';

// ...

```

then, for basic use (with default style) apply:

```html

    Lorem Ipsum

```

### Customization

To change the font size, add size property as follow

```html

    

      Lorem Ipsum in Pixel

    

```

To change the default gradient:

```html

    

      Lorem Ipsum Blue Gradient

    

```

And if you want to customize even further, just add CSS style:

```html

    

      Lorem Ipsum with Custom CSS

    

```