Skip to content

Instantly share code, notes, and snippets.

@obsd

obsd/auth0-custom-universal-login-template.html

Last active March 13, 2024 18:20
Show Gist options
  • Star 3 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save obsd/9f05d322a03f47d54b302754e9e000df to your computer and use it in GitHub Desktop.
Save obsd/9f05d322a03f47d54b302754e9e000df to your computer and use it in GitHub Desktop.
Download ZIP
Permit.io auth0 login template
Raw
auth0-custom-universal-login-template.html
<!DOCTYPE html>
<html>
<head>
<link href='https://fonts.googleapis.com/css?family=Manrope' rel='stylesheet'>
<link rel="shortcut icon" type="image/png"
href="https://yt3.ggpht.com/ej3kSN0C9GiHS5wa2zNQ3Pd59UcnpFeYjnGGBJEub1Nagwl6vpoe21oIJKWjBjzqvHDYtUONCw=s68-c-k-c0x00ffffff-no-rj" />
{%- auth0:head -%}
<style>
body {
height: 100vh;
width: 100%;
font-family: Manrope;
}
.prompt-wrapper {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.page-container {
display: flex;
flex-direction: row-reverse;
height: 100%;
width: 100vw;
background-color: white;
}
.details-container {
background: linear-gradient(360deg, #505050 0%, #000000 89.23%);
flex: 1;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.widget-container {
flex: 1;
display: flex;
width: 100;
flex-direction: column;
align-items: center;
justify-content: center;
}
.auth-container {
min-height: 100px;
background-color: white;
}
.logo-container {
margin-top: 30px;
}
.header {
background: linear-gradient(90deg, #974EF2 0%, #FFB171 89.23%);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
width: 440px;
height: 219px;
margin-top: 80px;
font-family: Manrope;
font-style: normal;
font-weight: 800;
font-size: 62.42px;
line-height: 73px;
text-align: center;
}
.sub-header {
width: 420px;
height: 122px;
margin-top: 40px;
margin-bottom: 40px;
font-family: Manrope;
font-style: normal;
font-weight: bold;
font-size: 35px;
line-height: 49px;
text-align: center;
color: #FFFFFF;
}
.grid-container {
display: grid;
grid-template-columns: repeat(2, 1fr);
width: 100%;
}
.grid-item {
padding: 0 60px 0 40px;
font-size: 30px;
text-align: left;
}
h6 {
text-transform: uppercase;
color: white;
font-size: 17px;
font-weight: bold;
}
.grid-item-cont {
display: flex;
}
.grid-item-img {
display: flex;
margin-left: -25px;
}
.grid-item-desc {
font-size: 14px;
display: flex;
align-items: center;
color: white;
}
.terms-footer {
position: absolute;
bottom: 1%;
}
.terms-footer-mobile {
display: none;
}
@media screen and (max-width: 1000px) {
.terms-footer-mobile {
display: block;
color: white;
justify-self: center;
text-align-last: center;
margin: 0 10px 0 10px;
}
.terms-footer {
display: none;
}
.page-container {
flex-direction: column;
}
.widget-container {
background: black;
min-height: -webkit-fill-available;
min-height: 100vh;
}
.auth-container {
background: black;
}
.logo-container {
margin-top: 15px;
position: absolute;
top: 0px;
}
.header {
font-size: 50px;
max-width: 100%;
}
.sub-header {
font-size: 25px;
max-width: 100%;
}
.grid-container {
grid-template-columns: repeat(1, 1fr);
}
}
@media screen and (max-width: 480px) {
.logo-container {
filter: brightness(0%);
}
.widget-container {
background: white;
min-height: -webkit-fill-available;
min-height: 100vh;
}
.auth-container {
background: white;
margin-top: 45px;
}
}
</style>
<title>{{ prompt.screen.texts.pageTitle }}</title>
</head>
<body>
<div class="page-container">
<div class="widget-container">
<div class="auth-container">
{% if prompt.name == "login" or prompt.name == "signup" %}
<div class="prompt-wrapper">
{%- auth0:widget -%}
</div>
{% else %}
{%- auth0:widget -%}
{% endif %}
</div>
<div class="terms-footer">By signing up, you agree to our <a target="_blank" rel="noopener noreferrer"
href="https://permit.io/legal/terms/">Terms of Service</a> and <a target="_blank" rel="noopener noreferrer"
href="https://www.permit.io/legal/privacy/">Privacy Policy</a></div>
</div>
<div class="details-container">
<div class="logo-container">
<svg width="129" height="24" viewBox="0 0 129 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M0.1 23H4.18V15.68H9.22C9.42 15.68 9.7 15.67 10.06 15.65C10.42 15.63 10.74 15.6 11.02 15.56C12.94 15.26 14.35 14.47 15.25 13.19C16.15 11.9 16.6 10.35 16.6 8.54C16.6 6.72 16.155 5.17 15.265 3.89C14.375 2.61 12.96 1.82 11.02 1.52C10.74 1.47 10.42 1.44 10.06 1.43C9.71 1.41 9.43 1.4 9.22 1.4H0.1V23ZM4.18 11.87V5.21H9.04C9.25 5.21 9.48 5.22 9.73 5.24C9.98 5.26 10.21 5.3 10.42 5.36C10.97 5.51 11.395 5.765 11.695 6.125C11.995 6.475 12.2 6.87 12.31 7.31C12.43 7.74 12.49 8.15 12.49 8.54C12.49 8.93 12.43 9.345 12.31 9.785C12.2 10.215 11.995 10.61 11.695 10.97C11.395 11.32 10.97 11.57 10.42 11.72C10.21 11.78 9.98 11.82 9.73 11.84C9.48 11.86 9.25 11.87 9.04 11.87H4.18ZM26.8488 23.45C28.4088 23.45 29.8438 23.04 31.1538 22.22C32.4738 21.4 33.4388 20.25 34.0488 18.77L29.9688 17.6C29.3488 18.96 28.2288 19.64 26.6088 19.64C25.4988 19.64 24.6238 19.33 23.9838 18.71C23.3538 18.09 22.9638 17.2 22.8138 16.04H34.1838C34.3538 14.08 34.1538 12.375 33.5838 10.925C33.0138 9.475 32.1338 8.35 30.9438 7.55C29.7538 6.75 28.3088 6.35 26.6088 6.35C25.0088 6.35 23.5938 6.715 22.3638 7.445C21.1338 8.165 20.1688 9.18 19.4688 10.49C18.7688 11.8 18.4188 13.34 18.4188 15.11C18.4188 16.73 18.7738 18.17 19.4838 19.43C20.2038 20.68 21.1938 21.665 22.4538 22.385C23.7238 23.095 25.1888 23.45 26.8488 23.45ZM26.7888 9.89C27.7688 9.89 28.5188 10.135 29.0388 10.625C29.5688 11.115 29.9088 11.91 30.0588 13.01H22.9188C23.3488 10.93 24.6388 9.89 26.7888 9.89ZM37.5707 23H41.6807V14.72C41.6807 12.84 42.4207 11.56 43.9007 10.88C44.3807 10.65 44.9157 10.515 45.5057 10.475C46.1057 10.425 46.6307 10.47 47.0807 10.61V6.8C46.3507 6.71 45.6207 6.73 44.8907 6.86C44.1607 6.98 43.5007 7.22 42.9107 7.58C42.5307 7.8 42.1957 8.065 41.9057 8.375C41.6257 8.685 41.3807 9.03 41.1707 9.41V6.8H37.5707V23ZM49.904 23H54.014V13.19C54.014 12.26 54.269 11.505 54.779 10.925C55.299 10.335 55.984 10.04 56.834 10.04C57.724 10.04 58.419 10.34 58.919 10.94C59.429 11.53 59.684 12.36 59.684 13.43V23H63.764V13.19C63.764 12.26 64.019 11.505 64.529 10.925C65.049 10.335 65.734 10.04 66.584 10.04C67.474 10.04 68.169 10.34 68.669 10.94C69.179 11.53 69.434 12.36 69.434 13.43V23H73.514V12.35C73.514 10.58 73.039 9.15 72.089 8.06C71.149 6.96 69.754 6.41 67.904 6.41C66.864 6.41 65.909 6.635 65.039 7.085C64.169 7.535 63.474 8.15 62.954 8.93C62.534 8.17 61.934 7.56 61.154 7.1C60.374 6.64 59.404 6.41 58.244 6.41C57.264 6.41 56.364 6.605 55.544 6.995C54.724 7.375 54.044 7.9 53.504 8.57V6.8H49.904V23ZM77.7145 4.55H81.7945V0.95H77.7145V4.55ZM77.7145 23H81.7945V6.8H77.7145V23ZM96.0114 23V19.61C95.0514 19.74 94.1764 19.78 93.3864 19.73C92.5964 19.68 92.0214 19.37 91.6614 18.8C91.4714 18.5 91.3664 18.1 91.3464 17.6C91.3364 17.09 91.3314 16.52 91.3314 15.89V9.95H96.0114V6.8H91.3314V2.3H87.2514V6.8H84.4914V9.95H87.2514V16.13C87.2514 17.1 87.2614 17.97 87.2814 18.74C87.3014 19.5 87.5114 20.25 87.9114 20.99C88.3514 21.78 88.9914 22.355 89.8314 22.715C90.6814 23.065 91.6414 23.25 92.7114 23.27C93.7914 23.3 94.8914 23.21 96.0114 23ZM100.041 23H102.606V20.435H100.041V23ZM107.539 3.725H109.744V1.25H107.539V3.725ZM107.539 23H109.744V6.8H107.539V23ZM121.006 23.45C122.606 23.45 123.976 23.09 125.116 22.37C126.266 21.65 127.146 20.65 127.756 19.37C128.376 18.08 128.686 16.585 128.686 14.885C128.686 13.215 128.381 11.74 127.771 10.46C127.171 9.17 126.296 8.165 125.146 7.445C124.006 6.715 122.626 6.35 121.006 6.35C119.426 6.35 118.061 6.71 116.911 7.43C115.771 8.14 114.891 9.135 114.271 10.415C113.651 11.695 113.341 13.185 113.341 14.885C113.341 16.555 113.641 18.035 114.241 19.325C114.851 20.615 115.726 21.625 116.866 22.355C118.016 23.085 119.396 23.45 121.006 23.45ZM121.006 21.335C119.256 21.335 117.931 20.75 117.031 19.58C116.131 18.4 115.681 16.835 115.681 14.885C115.681 12.995 116.116 11.455 116.986 10.265C117.856 9.065 119.196 8.465 121.006 8.465C122.796 8.465 124.131 9.05 125.011 10.22C125.901 11.38 126.346 12.935 126.346 14.885C126.346 16.795 125.906 18.35 125.026 19.55C124.146 20.74 122.806 21.335 121.006 21.335Z"
fill="white" />
</svg>
</div>
<h2 class="header">
Fullstack Authorization as a Service
</h2>
<h4 class="sub-header">
The permission infrastructure for the internet
</h4>
<div class="grid-container">
<div class="grid-item">
<h6>
MAKE AUTH-Z EASY
</h6>
<div class="grid-item-cont">
<div class="grid-item-img">
<svg width="124" height="124" viewBox="0 0 124 124" fill="none" xmlns="http://www.w3.org/2000/svg">
<g filter="url(#filter0_d_1_4554)">
<circle cx="62.0152" cy="59.4148" r="37.0152" fill="white" />
</g>
<path
d="M59.8914 49.4192L58.8295 47.2954L56.7057 46.2335L58.8295 45.1716L59.8914 43.0477L60.9533 45.1716L63.0771 46.2335L60.9533 47.2954L59.8914 49.4192ZM50.3342 53.6669L48.5422 50.1493L45.0247 48.3573L48.5422 46.5653L50.3342 43.0477L52.1262 46.5653L55.6438 48.3573L52.1262 50.1493L50.3342 53.6669ZM73.6963 62.1621L75.4882 65.6797L79.0058 67.4717L75.4882 69.2637L73.6963 72.7812L71.9043 69.2637L68.3867 67.4717L71.9043 65.6797L73.6963 62.1621ZM78.4085 49.2865C78.8067 49.7289 79.0058 50.2378 79.0058 50.813C79.0058 51.3882 78.8067 51.8749 78.4085 52.2731L54.25 76.4316C53.8518 76.8298 53.3651 77.0289 52.7899 77.0289C52.2147 77.0289 51.7059 76.8298 51.2634 76.4316L45.622 70.7902C45.2238 70.3477 45.0247 69.8389 45.0247 69.2637C45.0247 68.6885 45.2238 68.2018 45.622 67.8035L69.7805 43.6451C70.1787 43.2468 70.6654 43.0477 71.2406 43.0477C71.8158 43.0477 72.3246 43.2468 72.7671 43.6451L78.4085 49.2865ZM68.8513 56.5207L74.6254 50.813L71.2406 47.4281L65.5328 53.2023L68.8513 56.5207Z"
fill="url(#paint0_linear_1_4554)" />
<defs>
<filter id="filter0_d_1_4554" x="0.727745" y="0.554629" width="122.575" height="122.575"
filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix" />
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
result="hardAlpha" />
<feOffset dy="2.42723" />
<feGaussianBlur stdDeviation="12.1361" />
<feComposite in2="hardAlpha" operator="out" />
<feColorMatrix type="matrix"
values="0 0 0 0 0.443137 0 0 0 0 0.317647 0 0 0 0 0.866667 0 0 0 0.2 0" />
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1_4554" />
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1_4554" result="shape" />
</filter>
<linearGradient id="paint0_linear_1_4554" x1="45.0247" y1="56.3152" x2="79.0058" y2="56.3152"
gradientUnits="userSpaceOnUse">
<stop stop-color="#974EF2" />
<stop offset="1" stop-color="#FFB171" />
</linearGradient>
</defs>
</svg>
</div>
<div class="grid-item-desc">
Enable multi-tenancy, RBAC, ABAC, and more in a snap.
</div>
</div>
</div>
<div class="grid-item">
<h6>
ADOPT THE BEST PRACTICES
</h6>
<div class="grid-item-cont">
<div class="grid-item-img">
<svg width="124" height="124" viewBox="0 0 124 124" fill="none" xmlns="http://www.w3.org/2000/svg">
<g filter="url(#filter0_d_1_4560)">
<circle cx="62.0501" cy="59.6854" r="37.0152" fill="white" />
</g>
<path
d="M77.2962 73.2313C77.6502 73.2313 77.9283 73.3325 78.1306 73.5347C78.3834 73.7876 78.5098 74.091 78.5098 74.4449V76.8722C78.5098 77.2261 78.3834 77.5043 78.1306 77.7065C77.9283 77.9594 77.6502 78.0858 77.2962 78.0858H60.3056C59.9517 78.0858 59.6483 77.9594 59.3954 77.7065C59.1932 77.5043 59.092 77.2261 59.092 76.8722V50.8553C58.7381 50.7036 58.4094 50.5267 58.106 50.3244L47.3352 53.9652C47.0317 54.0664 46.7283 54.0411 46.4249 53.8894C46.1215 53.7377 45.9193 53.5101 45.8181 53.2067L45.0596 50.8553C44.9079 50.5519 44.9079 50.2485 45.0596 49.9451C45.2113 49.6417 45.4642 49.4395 45.8181 49.3383L55.527 46.0767C55.4765 45.6722 55.4512 45.4194 55.4512 45.3182C55.4512 43.6495 56.0327 42.2336 57.1958 41.0706C58.4094 39.857 59.8505 39.2502 61.5192 39.2502C63.8453 39.2502 65.5899 40.2615 66.753 42.2842L75.7033 39.326C76.0068 39.2249 76.3102 39.2502 76.6136 39.4019C76.917 39.5536 77.1192 39.7811 77.2204 40.0845L77.9789 42.3601C78.1306 42.714 78.1306 43.0427 77.9789 43.3461C77.8272 43.5989 77.5743 43.8012 77.2204 43.9529L67.2081 47.2904C66.6518 48.9591 65.5646 50.1474 63.9465 50.8553V73.2313H77.2962ZM85.7915 62.3088C85.7915 63.4213 85.3617 64.4579 84.502 65.4187C83.6424 66.3289 82.4541 67.0621 80.9371 67.6184C79.4706 68.124 77.8525 68.3769 76.0826 68.3769C73.4025 68.3769 71.1017 67.7953 69.1802 66.6323C67.3092 65.4187 66.3737 63.9775 66.3737 62.3088C66.3737 62.3088 66.3737 62.2835 66.3737 62.233C66.3737 61.8284 66.5001 61.348 66.753 60.7918C67.0058 60.185 67.8907 58.3646 69.4077 55.3305C69.7111 54.7237 69.9387 54.2433 70.0904 53.8894C70.2927 53.5354 70.5455 53.055 70.8489 52.4482C71.2029 51.7908 71.5316 51.1587 71.835 50.5519C72.1384 49.8946 72.467 49.2119 72.821 48.504C73.4784 47.1892 74.5656 46.5318 76.0826 46.5318C77.5996 46.5318 78.6868 47.1892 79.3442 48.504C83.5413 56.8981 85.6651 61.2722 85.7157 61.6262C85.7662 61.7779 85.7915 62.0054 85.7915 62.3088ZM70.6213 61.0952H81.5439L76.0826 50.1727L70.6213 61.0952ZM50.2175 58.2129C51.2288 60.2356 52.3919 62.5869 53.7066 65.267C55.1731 68.1493 56.0327 69.8686 56.2855 70.4248C56.5384 70.9811 56.6648 71.4868 56.6648 71.9419C56.6648 71.9924 56.6648 72.0177 56.6648 72.0177C56.6648 73.6864 55.704 75.1023 53.7825 76.2654C51.9115 77.479 49.636 78.0858 46.9559 78.0858C44.2758 78.0858 41.975 77.479 40.0535 76.2654C38.1825 75.1023 37.247 73.6864 37.247 72.0177C37.247 72.0177 37.247 71.9924 37.247 71.9419C37.247 71.5373 37.3734 71.0569 37.6262 70.5007C37.8791 69.8939 38.764 68.0735 40.281 65.0394C41.5958 62.4099 42.7335 60.1344 43.6943 58.2129C44.3517 56.8981 45.4389 56.2407 46.9559 56.2407C48.4729 56.2407 49.5601 56.8981 50.2175 58.2129ZM41.4946 70.8041H52.4172L46.9559 59.8816L41.4946 70.8041Z"
fill="url(#paint0_linear_1_4560)" />
<defs>
<filter id="filter0_d_1_4560" x="0.762657" y="0.825136" width="122.575" height="122.575"
filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix" />
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
result="hardAlpha" />
<feOffset dy="2.42723" />
<feGaussianBlur stdDeviation="12.1361" />
<feComposite in2="hardAlpha" operator="out" />
<feColorMatrix type="matrix"
values="0 0 0 0 0.443137 0 0 0 0 0.317647 0 0 0 0 0.866667 0 0 0 0.2 0" />
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1_4560" />
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1_4560" result="shape" />
</filter>
<linearGradient id="paint0_linear_1_4560" x1="37.1711" y1="54.7653" x2="85.7157" y2="54.7653"
gradientUnits="userSpaceOnUse">
<stop stop-color="#974EF2" />
<stop offset="1" stop-color="#FFB171" />
</linearGradient>
</defs>
</svg>
</div>
<div class="grid-item-desc">
Upgrade to a modern stack with ease.
</div>
</div>
</div>
<div class="grid-item">
<h6>
POWER-UP YOUR ACCESS
</h6>
<div class="grid-item-cont">
<div class="grid-item-img">
<svg width="124" height="124" viewBox="0 0 124 124" fill="none" xmlns="http://www.w3.org/2000/svg">
<g filter="url(#filter0_d_1_4557)">
<circle cx="62.0152" cy="59.6321" r="37.0152" fill="white" />
</g>
<path
d="M68.8197 46.9226L46.4822 68.0112L54.9176 76.9462L77.2551 55.8576L74.4433 52.8793L75.9325 51.4733L73.1207 48.495L71.6315 49.9009L68.8197 46.9226ZM66.7525 43.2413C67.3729 42.6555 68.1054 42.3747 68.9498 42.399C69.7942 42.4233 70.5093 42.7457 71.0951 43.3662L71.798 44.1108L72.1703 43.7593C72.4805 43.4664 72.8468 43.326 73.269 43.3382C73.6912 43.3503 74.0487 43.5115 74.3416 43.8217L80.6682 50.523C80.9611 50.8332 81.1015 51.1995 81.0893 51.6217C81.0772 52.0439 80.916 52.4014 80.6057 52.6943L80.2334 53.0458L80.9364 53.7904C81.5222 54.4108 81.8029 55.1433 81.7787 55.9877C81.7544 56.8321 81.432 57.5472 80.8115 58.133L56.9848 80.6274C56.3643 81.2132 55.6319 81.494 54.7875 81.4697C53.9431 81.4454 53.228 81.123 52.6422 80.5026L42.8009 70.0784C42.2151 69.4579 41.9343 68.7255 41.9586 67.8811C41.9829 67.0367 42.3053 66.3216 42.9258 65.7358L66.7525 43.2413ZM64.2689 54.0354L69.8925 59.992L55.0009 74.0511L49.3772 68.0944L64.2689 54.0354Z"
fill="url(#paint0_linear_1_4557)" />
<defs>
<filter id="filter0_d_1_4557" x="0.727745" y="0.771914" width="122.575" height="122.575"
filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix" />
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
result="hardAlpha" />
<feOffset dy="2.42723" />
<feGaussianBlur stdDeviation="12.1361" />
<feComposite in2="hardAlpha" operator="out" />
<feColorMatrix type="matrix"
values="0 0 0 0 0.443137 0 0 0 0 0.317647 0 0 0 0 0.866667 0 0 0 0.2 0" />
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1_4557" />
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1_4557" result="shape" />
</filter>
<linearGradient id="paint0_linear_1_4557" x1="45.7166" y1="71.2925" x2="73.6288" y2="44.941"
gradientUnits="userSpaceOnUse">
<stop stop-color="#974EF2" />
<stop offset="1" stop-color="#FFB171" />
</linearGradient>
</defs>
</svg>
</div>
<div class="grid-item-desc">
Power your app with everything you need for permissions and access-control.
</div>
</div>
</div>
<div class="grid-item">
<h6>
BUILD WITH OPEN-SOURCE
</h6>
<div class="grid-item-cont">
<div class="grid-item-img">
<svg width="124" height="124" viewBox="0 0 124 124" fill="none" xmlns="http://www.w3.org/2000/svg">
<g filter="url(#filter0_d_1_4563)">
<circle cx="62.0501" cy="59.5289" r="37.0152" fill="white" />
</g>
<path
d="M69.7872 62.5174C70.108 62.5174 70.4059 62.4716 70.6809 62.3799L80.0982 59.6991V71.9348C80.0982 72.4389 79.9378 72.8971 79.617 73.3096C79.2962 73.6762 78.9067 73.9282 78.4484 74.0657L63.5319 77.7776C62.8445 77.961 62.1342 77.961 61.401 77.7776L46.5532 74.0657C46.0949 73.9282 45.7054 73.6762 45.3846 73.3096C45.0638 72.8971 44.9034 72.4389 44.9034 71.9348V59.6991L54.3208 62.3799C54.5957 62.4716 54.8936 62.5174 55.2144 62.5174C56.4975 62.5174 57.4599 61.9904 58.1015 60.9364L62.5008 53.5812L66.9002 60.9364C67.5417 61.9904 68.5041 62.5174 69.7872 62.5174ZM84.3601 54.8186C84.5434 55.1393 84.5663 55.4601 84.4288 55.7809C84.2913 56.1017 84.0393 56.3079 83.6727 56.3996L70.0622 60.249C69.5123 60.4323 69.0998 60.2719 68.8249 59.7678L62.5008 49.3194L79.6858 47.1197C80.2357 47.0739 80.6252 47.2801 80.8543 47.7384L84.3601 54.8186ZM44.1473 47.7384C44.3764 47.2801 44.766 47.0739 45.3159 47.1197L62.5008 49.3194L56.1768 59.7678C55.9018 60.2719 55.4894 60.4323 54.9394 60.249L41.329 56.3996C40.9623 56.3079 40.7103 56.1017 40.5728 55.7809C40.4353 55.4601 40.4583 55.1393 40.6416 54.8186L44.1473 47.7384Z"
fill="url(#paint0_linear_1_4563)" />
<defs>
<filter id="filter0_d_1_4563" x="0.762657" y="0.668642" width="122.575" height="122.575"
filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix" />
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
result="hardAlpha" />
<feOffset dy="2.42723" />
<feGaussianBlur stdDeviation="12.1361" />
<feComposite in2="hardAlpha" operator="out" />
<feColorMatrix type="matrix"
values="0 0 0 0 0.443137 0 0 0 0 0.317647 0 0 0 0 0.866667 0 0 0 0.2 0" />
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1_4563" />
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1_4563" result="shape" />
</filter>
<linearGradient id="paint0_linear_1_4563" x1="43.239" y1="58.1442" x2="81.6251" y2="58.1442"
gradientUnits="userSpaceOnUse">
<stop stop-color="#974EF2" />
<stop offset="1" stop-color="#FFB171" />
</linearGradient>
</defs>
</svg>
</div>
<div class="grid-item-desc">
Work with the confidence of open-source and the developer community.
</div>
</div>
</div>
</div>
<div class="terms-footer-mobile">By signing up, you agree to our <a target="_blank" rel="noopener noreferrer"
href="https://permit.io/legal/terms/">Terms of Service</a> and <a target="_blank" rel="noopener noreferrer"
href="https://www.permit.io/legal/privacy/">Privacy Policy</a></div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment