Skip to content

Instantly share code, notes, and snippets.

@jpalala
Created June 30, 2019 06:20
Show Gist options
  • Save jpalala/8f6f9f1f4bb0408891751ff488cfe656 to your computer and use it in GitHub Desktop.
Save jpalala/8f6f9f1f4bb0408891751ff488cfe656 to your computer and use it in GitHub Desktop.
using png base64 as background image and scaling it
<style>
.base64 {
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAQAAABpN6lAAAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAADsQAAA7EAZUrDhsAAAAHdElNRQfjBh4GBQL0dv9bAAAMEUlEQVR42u2deZAU1R3HP9PHsBEEIawugpKSYHkVIEEjHlhoMAmxTCw1qFiKGiJWiOVZFY9QamGJGrEoLzAmYgSVSEyM8Uhw0YAHeESMIogxZbSUYxF0BdmZ6e6XP7q3ed3TPcdOv9mecn5dRdXOTHe/3+/9ju/v9977AU1qUpOa1KQmNalJTfp6UqZBRqmhkQEcNEDg4CCSeLSRctZNCoBgJKNoY0/24gu+ZDP/5l3veysZQaSPdABO4yF2IBAIbHLkyGF5f+/gYaZUPY2mp1GpJgMYx58QCPLYHsPhyyaPQPAsR3mMVcL82TzF/eyRXt3XgImsR3jslb/yCLZwsq818UI9iQ4EBboQmPH+z+hFB2mwB68jfDWv9LIRrGNojGqbwAQ2eL8TCLqYE6cDBofyAYLl6CUlqoYujZx5i1zok1yEiAoIrg9NnMvB+WwLCTXHvdETnKEPAguHXeTqqgU6sCpSvQWvMoezGMsB7M0BHM4U5vCy9L2sCR8BJhlvfo9kka8hwWtSnAY84Us7x4Y6hjvYSVcR808y0dNLEx0NDQ0d0xv8sfy5SAg5HAYAP/FYz+MUMR+LITS+GVKqv9aJ/b4hRvII5pUNce53t4butf1nOLFu8/a4QPiHIqWaXxfldy149/Ui30CvyAAz6MCzVTrNWOOO+vFs5SLYIYndRnC2Fw6rAfQnFAlRdqLB+b8vThHPjXnALKXsL5d8fAHBwIpATZiytLCzKFpYOAjai+bf9D1PgNp9GYa95h3KrP/CgM/JoZOtAT92eo60O3CuYgawOqADM4BJLOMlpsUZgINgZkgEDynKRYPOy+jR7MveZCUCwdvcwfHep69KpmHzIVdSQFDAQnCdfPPBkpUsBeaGIuyrVVpmJbQs4HT36fHsF6f3OgZZYEORWy/40cFhk6yMF0lh4zwMYH4owm6GmocYLXKB4OeJJygjcIq8QhAPfC7L7j5JVsO8ub65CJqMTBAgv+grZ4G1iRvYPZEIMDilv5NveF6yld10SRGGmpkIRNYYGnjywITN6/GSc+8atRW85b+evMJA8RTvs93XawmYgsZdvsbleUShc42/vh10uR2eAGy2hcLLiBDIyCE4rmY9kMU6INH5jxJAMSy+IvzOHb4APi4CGX3oDKiUg+CZGvRA5wgJrPxLQYh9hl3YWBQ8PQunTCuKb9niC2BLZIR9qsiFCKb1sLBqMFsa0jk1Rf84ms9nrGMJ1/EDMr6BuyP/LOqGOB+wmy6IwNtbGFOmGBVNayV0prbu0I++vh50ZwaRiGZ5ZBQIzttebAmlFjaCFexftRC6rdJms+Jcc2Rg2mwE/aI17reSlPaNcUo6cEtEfiV4nuEV1mYhgynhsseUCmBmwAHaCAZHe64s06UfTi3BSoY2PoosXq3hRMAoq9A635Huu06JB+iG2uG0eHCc49Y5VBrUkrJJx8URFTkLwVdc40HrTAkXOEm660xlAlgVKLLlEfQtHbfK1sxCVby7I4TgYCF4nnM9vdIi7z1DuuOHShYpMrSEYtZn5U10heQsjq9gWBn687fIQrb7nHam09djWQsI4HzptxOUCEBjeGBE/yyfy5qcIzHwQsXrOINjhNCdeG7jQc5ioP8WgyynS7/6sSIBtEnjeLwnALKtQniqAf24D4EVmX3ZvnDW8gDTOY4hjJe+P0+JD9AYJKn/vEqD9CJ/sAVeqcriMsAVdJQsR1vSd47vmm5SpAH9AwLQKrtpSGDAE6vC+hlM4DAWl6nKh83kOSURQKNVEsAtlQv5aV8HnB6BVFfVJvKwx55VNivfrkgA+0kCuLGyqczQJ7A2lOtxncaV90HM4h1P+Qsx1RmHnEII3G1m11YiAJ0WruRyfh2w2qU1DcJ1b4dxOU+yWfIEBSxsHM8+M0oEcIwk5BnlHa3BdxEUIlZXHkxgMN3yH85kLmMB7bzDVgSC+xWhQINTJR5OrcQHdMWWEJ/rUcIbbZkG2bosuger3MfEjV+TMECf2FAxgY6EdtU4WOTrsq9LMIKC/9cn8QvilUlzLzoZmfpNdTJZjJS4+7ASoZcOVxbv01j0theCK95SKRcOqthVkVqqqOYkm8AHOIG8wArswuzitQZiPiP965SqOssCWCOxO4jRXM9KuvxPtjK+QXYWu3yNkTThjUrSrSwz/TBocRUt/k39OIBWSPv20lhuKkQBOiMkh7cuIE2toZh36S8SpNu70vHLzm/PBlL4KOosu8oRQQulasBvemGfaHIuMCNp8+rKEfvhoa1EjUqmVHLLM7saALdN2mZ4RwNafnFlSzCucl0Ob5Tr37BmYEnerErK+bcW+KQhmdcC8Wx1uR+HdeA03/sb7KMsW1crgGl+HphhcfU15zWBGv8FDRgOt0ggqG+1niyDHkqDftpg87+/VHD9tGdB5PshEVzdUAKYK6GZWT2tYcwNieAfJLlFsj5psGsAPTbg50L7whxv7T/tEOhkKQK8W9vDVgYWNRwEbzGG0iv/vU+v+6N2+Fmtq45LIha9N/IL77FaCu1/76TB/HkRS1k2gq0spDWFBrFE2n26oFZN1ZkQe4TRJodgSKqgcjiAt9amo5mQP43aa700VbOfYYEUAFfU+jido8oubLenin0zMLpRtWpneJNR1HWWwg1u1dMj/vwntoaxIbBa6GBjS+d4r0kR87q0I0ggODIJB21yYcAH5NjJx7zEfC5geOrC4Frp9MlbScLK3dcUydrSxXyWyYGRHphUdDKYFQDE2dQWyeRNV08n/WiR+grR4sBhDj1JqG4yNSCCJ1KY/owOjPDG5PHpmwH5zk+x+tvsVAEwtBAiXESaGjAtD0zPwSqQSZaxoTzgzZSURwymBcL0QnVp5vlFx6WO6XUkYErVP4HNLrWvu7pov8gLDOrFGpHbU0xGqkNVj+WSiEMyyzjWm436a8PGgPVfVY/UfFLkcSnBIs6gTbLMetArEvu5qna212R1g/g84pBM3h/Ip7zCiXUYySIpLlmqrT/od+Gm2D5fDjYWgpMUa8G80HsH1NcT6fSnvUSzM4s3lb7/5tD7Dq1/SNaAVh6L2VFoK2iGsJvuDL1tSm/VJV2vfwrbI0QwVZlKPpqeRTsTGMP/ItraXaJM4KtD+9lv7R3W3bNBE3mnKCjmyDNMiUpmgY5QU4x7e4t1uIIvi5i3ESwFJWVSdw9j0OneVl/GDW9ep9LuN6gKlsi/kjanJvvu8AlwgeDapOe1u1tfxrs0rxFRN8CdyK28Lx2KDaPBGxTNfRa81olyFjIlSWBjYHMOX/ERG9nOlwg0TFrZlyEM4yDGMg4TKHjCCPr3AiYPcBEGSOczkpoYwXheIC99ZqMzqtZl7yCNKnmmLxeh7vIp8QW0eKdGVUSZv4dUP0cXeyYNe96tuoOrq/QWvwKFzF/s1R3ka6WKVMuuqnmt64kXM05Z1mcA36MzpHcWgsvUePjVZRsYO/5y2Hbu9vJ/NfDTBI5gXVEPsDxf0KYK8g6uoIfzG9zGZPoAmjLk7YKr/xThCwvBXSqrDAZwe2R4c9jEZB+KGMoqwS5rv4wAVwKHDvarR2LTypqI5nMOgo3M8GYoeQHoaMDRPIrwThKHXe3MelWYNOAEtkekt+7AVnlNUYxETEDzQtl47onsD+36/zsVgauSVngmuyLbELqq+QE3cbg3d9WXQTW/Y+i+TPc6k0W1Wcgj+CMtvVN0N4HTvSb08WFwPfM4k29JgNXEQEf3219r6OgYmBJsGcSPmM1yz7gKkfGmgOD3tFC3tadMpBAKjGcOE7BiVlptbI+xTt7jPd5nI5vYxA5y7ERg0oe+7ME+DKGN/TiEg7wuMgUyMc+0MIAbvP7wvX5gxwB0ZpftBmJjkS/RvNIhRz6mu0xw5+GLnAYKY02PtEMHRvNQmf/qoueXawbvMdM3vxSS6/UP4y46EhKE47dWeZZpaKR997EUsU2msNDrBeKQj80Uo+F03nd8y7iUA5Whi5qdYOnKkJv1j+ZoxjKWQ2jxvxXSafNMyNnlWM963uBlXkYAWWzsdNh5z+7S0P1CRT+GMZQ2BjAQg34IusiTYwdb2cxGNtPph0s7bX0IklDA7kIa3n+G1b1mIMA3gCY1qUlNalKTmtSkJjUpZfR/WaSCupJHJBEAAAAASUVORK5CYII=');
background-size: 50%;
background-repeat: no-repeat;;
height:64px;
width: 64px;
</style>
<div class="base64"></div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment