https://github.com/kyza/color-regex
Pattern matching and extracting color code formats using RegEx.
https://github.com/kyza/color-regex
javascript pomsky regex rust typescript
Last synced: 10 months ago
JSON representation
Pattern matching and extracting color code formats using RegEx.
- Host: GitHub
- URL: https://github.com/kyza/color-regex
- Owner: Kyza
- License: mit
- Created: 2023-02-16T21:48:21.000Z (over 3 years ago)
- Default Branch: trunk
- Last Pushed: 2023-08-07T02:38:22.000Z (almost 3 years ago)
- Last Synced: 2025-04-01T11:02:17.291Z (about 1 year ago)
- Topics: javascript, pomsky, regex, rust, typescript
- Homepage:
- Size: 7.48 MB
- Stars: 6
- Watchers: 1
- Forks: 2
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Color RegEx
Pattern matching and extracting color code formats using RegEx.
Written in [Pomsky](https://pomsky-lang.org).
- [Source](/index.pom)
- [Compiled](/index.reg)
## Support
- [x] [Hexadecimal](https://w3c.github.io/csswg-drafts/css-color/#hex-color)
- [x] [RGB](https://w3c.github.io/csswg-drafts/css-color/#funcdef-rgb) / [RGBA](https://w3c.github.io/csswg-drafts/css-color/#funcdef-rgba)
- [x] [COLOR](https://w3c.github.io/csswg-drafts/css-color/#funcdef-color)
- [x] [HSL](https://w3c.github.io/csswg-drafts/css-color/#funcdef-hsl) / [HSLA](https://w3c.github.io/csswg-drafts/css-color/#funcdef-hsla)
- [x] [HWB](https://w3c.github.io/csswg-drafts/css-color/#funcdef-hwb)
- [x] [LAB](https://w3c.github.io/csswg-drafts/css-color/#funcdef-lab) / [OKLAB](https://w3c.github.io/csswg-drafts/css-color/#funcdef-oklab)
- [x] [LCH](https://w3c.github.io/csswg-drafts/css-color/#funcdef-lch) / [OKLCH](https://w3c.github.io/csswg-drafts/css-color/#funcdef-oklch)
- [x] [\](https://w3c.github.io/csswg-drafts/css-color/#named-colors)
- [x] [\](https://w3c.github.io/csswg-drafts/css-color/#css-system-colors)
- [x] [currentColor](https://w3c.github.io/csswg-drafts/css-color/#currentcolor-color)
## [Blocks Example](https://blocks.githubnext.com/Kyza/color-regex/blob/trunk/README.md)
## Playground
- [Pomsky](https://playground.pomsky-lang.org/?text=)
- [Regex101](https://regex101.com/r/3HmoM7)
## Visualization
From [https://regexper.com/](https://regexper.com/).

## Usage
It always matches 1, 3, 4, or 5 unnamed groups.
### 1
This group will be the name of the color alias such as `red` or `papayawhip`.
### 3-5
These groups are the color type, then the color values.
OR
These groups are `"color"`, the color type, then the color values.
### Usage
Just filter out the undefined values and you'll have an array of the values you want.
```js
"rgb(255, 255, 255)".match(regex).filter((item, i) => i > 0 && item != null)
"color(display-p3 1 1 1 / 1)".match(regex).filter((item, i) => i > 0 && item != null)
```
## Why?
For fun and to demonstrate Pomsky's power of making complex regular expressions that are still readable.