https://github.com/tanishqmanuja/ionic-color-injector
Inject custom colors as Ionic CSS Variables at runtime.
https://github.com/tanishqmanuja/ionic-color-injector
css ionic
Last synced: 3 months ago
JSON representation
Inject custom colors as Ionic CSS Variables at runtime.
- Host: GitHub
- URL: https://github.com/tanishqmanuja/ionic-color-injector
- Owner: tanishqmanuja
- License: mit
- Created: 2023-01-05T08:16:02.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-10-20T09:33:31.000Z (over 1 year ago)
- Last Synced: 2025-01-02T11:44:23.301Z (5 months ago)
- Topics: css, ionic
- Language: TypeScript
- Homepage: https://www.npmjs.com/package/@tqman/ionic-color-injector
- Size: 921 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Ionic Color Injector
Ionic Color Injector is a utility that injects ionic colors with generated css variables into the a html element at runtime.
## Installation
- via npm
```bash
npm install @tqman/ionic-color-injector
```
- via pnpm
```bash
pnpm add @tqman/ionic-color-injector
```
- via bun
```bash
bun install @tqman/ionic-color-injector
```
## Usage
```typescript
import { injectIonicColor } from "@tqman/ionic-color-injector";
// this will inject a style element into the document's head
injectIonicColor("primary", "#428cff");
/* Expected Result
:root {
--ion-color-primary: #428cff;
--ion-color-primary-rgb: 66,140,255;
--ion-color-primary-contrast: #000000;
--ion-color-primary-contrast-rgb: 0,0,0;
--ion-color-primary-shade: #3a7be0;
--ion-color-primary-tint: #5598ff;
}
...
*/
```