Advertisement
reveriee

making waves (placeholder / png version)

Jul 15th, 2022
11
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.52 KB | None | 0 0
  1. [comment]--CODE BY REVERIEE--
  2. making waves (png version), placeholder. do not remove credit (visible or not) or claim as your own.
  3.  
  4. -- to change the colors/images, change the variables below --
  5. in order to change fonts, change the font in the variable, along with the corresponding font in the call-out tag in the comments below
  6.  
  7. [font=Petrona]main font[/font][/comment][border=0;
  8.  
  9. /*if you would like to customize the color of this icon, you must use a black png with a transparent background (if the original isn't black, you can edit that in image editing software!*/
  10. --icon: url(https://img2.pngio.com/tortoise-turtle-reptile-vector-graphics-portable-network-graphics-turtle-vector-png-1024_1022.png);
  11. --img: url(https://i.pinimg.com/736x/79/7a/34/797a34586458d60345b384dff946425f.jpg);
  12.  
  13. --bg: white;
  14. --c1:#55aaaa;
  15. --c2:#93c4c4;
  16.  
  17. --font: 'Petrona', serif;
  18. --textc: black;
  19.  
  20. width:250px;height:280px;background:var(--bg);box-sizing:border-box;padding:0;margin:auto;display:flex;flex-flow:column nowrap;justify-content:center;align-items:center;position:relative;overflow:hidden][border=0;background:var(--icon) 50% 50%;background-size:cover;height:220px;width:220px;padding:0;
  21.  
  22. /*this filter changes the color of the black icon to whatever you want! you can use https://codepen.io/sosuke/pen/Pjoqqp to get the filter for your target hex color (just copy and paste!)*/
  23. filter:invert(68%) sepia(20%) saturate(831%) hue-rotate(131deg) brightness(85%) contrast(89%);opacity:0.2;position:absolute;top:calc(50% - 110px);left:calc(50% - 110px);z-index:1][/border][border=0;border-radius:100%;height:120px;width:120px;z-index:3;padding:5px; box-sizing:border-box; border:5px solid var(--c1); border-left: 5px solid var(--c2); animation: fa-spin 20s linear infinite;][border=0; height:100%; width:100%; padding:0; background: var(--img)
  24.  
  25. /*edit image size and positioning here*/
  26. 50% 50%; background-size:cover; border-radius:100%; animation:fa-spin 20s linear infinite reverse;][/border][/border][border=0;margin:5px 0;font-family:var(--font);font-size:15px;padding:0;color:var(--textc);text-align:center][border=0;padding:0;font-weight:bold;text-transform:uppercase;color:var(--c1);font-size:17px][comment]
  27.  
  28. --name here--
  29.  
  30. [/comment]name here[/border][comment]
  31.  
  32. --role/quote here--
  33.  
  34. [/comment]"making waves"[/border][border=0;padding:3px;position:absolute;bottom:0;right:0;color:var(--c2);font-size:10px;font-family:var(--font);text-transform:uppercase;line-height:100%][comment]
  35.  
  36. --do not remove credit--
  37.  
  38. [/comment]© reveriee[/border][/border]
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement