Advertisement
powylv

[music player] kyomoto

Feb 26th, 2023 (edited)
1,735
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.23 KB | None | 0 0
  1. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css">
  2.  
  3. <!---------- © FIOREFAE ---------->
  4.  
  5. <script src="https://static.tumblr.com/zark1bx/0dlrqoyhu/kyomotoplayer.js"></script>
  6.  
  7. <style>
  8. /*-------- © FIOREFAE --------*/
  9.  
  10. #kyoPlayer {
  11. display: flex;
  12. align-items: center;
  13. justify-content: center;
  14. width: 1.3rem;
  15. height: 1.3rem;
  16. border: 0.09rem solid #ffd6dc;
  17. border-radius: 30rem;
  18. background: linear-gradient(#ffffff, #ffe8ec);
  19. box-shadow: inset -13px 0px 6px -10px rgb(146 146 146 / 5%), inset 0px -13px 6px -12px rgb(84 84 84 / 30%);
  20. }
  21.  
  22.  
  23. #musicControls {
  24. /*****
  25. add this code if you're going to replace the icons with symbols or texts:
  26.  
  27. user-select: none;
  28. -webkit-user-select: none;
  29.  
  30. remove this comment if not
  31. ******/
  32.  
  33. font-size: 0.65rem;
  34. color: #FFF9F9;
  35. -webkit-text-stroke: 0.05rem #e6bfc5;
  36. }
  37. </style>
  38.  
  39. <div id="kyoPlayer">
  40. <div id="musicControls">
  41. <div class="playy" style="margin-left: 0.09rem;">
  42. <i class="fas fa-play"></i>
  43. </div>
  44. <div class="pausee" style="display: none;">
  45. <i class="fas fa-pause"></i></div>
  46. </div>
  47. </div>
  48.  
  49. <audio id="myMusic" src="https://cdn.discordapp.com/attachments/957960883374526546/1078620843355164692/Madeleine"></audio>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement