# style-utils

> style css for tween-one and queue-anim

Latest version **0.3.8** (published 2022-05-12) · MIT license · 0 weekly downloads

## Install

```sh
npm install style-utils
pnpm add style-utils
yarn add style-utils
bun add style-utils
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.3.8 |
| Published | 2022-05-12 |
| First published | 2016-03-28 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 34.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 3 |
| Author | 155259966@qq.com |
| Maintainers | jljsj33 |

## Links

- npm: https://www.npmjs.com/package/style-utils
- Repository: https://github.com/jljsj/style-css
- Homepage: https://github.com/jljsj/style-css#readme
- Issues: https://github.com/jljsj/style-css/issues
- npm.io page: https://npm.io/package/style-utils

## Recent versions

- 0.3.8 (latest) — 2022-05-12
- 0.3.7 — 2022-03-31
- 0.3.6 — 2022-03-31
- 0.3.5 — 2022-03-31
- 0.3.4 — 2020-09-07
- 0.3.3 — 2020-09-04
- 0.3.2 — 2020-09-04
- 0.3.1 — 2020-09-01
- 0.3.0 — 2020-08-28
- 0.2.1 — 2020-08-28
- 0.2.0 — 2019-01-10
- 0.1.24 — 2018-12-27
- 0.1.23 — 2018-12-27
- 0.1.22 — 2018-11-20
- 0.1.21 — 2018-07-06
- … 24 more at https://npm.io/package/style-utils/versions

## README

# style-utils

tween-one 和 scroll-anim, queue-anim 的样式

color 和 transform 的分解..
 
### toCssLowerCase(v)

toCssLowerCase('lineHeight') => line-height;

### toStyleUpperCase(d)
toStyleUpperCase('line-height') => lineHeight;

### checkStyleName(p)
checkStyleName('filter') => WebkitFilter | MsFilter | MozFilter

### parseColor(value)

parseColor('#ff0') => [255,255,0,1];
parseColor('#ffff00') => [255,255,0,1];
parseColor('#ffff0080') => [255,255,0,0.5];
parseColor('rgb(255,255,0)') => [255,255,0,1];
parseColor('rgba(255,255,0,0.5)') => [255,255,0,0.5];
parseColor('hsl(60, 100%, 50%)') => [255,255,0,1];
parseColor('hsl(60deg 100% 50%)') => [255,255,0,1];
parseColor('hsl(60 100% 50% / 50%)') => [255,255,0,0.5];
parseColor('hsla(60,100%,50%,0.5)') => [255,255,0,0.5];

### parseShadow(v, key);
parseShadow('0 10px 10px #ffff00', 'text-shadow') => ['0', '10px', '10px', 255, 255, 0, 1];

### getColor(v)
getColor([255,255,0]) => rgb(255,255,0);

### getTransform(transform)
getTransform('translateX(100px) rotate(30deg)') => {translateX: 100, translateY: 0, rotate: 30, ...}
### mergeStyle(current, change)

mergeStyle('translate(30px,50em)', 'translateY(20em)') => translate(30px, 20em)

---
_Source: https://npm.io/package/style-utils · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._