diff --git a/src/shareon.css b/src/shareon.css
index bb9c58e..8cb113e 100644
--- a/src/shareon.css
+++ b/src/shareon.css
@@ -2,6 +2,8 @@
   --shareon-size: 20px;
   --shareon-padding: 8px;
   --shareon-radius: 4px;
+  --shareon-svg: none;
+  --shareon-background: #333;
 }
 
 .shareon {
@@ -11,8 +13,6 @@
 }
 
 .shareon > * {
-  --shareon-background: #333;
-
   box-sizing: content-box;
   height: var(--shareon-size);
   min-width: var(--shareon-size);
@@ -44,121 +44,94 @@
   height: var(--shareon-size);
   width: var(--shareon-size);
 
+  background-image: var(--shareon-svg);
   background-repeat: no-repeat;
   background-size: var(--shareon-size) var(--shareon-size);
   content: "";
   vertical-align: middle;
 }
 
-.shareon > .copy-url:before {
-  background-image: url("icons/copy-url.svg");
+.shareon > .copy-url {
+  --shareon-svg: url("icons/copy-url.svg");
 }
 
-.shareon > .copy-url.done:before {
-  background-image: url("icons/copy-url-done.svg");
+.shareon > .copy-url.done {
+  --shareon-svg: url("icons/copy-url-done.svg");
 }
 
 .shareon > .facebook {
-  background-color: #1877f2;
-}
-.shareon > .facebook:before {
-  background-image: url("icons/facebook.svg");
+  --shareon-svg: url("icons/facebook.svg");
+  --shareon-background: #1877f2;
 }
 
 .shareon > .linkedin {
-  background-color: #0a66c2;
+  --shareon-svg: url("icons/linkedin-in.svg");
+  --shareon-background: #0a66c2;
 }
-.shareon > .linkedin:before {
-  background-image: url("icons/linkedin-in.svg");
-}
-.shareon > .linkedin:not(:empty):before {
-  background-image: url("icons/linkedin.svg");
+.shareon > .linkedin:not(:empty) {
+  --shareon-svg: url("icons/linkedin.svg");
 }
 
 .shareon > .mastodon {
-  background-color: #6364ff;
-}
-.shareon > .mastodon:before {
-  background-image: url("icons/mastodon.svg");
+  --shareon-svg: url("icons/mastodon.svg");
+  --shareon-background: #6364ff;
 }
 
 .shareon > .messenger {
-  background-color: #00b2ff;
-}
-.shareon > .messenger:before {
-  background-image: url("icons/messenger.svg");
+  --shareon-svg: url("icons/messenger.svg");
+  --shareon-background: #00b2ff;
 }
 
 .shareon > .odnoklassniki {
-  background-color: #ee8208;
-}
-.shareon > .odnoklassniki:before {
-  background-image: url("icons/odnoklassniki.svg");
+  --shareon-svg: url("icons/odnoklassniki.svg");
+  --shareon-background: #ee8208;
 }
 
 .shareon > .pinterest {
-  background-color: #bd081c;
-}
-.shareon > .pinterest:before {
-  background-image: url("icons/pinterest.svg");
+  --shareon-svg: url("icons/pinterest.svg");
+  --shareon-background: #bd081c;
 }
 
 .shareon > .pocket {
-  background-color: #ef3f56;
-}
-.shareon > .pocket:before {
-  background-image: url("icons/pocket.svg");
+  --shareon-svg: url("icons/pocket.svg");
+  --shareon-background: #ef3f56;
 }
 
 .shareon > .reddit {
-  background-color: #ff4500;
-}
-.shareon > .reddit:before {
-  background-image: url("icons/reddit.svg");
+  --shareon-svg: url("icons/reddit.svg");
+  --shareon-background: #ff4500;
 }
 
 .shareon > .telegram {
-  background-color: #26a5e4;
-}
-.shareon > .telegram:before {
-  background-image: url("icons/telegram.svg");
+  --shareon-svg: url("icons/telegram.svg");
+  --shareon-background: #26a5e4;
 }
 
 .shareon > .teams {
-  background-color: #6264a7;
-}
-.shareon > .teams:before {
-  background-image: url("icons/teams.svg");
+  --shareon-svg: url("icons/teams.svg");
+  --shareon-background: #6264a7;
 }
 
 .shareon > .twitter {
-  background-color: #1d9bf0;
-}
-.shareon > .twitter:before {
-  background-image: url("icons/twitter.svg");
+  --shareon-svg: url("icons/twitter.svg");
+  --shareon-background: #1d9bf0;
 }
 
 .shareon > .viber {
-  background-color: #7360f2;
-}
-.shareon > .viber:before {
-  background-image: url("icons/viber.svg");
+  --shareon-svg: url("icons/viber.svg");
+  --shareon-background: #7360f2;
 }
 
 .shareon > .vkontakte {
-  background-color: #0077ff;
-}
-.shareon > .vkontakte:before {
-  background-image: url("icons/vkontakte.svg");
+  --shareon-svg: url("icons/vkontakte.svg");
+  --shareon-background: #0077ff;
 }
 
-.shareon > .web-share:before {
-  background-image: url("icons/web-share.svg");
+.shareon > .web-share {
+  --shareon-svg: url("icons/web-share.svg");
 }
 
 .shareon > .whatsapp {
-  background-color: #25d366;
-}
-.shareon > .whatsapp:before {
-  background-image: url("icons/whatsapp.svg");
+  --shareon-svg: url("icons/whatsapp.svg");
+  --shareon-background: #25d366;
 }