开始使用，紫

CSS
01.cssbuttons-io-button {02  background: #a370f0;03  color: white;04  font-family: inherit;05  padding: 0.35em;06  padding-left: 1.2em;07  font-size: 17px;08  font-weight: 500;09  border-radius: 0.9em;10  border: none;11  letter-spacing: 0.05em;12  display: flex;13  align-items: center;14  box-shadow: inset 0 0 1.6em -0.6em #714da6;15  overflow: hidden;16  position: relative;17  height: 2.8em;18  padding-right: 3.3em;19  cursor: pointer;20}21 22.cssbuttons-io-button .icon {23  background: white;24  margin-left: 1em;25  position: absolute;26  display: flex;27  align-items: center;28  justify-content: center;29  height: 2.2em;30  width: 2.2em;31  border-radius: 0.7em;32  box-shadow: 0.1em 0.1em 0.6em 0.2em #7b52b9;33  right: 0.3em;34  transition: all 0.3s;35}36 37.cssbuttons-io-button:hover .icon {38  width: calc(100% - 0.6em);39}40 41.cssbuttons-io-button .icon svg {42  width: 1.1em;43  transition: transform 0.3s;44  color: #7b52b9;45}46 47.cssbuttons-io-button:hover .icon svg {48  transform: translateX(0.1em);49}50 51.cssbuttons-io-button:active .icon {52  transform: scale(0.95);53}