https://github.com/tadghh/rainbowjs

A simple JS class to add a rainbow outline
https://github.com/tadghh/rainbowjs

Last synced: 4 months ago
JSON representation

A simple JS class to add a rainbow outline

• Host: GitHub
• URL: https://github.com/tadghh/rainbowjs
• Owner: tadghh
• Created: 2024-12-25T06:05:55.000Z (6 months ago)
• Default Branch: main
• Last Pushed: 2024-12-25T06:11:42.000Z (6 months ago)
• Last Synced: 2024-12-25T07:21:19.972Z (6 months ago)
• Language: JavaScript
• Size: 3.91 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# rainbowjs

A simple JS class to add a dynamic rainbow outline

![image](https://github.com/user-attachments/assets/16a62abc-902d-4682-8f89-9c68dc453afa)

[Live Demo](https://tadgh.dev/highlightjs/)

# Usage

```js

import { RainbowText } from "./rainbow.js";

document.addEventListener("DOMContentLoaded", () => {

  const rainbowTitle = new RainbowText()

  // add the id of the object to add the effect on

  rainbowTitle.rainbow("prjTitle")

  // alternatively supply custom colors

  //rainbowTitle.rainbow("prjTitle",customHighlightColors)

  // can also be applied onto an existing class

  //rainbowTitle.rainbow("prjTitle",customHighlightColors, "classNameHere")

});

const customHighlightColors = {

  1: '#FFB5E8',  // Soft pink

  2: '#B28DFF',  // Lavender

  3: '#BFFCC6',  // Mint

  4: '#FFC9DE',  // Salmon pink

  default: '#C5A3FF'  // Light purple

}

```