regex101: CSS URL parser tilde only

urlthe literal text url (case sensitive)

\(the literal ( (40₁₀ / 50₈ / 28₁₆)

Group 1(\'|\")

1st Alternative\'

\'the literal ' (39₁₀ / 47₈ / 27₁₆)

2nd Alternative\"

\"the literal " (34₁₀ / 42₈ / 22₁₆)

~the literal ~ (126₁₀ / 176₈ / 7E₁₆)

Character Class[\w.\/\-]*

*matches any number of characters from the set below:

\wany word character

.the literal . (46₁₀ / 56₈ / 2E₁₆)

\/the literal / (47₁₀ / 57₈ / 2F₁₆)

\-the literal - (45₁₀ / 55₈ / 2D₁₆)

Group 2(png|gif|jpg|jpeg|svg)

1st Alternativepng

pngthe literal text png (case sensitive)

2nd Alternativegif

gifthe literal text gif (case sensitive)

3rd Alternativejpg

jpgthe literal text jpg (case sensitive)

4th Alternativejpeg

jpegthe literal text jpeg (case sensitive)

5th Alternativesvg

svgthe literal text svg (case sensitive)

Character Class[\w.\/]*

*matches any number of characters from the set below:

\wany word character

.the literal . (46₁₀ / 56₈ / 2E₁₆)

\/the literal / (47₁₀ / 57₈ / 2F₁₆)

Group 3(\'|\")

1st Alternative\'

\'the literal ' (39₁₀ / 47₈ / 27₁₆)

2nd Alternative\"

\"the literal " (34₁₀ / 42₈ / 22₁₆)

\)the literal ) (41₁₀ / 51₈ / 29₁₆)

;*the literal ; (59₁₀ / 73₈ / 3B₁₆) , repeated any number of times

\s*any whitespace character, repeated any number of times

Global pattern flags

g modifier: global. Finds all matches instead of stopping after the first

26 tokens

Regular Expression

url\((\'|\")~[\w.\/\-]*(png|gif|jpg|jpeg|svg)[\w.\/]*(\'|\")\);*\s*

New

.FrontPage .fb {
  background: url("~fb-logo-blue.png");  }
  background: url("~/images/logos/fb-logo-blue.png"); }
  background: url("~fb-logo-blue.png");}
  background: url("~fb-logo-blue.gif");}
  background: url("~fb-logo-blue.jpg");}
  background: url("~fb-logo-blue.jpeg");}
  background: url("~fb-logo-blue.svg");}
  background:url("~fb-logo-blue.png");;}
  background:url("~fb-logo-blue.png");color:red}
  background:url("~fb-logo-blue.png")}
  background:url("~")}
  background:url("fb-logo-blue.png")}