<svg class="svg-key full-key__svg" width="669px" viewbox="0 0 669 575" xmlns="http://www.w3.org/2000/svg">
<defs>
<path id="svg-key_path-1" d="M336.811,508.706 L318.705,500.917 C314.094,507.679 308.255,513.314 301.616,517.584 L308.913,535.874 L287.362,544.473 L280.064,526.183 C272.307,527.653 264.19,527.6 256.192,525.865 L248.414,543.971 L227.103,534.816 L234.877,516.711 C228.105,512.099 222.479,506.257 218.209,499.617 L199.915,506.917 L191.317,485.37 L209.611,478.07 C208.133,470.302 208.205,462.187 209.932,454.193 L191.83,446.412 L200.982,425.093 L219.088,432.872 C223.713,426.105 229.542,420.473 236.182,416.203 L228.886,397.917 L250.438,389.318 L257.733,407.604 C265.493,406.139 273.593,406.198 281.59,407.933 L289.381,389.822 L310.7,398.983 L302.925,417.088 C309.676,421.709 315.313,427.527 319.588,434.18 L337.878,426.882 L346.477,448.433 L328.183,455.733 C329.66,463.497 329.584,471.604 327.865,479.605 L345.967,487.385 L336.811,508.706 Z M282.183,500.468 C263.716,507.836 242.773,498.839 235.405,480.373 C228.036,461.906 237.034,440.963 255.5,433.595 C273.967,426.227 294.91,435.224 302.278,453.69 C309.646,472.157 300.649,493.1 282.183,500.468 Z"></path>
<path id="svg-key_path-3" d="M602.458,342.688 L602.075,341.764 C601.633,341.947 601.383,342.417 601.477,342.886 L602.458,342.688 Z M638,327.966 L638.383,328.89 C638.893,328.679 639.135,328.094 638.924,327.584 L638,327.966 Z M602.474,389.296 L601.494,389.097 C601.399,389.566 601.649,390.037 602.091,390.22 L602.474,389.296 Z M638,404.018 L638.924,404.401 C639.135,403.89 638.893,403.306 638.383,403.094 L638,404.018 Z M620.665,445.888 L620.283,446.812 C620.528,446.913 620.803,446.913 621.048,446.812 C621.293,446.71 621.488,446.515 621.589,446.27 L620.665,445.888 Z M585.139,431.166 L585.522,430.242 C585.08,430.059 584.57,430.215 584.306,430.614 L585.139,431.166 Z M552.155,464.124 L551.603,463.29 C551.204,463.555 551.048,464.065 551.232,464.507 L552.155,464.124 Z M566.898,499.668 L567.281,500.592 C567.526,500.49 567.721,500.295 567.822,500.05 C567.924,499.805 567.924,499.53 567.822,499.284 L566.898,499.668 Z M525.025,516.998 L524.101,517.38 C524.312,517.89 524.897,518.133 525.407,517.922 L525.025,516.998 Z M510.309,481.465 L511.233,481.082 C511.05,480.64 510.58,480.39 510.111,480.484 L510.309,481.465 Z M463.691,481.487 L463.89,480.506 C463.421,480.411 462.951,480.662 462.767,481.104 L463.691,481.487 Z M448.976,516.998 L448.593,517.922 C449.103,518.133 449.688,517.89 449.899,517.38 L448.976,516.998 Z M407.118,499.668 L406.195,499.285 C406.093,499.53 406.093,499.805 406.195,500.05 C406.296,500.295 406.491,500.49 406.736,500.592 L407.118,499.668 Z M421.834,464.14 L422.758,464.523 C422.941,464.081 422.785,463.57 422.386,463.306 L421.834,464.14 Z M388.889,431.15 L389.722,430.597 C389.458,430.198 388.948,430.042 388.506,430.226 L388.889,431.15 Z M353.34,445.888 L352.417,446.27 C352.518,446.515 352.713,446.71 352.958,446.812 C353.203,446.913 353.478,446.913 353.723,446.811 L353.34,445.888 Z M336,404.018 L335.618,403.094 C335.373,403.196 335.178,403.39 335.076,403.635 C334.975,403.88 334.975,404.156 335.076,404.401 L336,404.018 Z M371.554,389.296 L371.936,390.22 C372.379,390.037 372.629,389.567 372.534,389.098 L371.554,389.296 Z M371.521,342.688 L372.501,342.887 C372.596,342.418 372.346,341.947 371.904,341.764 L371.521,342.688 Z M336.006,327.966 L335.082,327.584 C334.871,328.094 335.113,328.679 335.623,328.89 L336.006,327.966 Z M353.34,286.102 L353.723,285.178 C353.478,285.077 353.203,285.077 352.958,285.178 C352.713,285.28 352.518,285.474 352.417,285.719 L353.34,286.102 Z M388.861,300.824 L388.478,301.747 C388.921,301.931 389.431,301.775 389.695,301.376 L388.861,300.824 Z M421.84,267.888 L422.392,268.721 C422.791,268.457 422.947,267.947 422.763,267.505 L421.84,267.888 Z M407.113,232.344 L406.73,231.42 C406.22,231.632 405.978,232.217 406.189,232.727 L407.113,232.344 Z M448.97,214.998 L449.894,214.615 C449.682,214.104 449.097,213.862 448.587,214.074 L448.97,214.998 Z M463.702,250.541992 L462.778,250.924 C462.962,251.366 463.432,251.617 463.901,251.522 L463.702,250.541992 Z M510.326,250.525 L510.127,251.505 C510.596,251.6 511.067,251.35 511.25,250.907 L510.326,250.525 Z M525.025,214.998 L525.407,214.074 C525.162,213.972 524.887,213.972 524.642,214.074 C524.397,214.175 524.202,214.37 524.101,214.615 L525.025,214.998 Z M566.898,232.344 L567.822,232.727 C567.924,232.482 567.924,232.207 567.822,231.961 C567.721,231.716 567.526,231.522 567.281,231.42 L566.898,232.344 Z M552.177,267.849 L551.254,267.466 C551.07,267.909 551.226,268.419 551.625,268.683 L552.177,267.849 Z M585.112,300.84 L584.278,301.392 C584.542,301.791 585.052,301.947 585.495,301.764 L585.112,300.84 Z M620.665,286.102 L621.589,285.719 C621.488,285.474 621.293,285.28 621.048,285.178 C620.803,285.077 620.527,285.077 620.282,285.178 L620.665,286.102 Z M602.84,343.612 L638.383,328.89 L637.618,327.042 L602.075,341.764 L602.84,343.612 Z M603.454,389.496 C606.555,374.254 606.633,358.282 603.438,342.49 L601.477,342.886 C604.619,358.415 604.542,374.116 601.494,389.097 L603.454,389.496 Z M638.383,403.094 L602.857,388.373 L602.091,390.22 L637.617,404.942 L638.383,403.094 Z M621.589,446.27 L638.924,404.401 L637.076,403.635 L619.741,445.505 L621.589,446.27 Z M584.756,432.09 L620.283,446.812 L621.048,444.964 L585.522,430.242 L584.756,432.09 Z M552.708,464.957 C566.152,456.047 577.378,444.694 585.973,431.718 L584.306,430.614 C575.857,443.369 564.822,454.53 551.603,463.29 L552.708,464.957 Z M567.822,499.284 L553.079,463.741 L551.232,464.507 L565.975,500.051 L567.822,499.284 Z M525.407,517.922 L567.281,500.592 L566.516,498.744 L524.642,516.074 L525.407,517.922 Z M509.385,481.847 L524.101,517.38 L525.949,516.615 L511.233,481.082 L509.385,481.847 Z M463.493,482.467 C478.745,485.557 494.704,485.634 510.507,482.445 L510.111,480.484 C494.572,483.621 478.882,483.544 463.89,480.506 L463.493,482.467 Z M449.899,517.38 L464.615,481.869 L462.767,481.104 L448.052,516.615 L449.899,517.38 Z M406.736,500.592 L448.593,517.922 L449.358,516.074 L407.501,498.744 L406.736,500.592 Z M420.91,463.757 L406.195,499.285 L408.042,500.05 L422.758,464.523 L420.91,463.757 Z M388.055,431.702 C396.964,445.152 408.311,456.389 421.282,464.974 L422.386,463.306 C409.638,454.869 398.483,443.823 389.722,430.597 L388.055,431.702 Z M353.723,446.811 L389.272,432.073 L388.506,430.226 L352.957,444.964 L353.723,446.811 Z M335.076,404.401 L352.417,446.27 L354.264,445.505 L336.924,403.635 L335.076,404.401 Z M371.171,388.372 L335.618,403.094 L336.383,404.942 L371.936,390.22 L371.171,388.372 Z M370.541,342.489 C367.445,357.736 367.368,373.686 370.574,389.495 L372.534,389.098 C369.381,373.553 369.458,357.873 372.501,342.887 L370.541,342.489 Z M335.623,328.89 L371.138,343.612 L371.904,341.764 L336.389,327.042 L335.623,328.89 Z M352.417,285.719 L335.082,327.584 L336.93,328.349 L354.264,286.485 L352.417,285.719 Z M389.244,299.9 L353.723,285.178 L352.958,287.026 L388.478,301.747 L389.244,299.9 Z M421.287,267.054 C407.843,275.964 396.617,287.295 388.027,300.272 L389.695,301.376 C398.138,288.621 409.172,277.482 422.392,268.721 L421.287,267.054 Z M406.189,232.727 L420.916,268.271 L422.763,267.505 L408.037,231.961 L406.189,232.727 Z M448.587,214.074 L406.73,231.42 L407.496,233.268 L449.353,215.921 L448.587,214.074 Z M464.626,250.159 L449.894,214.615 L448.046,215.38 L462.778,250.924 L464.626,250.159 Z M510.524,249.545 C495.262,246.449 479.307,246.361 463.504,249.561 L463.901,251.522 C479.439,248.375 495.124,248.462 510.127,251.505 L510.524,249.545 Z M524.101,214.615 L509.402,250.143 L511.25,250.907 L525.949,215.38 L524.101,214.615 Z M567.281,231.42 L525.407,214.074 L524.642,215.921 L566.516,233.268 L567.281,231.42 Z M553.101,268.232 L567.822,232.727 L565.975,231.961 L551.254,267.466 L553.101,268.232 Z M585.945,300.288 C577.036,286.837 565.695,275.606 552.73,267.016 L551.625,268.683 C564.368,277.126 575.518,288.167 584.278,301.392 L585.945,300.288 Z M620.282,285.178 L584.729,299.916 L585.495,301.764 L621.048,287.026 L620.282,285.178 Z M638.924,327.584 L621.589,285.719 L619.741,286.485 L637.076,328.349 L638.924,327.584 Z M487.11,439.599 C527.694,439.599 560.593,406.698 560.593,366.113 L558.593,366.113 C558.593,405.593 526.589,437.599 487.11,437.599 L487.11,439.599 Z M413.626,366.113 C413.626,406.698 446.526,439.599 487.11,439.599 L487.11,437.599 C447.631,437.599 415.626,405.593 415.626,366.113 L413.626,366.113 Z M487.11,292.626 C446.526,292.626 413.626,325.527 413.626,366.113 L415.626,366.113 C415.626,326.632 447.631,294.626 487.11,294.626 L487.11,292.626 Z M560.593,366.113 C560.593,325.527 527.694,292.626 487.11,292.626 L487.11,294.626 C526.589,294.626 558.593,326.632 558.593,366.113 L560.593,366.113 Z"></path>
<path id="svg-key_path-5" d="M323.925007,155.751 L323.542,154.827 C323.101,155.01 322.85,155.48 322.945,155.949 L323.925007,155.751 Z M367,137.909 L367.383,138.833 C367.893,138.622 368.135,138.037 367.924,137.527 L367,137.909 Z M323.945,212.237 L322.965,212.037 C322.87,212.506 323.12,212.977 323.562,213.161 L323.945,212.237 Z M367,230.078 L367.924,230.461 C368.135,229.951 367.893,229.366 367.383,229.154 L367,230.078 Z M345.992,280.821 L345.609,281.745 C345.854,281.846 346.129,281.846 346.374,281.745 C346.619,281.643 346.814,281.449 346.916,281.204 L345.992,280.821 Z M302.937,262.98 L303.32,262.056 C302.877,261.872 302.367,262.028 302.103,262.427 L302.937,262.98 Z M262.963,302.922 L262.41,302.088 C262.011,302.352 261.856,302.863 262.039,303.305 L262.963,302.922 Z M280.83,345.998 L281.213,346.922 C281.458,346.821 281.653,346.626 281.754,346.381 C281.856,346.135 281.856,345.86 281.754,345.615 L280.83,345.998 Z M230.083,367 L229.159,367.383 C229.37,367.893 229.955,368.136 230.465,367.924 L230.083,367 Z M212.249,323.937 L213.172,323.555 C212.989,323.113 212.519,322.863 212.051,322.957 L212.249,323.937 Z M155.751,323.964 L155.95,322.984 C155.481,322.889 155.011,323.139 154.828,323.581 L155.751,323.964 Z M137.917,367 L137.535,367.924 C138.045,368.136 138.63,367.893 138.841,367.383 L137.917,367 Z M87.1897,345.998 L86.2658,345.615 C86.1643,345.86 86.1643,346.136 86.2658,346.381 C86.3673,346.626 86.5621,346.82 86.8071,346.922 L87.1897,345.998 Z M105.024,302.942 L105.948,303.324 C106.131,302.882 105.975,302.372 105.576,302.108 L105.024,302.942 Z M65.0966,262.96 L65.9303,262.407 C65.6659,262.008 65.1558,261.852 64.7136,262.036 L65.0966,262.96 Z M22.0151,280.821 L21.0912,281.204 C21.1927,281.449 21.3874,281.643 21.6325,281.745 C21.8776,281.846 22.153,281.846 22.398,281.745 L22.0151,280.821 Z M0.999999997,230.078 L0.617431,229.154 C0.372379,229.256 0.177675,229.45 0.0761546,229.695 C-0.0253657,229.941 -0.0253856,230.216 0.0760993,230.461 L0.999999997,230.078 Z M44.0882,212.237 L44.4708,213.161 C44.9129,212.978 45.1633,212.507 45.0682,212.038 L44.0882,212.237 Z M44.0483,155.751 L45.0283,155.95 C45.1235,155.481 44.8732,155.01 44.4312,154.827 L44.0483,155.751 Z M1.00666,137.909 L0.0827315,137.527 C-0.1285,138.037 0.113682,138.622 0.623734,138.833 L1.00666,137.909 Z M22.0151,87.1733 L22.3979,86.2495 C22.1529,86.148 21.8775,86.1479 21.6324,86.2494 C21.3873,86.351 21.1926,86.5457 21.0911,86.7908 L22.0151,87.1733 Z M65.0633,105.015 L64.6804,105.939 C65.1227,106.122 65.6329,105.966 65.8972,105.567 L65.0633,105.015 Z M105.031,65.0994 L105.583,65.933 C105.982,65.6686 106.138,65.1587 105.954,64.7166 L105.031,65.0994 Z M87.183,22.023 L86.8002,21.0992 C86.29,21.3106 86.0478,21.8955 86.2592,22.4057 L87.183,22.023 Z M137.911,1.00049 L138.834,0.617598 C138.623,0.107418 138.038,-0.134757 137.528,0.0766758 L137.911,1.00049 Z M155.765,44.0769 L154.841,44.4598 C155.024,44.9017 155.494,45.152 155.963,45.057 L155.765,44.0769 Z M212.269,44.057 L212.07,45.037 C212.539,45.1322 213.01,44.8816 213.193,44.4393 L212.269,44.057 Z M230.083,1.00048827 L230.465,0.0766226 C230.22,-0.0249094 229.945,-0.0248891 229.7,0.0766791 C229.455,0.178247 229.26,0.373039 229.159,0.618178 L230.083,1.00048827 Z M280.83,22.023 L281.754,22.406 C281.856,22.1609 281.856,21.8856 281.754,21.6405 C281.653,21.3954 281.458,21.2006 281.213,21.0991 L280.83,22.023 Z M262.989,65.0528 L262.066,64.6698 C261.882,65.112 262.038,65.6221 262.437,65.8864 L262.989,65.0528 Z M302.903,105.035 L302.07,105.587 C302.334,105.986 302.844,106.142 303.286,105.959 L302.903,105.035 Z M345.992,87.1733 L346.915,86.7908 C346.814,86.5457 346.619,86.3509 346.374,86.2494 C346.129,86.1479 345.854,86.148 345.609,86.2496 L345.992,87.1733 Z M324.308,156.675 L367.383,138.833 L366.617,136.986 L323.542,154.827 L324.308,156.675 Z M324.925,212.436 C328.678,193.992 328.772,174.664 324.905,155.553 L322.945,155.949 C326.758,174.797 326.665,193.854 322.965,212.037 L324.925,212.436 Z M367.383,229.154 L324.328,211.313 L323.562,213.161 L366.617,231.002 L367.383,229.154 Z M346.916,281.204 L367.924,230.461 L366.076,229.696 L345.068,280.438 L346.916,281.204 Z M302.554,263.903 L345.609,281.745 L346.374,279.897 L303.32,262.056 L302.554,263.903 Z M263.515,303.755 C279.785,292.973 293.369,279.234 303.77,263.532 L302.103,262.427 C291.848,277.909 278.455,291.455 262.41,302.088 L263.515,303.755 Z M281.754,345.615 L263.887,302.538 L262.039,303.305 L279.907,346.381 L281.754,345.615 Z M230.465,367.924 L281.213,346.922 L280.448,345.074 L229.7,366.077 L230.465,367.924 Z M211.325,324.32 L229.159,367.383 L231.007,366.618 L213.172,323.555 L211.325,324.32 Z M155.553,324.944 C174.01,328.684 193.323,328.777 212.446,324.918 L212.051,322.957 C193.19,326.764 174.147,326.671 155.95,322.984 L155.553,324.944 Z M138.841,367.383 L156.675,324.347 L154.828,323.581 L136.993,366.618 L138.841,367.383 Z M86.8071,346.922 L137.535,367.924 L138.3,366.077 L87.5722,345.074 L86.8071,346.922 Z M104.1,302.559 L86.2658,345.615 L88.1135,346.381 L105.948,303.324 L104.1,302.559 Z M64.2629,263.512 C75.0445,279.789 88.7757,293.387 104.472,303.775 L105.576,302.108 C90.1021,291.866 76.563,278.459 65.9303,262.407 L64.2629,263.512 Z M22.398,281.745 L65.4796,263.883 L64.7136,262.036 L21.6321,279.897 L22.398,281.745 Z M0.0760993,230.461 L21.0912,281.204 L22.939,280.438 L1.9239,229.696 L0.0760993,230.461 Z M43.7056,211.313 L0.617431,229.154 L1.38257,231.002 L44.4708,213.161 L43.7056,211.313 Z M43.0682,155.552 C39.3219,174.003 39.2284,193.304 43.1081,212.436 L45.0682,212.038 C41.242,193.171 41.3349,174.14 45.0283,155.95 L43.0682,155.552 Z M0.623734,138.833 L43.6653,156.675 L44.4312,154.827 L1.38958,136.986 L0.623734,138.833 Z M21.0911,86.7908 L0.0827315,137.527 L1.93058,138.292 L22.939,87.5559 L21.0911,86.7908 Z M65.4462,104.091 L22.3979,86.2495 L21.6322,88.0971 L64.6804,105.939 L65.4462,104.091 Z M104.478,64.2658 C88.2086,75.0478 74.6243,88.7594 64.2295,104.463 L65.8972,105.567 C76.1447,90.0859 89.5379,76.5661 105.583,65.933 L104.478,64.2658 Z M86.2592,22.4057 L104.107,65.4822 L105.954,64.7166 L88.1069,21.6402 L86.2592,22.4057 Z M137.528,0.0766758 L86.8002,21.0992 L87.5659,22.9468 L138.293,1.9243 L137.528,0.0766758 Z M156.689,43.694 L138.834,0.617598 L136.987,1.38338 L154.841,44.4598 L156.689,43.694 Z M212.467,43.0769 C193.998,39.3306 174.691,39.2235 155.566,43.0968 L155.963,45.057 C174.823,41.2374 193.86,41.3433 212.07,45.037 L212.467,43.0769 Z M229.159,0.618178 L211.344,43.6747 L213.193,44.4393 L231.007,1.3828 L229.159,0.618178 Z M281.213,21.0991 L230.465,0.0766226 L229.7,1.92435 L280.448,22.9468 L281.213,21.0991 Z M263.913,65.4358 L281.754,22.406 L279.907,21.64 L262.066,64.6698 L263.913,65.4358 Z M303.737,104.483 C292.955,88.2056 279.231,74.6143 263.542,64.2192 L262.437,65.8864 C277.904,76.1345 291.437,89.535 302.07,105.587 L303.737,104.483 Z M345.609,86.2496 L302.52,104.111 L303.286,105.959 L346.375,88.0971 L345.609,86.2496 Z M367.924,137.527 L346.915,86.7908 L345.068,87.5559 L366.076,138.292 L367.924,137.527 Z M184.079,274.013 C234.379,274.013 275.166,233.497 275.166,183.505 L273.166,183.505 C273.166,232.381 233.286,272.013 184.079,272.013 L184.079,274.013 Z M92.9926,183.505 C92.9926,233.497 133.78,274.013 184.079,274.013 L184.079,272.013 C134.872,272.013 94.9926,232.381 94.9926,183.505 L92.9926,183.505 Z M184.079,92.9961 C133.78,92.9961 92.9926,133.512 92.9926,183.505 L94.9926,183.505 C94.9926,134.629 134.872,94.9961 184.079,94.9961 L184.079,92.9961 Z M275.166,183.505 C275.166,133.512 234.379,92.9961 184.079,92.9961 L184.079,94.9961 C233.286,94.9961 273.166,134.629 273.166,183.505 L275.166,183.505 Z"></path>
</defs>
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g transform="translate(-149.000000, -155.000000)">
<g transform="translate(164.000000, 170.000000)">
<g class="svg-key__opt svg-key__opt--right">
<use fill="black" fill-opacity="1" filter="url(#svg-key_filter-2)" href="#svg-key_path-1"></use>
<use fill="#FFFFFF" fill-rule="evenodd" href="#svg-key_path-1"></use>
</g>
<g class="svg-key__opt svg-key__opt--left" fill-rule="nonzero">
<use fill="black" fill-opacity="1" filter="url(#svg-key_filter-4)" href="#svg-key_path-3"></use>
<use fill="#42962B" href="#svg-key_path-3"></use>
</g>
<g class="svg-key__opt svg-key__opt--right" fill-rule="nonzero">
<use fill="black" fill-opacity="1" filter="url(#svg-key_filter-6)" href="#svg-key_path-5"></use>
<use fill="#42962B" href="#svg-key_path-5"></use>
</g>
</g>
</g>
</g>
</svg>
body {
background-color: #0B1023;
}
.svg-key {
overflow: visible;
&__opt {
transform-origin: center;
transform-box: fill-box;
&--right {
animation: optRight 10s infinite linear;
}
&--left {
animation: optLeft 10s infinite linear;
}
}
}
@keyframes optRight {
0% {
transform: rotate(0);
}
100% {
transform: rotate(360deg);
}
}
@keyframes optLeft {
0% {
transform: rotate(0);
}
100% {
transform: rotate(-360deg);
}
}
View Compiled
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.