@jaredpdesigns/pasta/code.css

Pasta provides a great starting place for web projects. It combines light styling for common web elements, yummy!

@layer config{code,pre{--bg:var(--color__contrast--extra);--color:white}code{font-family:var(--type__family--tertiary);font-size:var(--type__size--s);line-height:var(--type__lineheight--m)}* code{background-color:var(--bg);border-radius:var(--size__xs);-webkit-box-decoration-break:clone;box-decoration-break:clone;color:var(--color);padding:var(--size__xs) var(--size__s);word-wrap:break-word}pre>code{-webkit-overflow-scrolling:touch;background:none;display:block;max-width:100%;overflow-x:scroll;padding:var(--size__m);white-space:pre}pre{background-color:var(--bg);border-radius:var(--size__s);color:var(--color)}pre .comment,pre .prolog,pre .doctype,pre .cdata,pre .namespace,pre .operator,pre .function{opacity:0.75}pre .parameter,pre .property,pre .boolean,pre .number{color:var(--color__primary,color-mix(in lch,hsl(from var(--color__eggplant) h calc(s * 1.5) l) 75%,var(--color__contrast--fixed)))}pre .selector,pre .attr-name,pre .string,pre .char,pre .builtin,pre .inserted,pre .atrule,pre .attr-value,pre .class-name,pre .regex,pre .important{color:var(--color__secondary,color-mix(in lch,hsl(from var(--color__cobalt) h calc(s * 1.5) l) 75%,var(--color__contrast--fixed)))}pre .tag,pre .constant,pre .symbol,pre .deleted,pre .keyword{color:var(--color__tertiary,color-mix(in lch,hsl(from var(--color__basil) h calc(s * 1.5) l) 75%,var(--color__contrast--fixed)))}pre .important,pre .bold{font-weight:bold}pre .italic{font-style:italic}}