Stroke

Set the stroke color for SVG elements.

baselinewidely

Class	CSS
s:red-1	stroke: oklch(0.97 0.015 22);
s:red-2	stroke: oklch(0.91 0.046 22);
s:red-3	stroke: oklch(0.851 0.081 22);
s:red-4	stroke: oklch(0.791 0.12 22);
s:red-5	stroke: oklch(0.731 0.165 22);
s:red-6	stroke: oklch(0.672 0.208 22);
s:red	stroke: oklch(0.612 0.208 22);
s:red-7	stroke: oklch(0.547 0.208 22);
s:red-8	stroke: oklch(0.481 0.194 22);
s:red-9	stroke: oklch(0.416 0.168 22);
s:red-10	stroke: oklch(0.351 0.141 22);
s:red-11	stroke: oklch(0.285 0.115 22);
s:red-12	stroke: oklch(0.22 0.089 22);
s:orange-1	stroke: oklch(0.97 0.015 39);
s:orange-2	stroke: oklch(0.926 0.039 39);
s:orange-3	stroke: oklch(0.882 0.065 39);
s:orange-4	stroke: oklch(0.837 0.093 39);
s:orange-5	stroke: oklch(0.793 0.123 39);
s:orange-6	stroke: oklch(0.749 0.156 39);
s:orange	stroke: oklch(0.705 0.193 39);
s:orange-7	stroke: oklch(0.624 0.193 39);
s:orange-8	stroke: oklch(0.543 0.173 39);
s:orange-9	stroke: oklch(0.462 0.147 39);
s:orange-10	stroke: oklch(0.382 0.122 39);
s:orange-11	stroke: oklch(0.301 0.096 39);
s:orange-12	stroke: oklch(0.22 0.07 39);
s:yellow-1	stroke: oklch(0.97 0.027 80);
s:yellow-2	stroke: oklch(0.946 0.049 80);
s:yellow-3	stroke: oklch(0.923 0.071 80);
s:yellow-4	stroke: oklch(0.899 0.094 80);
s:yellow-5	stroke: oklch(0.875 0.118 80);
s:yellow-6	stroke: oklch(0.851 0.142 80);
s:yellow	stroke: oklch(0.828 0.167 80);
s:yellow-7	stroke: oklch(0.726 0.151 80);
s:yellow-8	stroke: oklch(0.625 0.13 80);
s:yellow-9	stroke: oklch(0.524 0.109 80);
s:yellow-10	stroke: oklch(0.423 0.088 80);
s:yellow-11	stroke: oklch(0.321 0.067 80);
s:yellow-12	stroke: oklch(0.22 0.046 80);
s:lime-1	stroke: oklch(0.97 0.066 131);
s:lime-2	stroke: oklch(0.936 0.154 131);
s:lime-3	stroke: oklch(0.903 0.204 131);
s:lime-4	stroke: oklch(0.869 0.204 131);
s:lime-5	stroke: oklch(0.835 0.204 131);
s:lime-6	stroke: oklch(0.802 0.204 131);
s:lime	stroke: oklch(0.768 0.204 131);
s:lime-7	stroke: oklch(0.677 0.185 131);
s:lime-8	stroke: oklch(0.585 0.16 131);
s:lime-9	stroke: oklch(0.494 0.135 131);
s:lime-10	stroke: oklch(0.403 0.11 131);
s:lime-11	stroke: oklch(0.311 0.085 131);
s:lime-12	stroke: oklch(0.22 0.06 131);
s:mint-1	stroke: oklch(0.97 0.043 168);
s:mint-2	stroke: oklch(0.942 0.086 168);
s:mint-3	stroke: oklch(0.913 0.134 168);
s:mint-4	stroke: oklch(0.885 0.15 168);
s:mint-5	stroke: oklch(0.857 0.15 168);
s:mint-6	stroke: oklch(0.828 0.15 168);
s:mint	stroke: oklch(0.8 0.15 168);
s:mint-7	stroke: oklch(0.703 0.142 168);
s:mint-8	stroke: oklch(0.607 0.123 168);
s:mint-9	stroke: oklch(0.51 0.103 168);
s:mint-10	stroke: oklch(0.413 0.084 168);
s:mint-11	stroke: oklch(0.317 0.064 168);
s:mint-12	stroke: oklch(0.22 0.045 168);
s:green-1	stroke: oklch(0.97 0.054 142);
s:green-2	stroke: oklch(0.918 0.161 142);
s:green-3	stroke: oklch(0.867 0.2 142);
s:green-4	stroke: oklch(0.815 0.2 142);
s:green-5	stroke: oklch(0.763 0.2 142);
s:green-6	stroke: oklch(0.712 0.2 142);
s:green	stroke: oklch(0.66 0.2 142);
s:green-7	stroke: oklch(0.587 0.197 142);
s:green-8	stroke: oklch(0.513 0.173 142);
s:green-9	stroke: oklch(0.44 0.148 142);
s:green-10	stroke: oklch(0.367 0.123 142);
s:green-11	stroke: oklch(0.293 0.099 142);
s:green-12	stroke: oklch(0.22 0.074 142);
s:cyan-1	stroke: oklch(0.97 0.031 205);
s:cyan-2	stroke: oklch(0.925 0.078 205);
s:cyan-3	stroke: oklch(0.88 0.126 205);
s:cyan-4	stroke: oklch(0.835 0.13 205);
s:cyan-5	stroke: oklch(0.79 0.13 205);
s:cyan-6	stroke: oklch(0.745 0.127 205);
s:cyan	stroke: oklch(0.7 0.12 205);
s:cyan-7	stroke: oklch(0.62 0.106 205);
s:cyan-8	stroke: oklch(0.54 0.092 205);
s:cyan-9	stroke: oklch(0.46 0.079 205);
s:cyan-10	stroke: oklch(0.38 0.065 205);
s:cyan-11	stroke: oklch(0.3 0.051 205);
s:cyan-12	stroke: oklch(0.22 0.038 205);
s:sky-1	stroke: oklch(0.97 0.016 237);
s:sky-2	stroke: oklch(0.942 0.032 237);
s:sky-3	stroke: oklch(0.913 0.048 237);
s:sky-4	stroke: oklch(0.885 0.065 237);
s:sky-5	stroke: oklch(0.857 0.081 237);
s:sky-6	stroke: oklch(0.828 0.099 237);
s:sky	stroke: oklch(0.8 0.116 237);
s:sky-7	stroke: oklch(0.703 0.12 237);
s:sky-8	stroke: oklch(0.607 0.12 237);
s:sky-9	stroke: oklch(0.51 0.111 237);
s:sky-10	stroke: oklch(0.413 0.09 237);
s:sky-11	stroke: oklch(0.317 0.069 237);
s:sky-12	stroke: oklch(0.22 0.048 237);
s:blue-1	stroke: oklch(0.97 0.014 263);
s:blue-2	stroke: oklch(0.899 0.049 263);
s:blue-3	stroke: oklch(0.829 0.085 263);
s:blue-4	stroke: oklch(0.758 0.123 263);
s:blue-5	stroke: oklch(0.687 0.164 263);
s:blue-6	stroke: oklch(0.617 0.207 263);
s:blue	stroke: oklch(0.546 0.215 263);
s:blue-7	stroke: oklch(0.492 0.215 263);
s:blue-8	stroke: oklch(0.437 0.215 263);
s:blue-9	stroke: oklch(0.383 0.191 263);
s:blue-10	stroke: oklch(0.329 0.164 263);
s:blue-11	stroke: oklch(0.274 0.137 263);
s:blue-12	stroke: oklch(0.22 0.11 263);
s:indigo-1	stroke: oklch(0.97 0.014 277);
s:indigo-2	stroke: oklch(0.906 0.046 277);
s:indigo-3	stroke: oklch(0.842 0.079 277);
s:indigo-4	stroke: oklch(0.778 0.114 277);
s:indigo-5	stroke: oklch(0.714 0.151 277);
s:indigo-6	stroke: oklch(0.65 0.189 277);
s:indigo	stroke: oklch(0.585 0.204 277);
s:indigo-7	stroke: oklch(0.525 0.204 277);
s:indigo-8	stroke: oklch(0.464 0.204 277);
s:indigo-9	stroke: oklch(0.403 0.204 277);
s:indigo-10	stroke: oklch(0.342 0.204 277);
s:indigo-11	stroke: oklch(0.281 0.174 277);
s:indigo-12	stroke: oklch(0.22 0.136 277);
s:violet-1	stroke: oklch(0.97 0.015 293);
s:violet-2	stroke: oklch(0.909 0.048 293);
s:violet-3	stroke: oklch(0.849 0.082 293);
s:violet-4	stroke: oklch(0.788 0.118 293);
s:violet-5	stroke: oklch(0.727 0.156 293);
s:violet-6	stroke: oklch(0.666 0.195 293);
s:violet	stroke: oklch(0.606 0.219 293);
s:violet-7	stroke: oklch(0.541 0.219 293);
s:violet-8	stroke: oklch(0.477 0.219 293);
s:violet-9	stroke: oklch(0.413 0.219 293);
s:violet-10	stroke: oklch(0.349 0.194 293);
s:violet-11	stroke: oklch(0.284 0.158 293);
s:violet-12	stroke: oklch(0.22 0.122 293);
s:lavender-1	stroke: oklch(0.97 0.016 294);
s:lavender-2	stroke: oklch(0.926 0.039 294);
s:lavender-3	stroke: oklch(0.883 0.063 294);
s:lavender-4	stroke: oklch(0.839 0.088 294);
s:lavender-5	stroke: oklch(0.796 0.114 294);
s:lavender-6	stroke: oklch(0.752 0.141 294);
s:lavender	stroke: oklch(0.709 0.159 294);
s:lavender-7	stroke: oklch(0.627 0.159 294);
s:lavender-8	stroke: oklch(0.546 0.159 294);
s:lavender-9	stroke: oklch(0.464 0.159 294);
s:lavender-10	stroke: oklch(0.383 0.159 294);
s:lavender-11	stroke: oklch(0.301 0.159 294);
s:lavender-12	stroke: oklch(0.22 0.122 294);
s:magenta-1	stroke: oklch(0.97 0.024 322);
s:magenta-2	stroke: oklch(0.919 0.066 322);
s:magenta-3	stroke: oklch(0.869 0.11 322);
s:magenta-4	stroke: oklch(0.818 0.156 322);
s:magenta-5	stroke: oklch(0.768 0.204 322);
s:magenta-6	stroke: oklch(0.717 0.255 322);
s:magenta	stroke: oklch(0.667 0.259 322);
s:magenta-7	stroke: oklch(0.592 0.259 322);
s:magenta-8	stroke: oklch(0.518 0.246 322);
s:magenta-9	stroke: oklch(0.443 0.21 322);
s:magenta-10	stroke: oklch(0.369 0.175 322);
s:magenta-11	stroke: oklch(0.294 0.14 322);
s:magenta-12	stroke: oklch(0.22 0.104 322);
s:pink-1	stroke: oklch(0.97 0.017 354);
s:pink-2	stroke: oklch(0.918 0.048 354);
s:pink-3	stroke: oklch(0.865 0.082 354);
s:pink-4	stroke: oklch(0.813 0.12 354);
s:pink-5	stroke: oklch(0.761 0.163 354);
s:pink-6	stroke: oklch(0.708 0.212 354);
s:pink	stroke: oklch(0.656 0.212 354);
s:pink-7	stroke: oklch(0.583 0.212 354);
s:pink-8	stroke: oklch(0.511 0.21 354);
s:pink-9	stroke: oklch(0.438 0.18 354);
s:pink-10	stroke: oklch(0.365 0.15 354);
s:pink-11	stroke: oklch(0.293 0.12 354);
s:pink-12	stroke: oklch(0.22 0.091 354);
s:coral-1	stroke: oklch(0.97 0.015 8);
s:coral-2	stroke: oklch(0.929 0.037 8);
s:coral-3	stroke: oklch(0.888 0.061 8);
s:coral-4	stroke: oklch(0.848 0.086 8);
s:coral-5	stroke: oklch(0.807 0.114 8);
s:coral-6	stroke: oklch(0.766 0.144 8);
s:coral	stroke: oklch(0.725 0.177 8);
s:coral-7	stroke: oklch(0.641 0.177 8);
s:coral-8	stroke: oklch(0.557 0.177 8);
s:coral-9	stroke: oklch(0.473 0.177 8);
s:coral-10	stroke: oklch(0.388 0.156 8);
s:coral-11	stroke: oklch(0.304 0.122 8);
s:coral-12	stroke: oklch(0.22 0.088 8);
s:zinc-1	stroke: oklch(0.97 0.015 286);
s:zinc-2	stroke: oklch(0.882 0.015 286);
s:zinc-3	stroke: oklch(0.794 0.015 286);
s:zinc-4	stroke: oklch(0.706 0.015 286);
s:zinc-5	stroke: oklch(0.618 0.015 286);
s:zinc-6	stroke: oklch(0.53 0.015 286);
s:zinc	stroke: oklch(0.442 0.015 286);
s:zinc-7	stroke: oklch(0.405 0.015 286);
s:zinc-8	stroke: oklch(0.368 0.015 286);
s:zinc-9	stroke: oklch(0.331 0.015 286);
s:zinc-10	stroke: oklch(0.294 0.015 286);
s:zinc-11	stroke: oklch(0.257 0.015 286);
s:zinc-12	stroke: oklch(0.22 0.015 286);
s:gray-1	stroke: oklch(0.97 0.014 264);
s:gray-2	stroke: oklch(0.9 0.023 264);
s:gray-3	stroke: oklch(0.83 0.023 264);
s:gray-4	stroke: oklch(0.761 0.023 264);
s:gray-5	stroke: oklch(0.691 0.023 264);
s:gray-6	stroke: oklch(0.621 0.023 264);
s:gray	stroke: oklch(0.551 0.023 264);
s:gray-7	stroke: oklch(0.496 0.023 264);
s:gray-8	stroke: oklch(0.441 0.023 264);
s:gray-9	stroke: oklch(0.386 0.023 264);
s:gray-10	stroke: oklch(0.33 0.023 264);
s:gray-11	stroke: oklch(0.275 0.023 264);
s:gray-12	stroke: oklch(0.22 0.023 264);
s:slate-1	stroke: oklch(0.97 0.014 257);
s:slate-2	stroke: oklch(0.901 0.041 257);
s:slate-3	stroke: oklch(0.831 0.041 257);
s:slate-4	stroke: oklch(0.762 0.041 257);
s:slate-5	stroke: oklch(0.693 0.041 257);
s:slate-6	stroke: oklch(0.624 0.041 257);
s:slate	stroke: oklch(0.554 0.041 257);
s:slate-7	stroke: oklch(0.499 0.041 257);
s:slate-8	stroke: oklch(0.443 0.041 257);
s:slate-9	stroke: oklch(0.387 0.041 257);
s:slate-10	stroke: oklch(0.331 0.041 257);
s:slate-11	stroke: oklch(0.276 0.041 257);
s:slate-12	stroke: oklch(0.22 0.041 257);
s:silver-1	stroke: oklch(0.97 0.014 261);
s:silver-2	stroke: oklch(0.927 0.019 261);
s:silver-3	stroke: oklch(0.885 0.019 261);
s:silver-4	stroke: oklch(0.842 0.019 261);
s:silver-5	stroke: oklch(0.799 0.019 261);
s:silver-6	stroke: oklch(0.756 0.019 261);
s:silver	stroke: oklch(0.714 0.019 261);
s:silver-7	stroke: oklch(0.631 0.019 261);
s:silver-8	stroke: oklch(0.549 0.019 261);
s:silver-9	stroke: oklch(0.467 0.019 261);
s:silver-10	stroke: oklch(0.385 0.019 261);
s:silver-11	stroke: oklch(0.302 0.019 261);
s:silver-12	stroke: oklch(0.22 0.019 261);
s:black	stroke: #000000;
s:current	stroke: currentColor;
s:transparent	stroke: transparent;
s:white	stroke: #ffffff;

