aboutsummaryrefslogtreecommitdiff
path: root/README.md
diff options
context:
space:
mode:
Diffstat (limited to 'README.md')
-rw-r--r--README.md25
1 files changed, 19 insertions, 6 deletions
diff --git a/README.md b/README.md
index 9ffe8d9..e4a40ef 100644
--- a/README.md
+++ b/README.md
@@ -20,12 +20,21 @@ bun add @inc/uchu
### JavaScript / TypeScript
```ts
-import { color, palette, reduced, yang } from "@inc/uchu";
-
-palette.blue[5]; // "oklch(54.87% 0.222 260.33)"
-color("red", 7); // "oklch(49.95% 0.195 18.34)"
-reduced.green[2]; // mid-shade green from the reduced palette
-yang; // off-white background constant
+import {
+ color,
+ palette,
+ pastelPalette,
+ pastelReduced,
+ reduced,
+ yang
+} from "@inc/uchu";
+
+palette.blue[5]; // "oklch(0.5487 0.222 260.33)"
+pastelPalette.blue[5] // "oklch(0.51 0.124 262)"
+color("red", 7); // "oklch(0.4995 0.195 18.34)"
+reduced.green[2]; // mid-shade green from the reduced palette
+pastelReduced.green[2]; // mid-shade green from the pastel version of the reduced palette
+yang; // off-white background constant
```
Types `Hue` and `Shade` are exported for narrowing palette keys.
@@ -36,6 +45,8 @@ Drop the stylesheet in and use the CSS custom properties:
```ts
import "@inc/uchu/css";
+// or
+import "@inc/uchu/pastel-css";
```
```css
@@ -50,6 +61,8 @@ body {
```scss
@use "@inc/uchu/scss" as *;
+// or
+@use "@inc/uchu/pastel-scss" as *;
body {
background-color: $uchu-yang;