Variants

Prefix any class with a variant to apply it only under that condition. Variants stack, as in @md:h:s:indigo-8.

Breakpoints

Apply a class from a viewport width up. Each breakpoint covers its width & every width above it.

@xs:s:indigo-8	From 32rem up.
@sm:s:indigo-8	From 40rem up.
@md:s:indigo-8	From 48rem up.
@lg:s:indigo-8	From 64rem up.
@xl:s:indigo-8	From 80rem up.
@xxl:s:indigo-8	From 96rem up.

Containers

Apply a class from a container's width up, not the viewport's. Mark the parent with ct:is first.

@c:xs:s:indigo-8	Container from 32rem up.
@c:sm:s:indigo-8	Container from 40rem up.
@c:md:s:indigo-8	Container from 48rem up.
@c:lg:s:indigo-8	Container from 64rem up.
@c:xl:s:indigo-8	Container from 80rem up.
@c:xxl:s:indigo-8	Container from 96rem up.

Media

Apply a class when the device or the page matches a condition, or on the first frame an element renders.

@pc:s:indigo-8	On a touch screen.
@prm:s:indigo-8	With reduced motion on.
@st:s:indigo-8	On the first frame.

States

Apply a class only while the element is in a state, such as hovered, focused or checked.

h:s:indigo-8	On :hover.
f:s:indigo-8	On :focus.
fv:s:indigo-8	On :focus-visible.
a:s:indigo-8	On :active.
d:s:indigo-8	On :disabled.
fc:s:indigo-8	On :first-child.
c:s:indigo-8	On :checked.
e:s:indigo-8	On :empty.
fw:s:indigo-8	On :focus-within.
i:s:indigo-8	On :invalid.
in:s:indigo-8	On :indeterminate.
lc:s:indigo-8	On :last-child.
nc:s:indigo-8	On :nth-child.
r:s:indigo-8	On :required.
ro:s:indigo-8	On :read-only.
v:s:indigo-8	On :valid.

Pseudo Elements

Style a part of the element rather than the element itself, such as its placeholder or the selected text.

a::s:indigo-8	On ::after.
b::s:indigo-8	On ::before.
p::s:indigo-8	On ::placeholder.
s::s:indigo-8	On ::selection.

Opacity

Add a slash & a step after a color to set its opacity.

s:indigo-8/50

At 50% opacity, in steps of 5.