cssAudio - Activefile-genericCSS - ActiveGeneric - ActiveHTML - ActiveImage - ActiveJS - ActiveSVG - ActiveText - Activefile-genericVideo - Activehtmlicon-personicon-teamoctocatpop-outspinnerstartv

Pen Settings

CSS Base

Vendor Prefixing

Add External CSS

These stylesheets will be added in this order and before the code you write in the CSS editor. You can also add another Pen here, and it will pull the CSS from it. Try typing "font" or "ribbon" below.

Quick-add: + add another resource

Add External JavaScript

These scripts will run in this order and before the code in the JavaScript editor. You can also link to another Pen here, and it will run the JavaScript from it. Also try typing the name of any popular library.

Quick-add: + add another resource

Code Indentation

     

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

            
              <?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
              "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">

<svg xmlns="http://www.w3.org/2000/svg"
     width="17.7639in" height="6.94444in"
     viewBox="0 0 1279 500">
  <path id="case"
        fill="none"
        d="M 43.00,233.00
           C 43.00,233.00 43.00,192.00 43.00,192.00
             43.00,189.42 42.76,185.61 44.17,183.39
             45.71,180.98 55.12,176.29 58.00,175.49
             58.00,175.49 67.00,174.28 67.00,174.28
             67.00,174.28 149.00,164.13 149.00,164.13
             149.00,164.13 173.00,161.83 173.00,161.83
             173.00,161.83 197.00,158.28 197.00,158.28
             197.00,158.28 214.00,156.72 214.00,156.72
             214.00,156.72 238.00,153.28 238.00,153.28
             238.00,153.28 262.00,150.84 262.00,150.84
             262.00,150.84 287.00,147.28 287.00,147.28
             287.00,147.28 311.00,144.84 311.00,144.84
             311.00,144.84 345.00,140.28 345.00,140.28
             345.00,140.28 403.00,133.71 403.00,133.71
             403.00,133.71 419.00,131.28 419.00,131.28
             419.00,131.28 534.00,117.28 534.00,117.28
             534.00,117.28 542.00,116.71 542.00,116.71
             542.00,116.71 574.00,112.28 574.00,112.28
             574.00,112.28 599.00,109.72 599.00,109.72
             599.00,109.72 624.00,106.16 624.00,106.16
             624.00,106.16 648.00,103.72 648.00,103.72
             648.00,103.72 672.00,100.16 672.00,100.16
             672.00,100.16 689.00,98.72 689.00,98.72
             689.00,98.72 714.00,95.16 714.00,95.16
             714.00,95.16 731.00,93.71 731.00,93.71
             731.00,93.71 762.00,89.28 762.00,89.28
             762.00,89.28 779.00,87.72 779.00,87.72
             779.00,87.72 802.00,84.28 802.00,84.28
             802.00,84.28 826.00,81.84 826.00,81.84
             831.07,81.29 839.26,79.74 844.00,80.09
             844.00,80.09 873.00,87.12 873.00,87.12
             873.00,87.12 885.00,89.74 885.00,89.74
             885.00,89.74 922.00,99.12 922.00,99.12
             922.00,99.12 1008.00,120.53 1008.00,120.53
             1008.00,120.53 1081.00,138.52 1081.00,138.52
             1081.00,138.52 1141.00,153.04 1141.00,153.04
             1141.00,153.04 1152.00,156.26 1152.00,156.26
             1152.00,156.26 1198.00,167.53 1198.00,167.53
             1198.00,167.53 1209.00,169.89 1209.00,169.89
             1209.00,169.89 1220.00,173.11 1220.00,173.11
             1222.55,173.75 1227.44,174.38 1229.37,175.90
             1234.20,179.72 1234.99,187.38 1235.00,193.00
             1235.00,193.00 1235.00,231.00 1235.00,231.00
             1235.00,231.00 1236.00,248.00 1236.00,248.00
             1236.00,248.00 1236.00,332.00 1236.00,332.00
             1236.00,332.00 1237.00,347.00 1237.00,347.00
             1237.00,347.00 1237.00,382.00 1237.00,382.00
             1236.93,386.73 1235.55,393.16 1231.61,396.26
             1228.62,398.62 1222.72,397.96 1219.00,398.00
             1219.00,398.00 1209.00,398.91 1209.00,398.91
             1209.00,398.91 1172.00,401.96 1172.00,401.96
             1172.00,401.96 1163.00,401.96 1163.00,401.96
             1163.00,401.96 1130.00,404.09 1130.00,404.09
             1130.00,404.09 1061.00,409.00 1061.00,409.00
             1061.00,409.00 1041.00,410.83 1041.00,410.83
             1041.00,410.83 999.00,414.00 999.00,414.00
             999.00,414.00 982.00,415.00 982.00,415.00
             982.00,415.00 957.00,416.83 957.00,416.83
             957.00,416.83 923.00,419.09 923.00,419.09
             923.00,419.09 882.00,421.00 882.00,421.00
             882.00,421.00 867.00,420.00 867.00,420.00
             867.00,420.00 837.00,420.00 837.00,420.00
             837.00,420.00 825.00,419.04 825.00,419.04
             825.00,419.04 808.00,419.04 808.00,419.04
             808.00,419.04 791.00,418.00 791.00,418.00
             791.00,418.00 728.00,416.00 728.00,416.00
             728.00,416.00 711.00,415.00 711.00,415.00
             711.00,415.00 686.00,415.00 686.00,415.00
             686.00,415.00 671.00,414.00 671.00,414.00
             671.00,414.00 650.00,414.00 650.00,414.00
             650.00,414.00 635.00,413.00 635.00,413.00
             635.00,413.00 622.00,413.00 622.00,413.00
             622.00,413.00 606.00,412.00 606.00,412.00
             606.00,412.00 570.00,411.00 570.00,411.00
             570.00,411.00 556.00,409.96 556.00,409.96
             556.00,409.96 541.00,409.96 541.00,409.96
             541.00,409.96 529.00,409.00 529.00,409.00
             529.00,409.00 499.00,409.00 499.00,409.00
             499.00,409.00 484.00,408.00 484.00,408.00
             484.00,408.00 468.00,408.00 468.00,408.00
             468.00,408.00 456.00,407.04 456.00,407.04
             456.00,407.04 442.00,407.04 442.00,407.04
             442.00,407.04 427.00,406.00 427.00,406.00
             427.00,406.00 413.00,406.00 413.00,406.00
             413.00,406.00 397.00,405.00 397.00,405.00
             397.00,405.00 363.00,404.00 363.00,404.00
             363.00,404.00 346.00,403.00 346.00,403.00
             346.00,403.00 317.00,403.00 317.00,403.00
             317.00,403.00 305.00,402.04 305.00,402.04
             305.00,402.04 288.00,402.04 288.00,402.04
             288.00,402.04 271.00,400.96 271.00,400.96
             271.00,400.96 259.00,400.96 259.00,400.96
             259.00,400.96 249.00,400.00 249.00,400.00
             249.00,400.00 234.00,400.00 234.00,400.00
             234.00,400.00 221.00,399.00 221.00,399.00
             221.00,399.00 208.00,399.00 208.00,399.00
             208.00,399.00 193.00,398.00 193.00,398.00
             193.00,398.00 164.00,398.00 164.00,398.00
             164.00,398.00 149.00,397.00 149.00,397.00
             149.00,397.00 135.00,397.00 135.00,397.00
             135.00,397.00 118.00,396.00 118.00,396.00
             107.58,395.98 105.48,392.37 97.00,387.17
             97.00,387.17 63.00,365.84 63.00,365.84
             57.52,362.24 43.77,355.82 41.60,350.00
             40.89,348.09 41.00,345.07 41.00,343.00
             41.00,343.00 41.00,327.00 41.00,327.00
             41.00,327.00 42.00,311.00 42.00,311.00
             42.01,305.86 41.31,287.62 42.93,284.02
             44.17,281.27 45.51,280.38 48.00,279.00
             44.84,274.58 44.84,260.42 48.00,256.00
             39.03,250.07 42.89,241.75 43.00,233.00 Z
           M 42.00,182.00
           C 42.00,182.00 41.00,183.00 41.00,183.00
             41.00,183.00 41.00,182.00 41.00,182.00
             41.00,182.00 42.00,182.00 42.00,182.00 Z
           M 42.00,354.00
           C 42.00,354.00 41.00,355.00 41.00,355.00
             41.00,355.00 41.00,354.00 41.00,354.00
             41.00,354.00 42.00,354.00 42.00,354.00 Z" />
               <path id="cooler"
        fill="none"
        d="M 856.00,245.00
           C 855.51,250.81 850.11,269.42 847.00,274.00
             847.00,274.00 847.00,245.00 847.00,245.00
             847.00,245.00 856.00,245.00 856.00,245.00 Z
           M 847.00,293.00
           C 847.05,283.64 850.96,274.74 854.00,266.00
             854.00,266.00 858.93,252.00 858.93,252.00
             859.66,249.98 860.16,247.58 862.30,246.80
             864.55,245.57 869.48,246.67 872.00,246.80
             872.00,246.80 864.02,274.00 864.02,274.00
             864.02,274.00 855.72,302.00 855.72,302.00
             855.72,302.00 847.00,328.00 847.00,328.00
             847.00,328.00 847.00,293.00 847.00,293.00 Z
           M 849.57,334.00
           C 849.57,334.00 855.14,315.00 855.14,315.00
             855.14,315.00 868.14,272.00 868.14,272.00
             869.65,267.61 873.34,251.96 875.27,249.33
             877.38,246.47 883.57,247.97 887.00,248.00
             887.00,248.00 877.34,281.00 877.34,281.00
             877.34,281.00 869.98,306.00 869.98,306.00
             869.98,306.00 858.00,346.00 858.00,346.00
             853.85,343.74 848.96,339.16 849.57,334.00 Z
           M 901.00,249.00
           C 901.00,249.00 892.04,281.00 892.04,281.00
             892.04,281.00 878.28,329.00 878.28,329.00
             878.28,329.00 870.00,358.00 870.00,358.00
             859.72,354.33 860.91,348.41 863.41,340.00
             863.41,340.00 866.58,329.00 866.58,329.00
             866.58,329.00 890.00,249.00 890.00,249.00
             890.00,249.00 901.00,249.00 901.00,249.00 Z
           M 872.64,362.00
           C 871.44,358.25 876.27,344.30 877.67,340.00
             877.67,340.00 897.51,274.00 897.51,274.00
             897.51,274.00 902.63,257.00 902.63,257.00
             903.26,254.66 903.79,251.69 906.28,250.81
             908.30,249.74 913.55,250.80 916.00,250.81
             916.00,250.81 892.43,332.00 892.43,332.00
             892.43,332.00 881.00,371.00 881.00,371.00
             877.95,368.81 873.83,365.72 872.64,362.00 Z
           M 884.69,375.00
           C 883.68,371.49 888.76,356.30 890.00,352.00
             890.00,352.00 911.63,278.00 911.63,278.00
             911.63,278.00 916.86,260.00 916.86,260.00
             917.50,257.76 918.43,253.37 920.51,252.06
             922.14,251.12 926.90,251.91 929.00,252.06
             929.00,252.06 915.42,302.00 915.42,302.00
             915.42,302.00 892.00,383.00 892.00,383.00
             889.21,380.99 885.70,378.49 884.69,375.00 Z
           M 905.97,347.00
           C 905.97,347.00 924.14,283.00 924.14,283.00
             924.14,283.00 930.02,262.00 930.02,262.00
             930.67,259.90 931.90,255.07 933.56,253.88
             935.89,251.93 940.46,253.26 943.00,253.88
             943.00,253.88 934.43,285.00 934.43,285.00
             934.43,285.00 922.57,328.00 922.57,328.00
             922.57,328.00 914.37,357.00 914.37,357.00
             914.37,357.00 908.63,378.00 908.63,378.00
             908.63,378.00 904.58,386.98 904.58,386.98
             904.58,386.98 895.00,388.00 895.00,388.00
             895.00,388.00 905.97,347.00 905.97,347.00 Z
           M 957.00,255.00
           C 957.00,255.00 942.58,307.00 942.58,307.00
             942.58,307.00 928.88,355.00 928.88,355.00
             928.88,355.00 922.85,377.00 922.85,377.00
             922.85,377.00 919.28,386.01 919.28,386.01
             919.28,386.01 909.00,387.00 909.00,387.00
             909.00,387.00 916.26,360.00 916.26,360.00
             916.26,360.00 926.09,325.00 926.09,325.00
             926.09,325.00 934.43,294.00 934.43,294.00
             934.43,294.00 945.00,254.00 945.00,254.00
             945.00,254.00 957.00,255.00 957.00,255.00 Z
           M 969.00,256.00
           C 969.00,256.00 960.88,286.00 960.88,286.00
             960.88,286.00 941.71,356.00 941.71,356.00
             941.71,356.00 935.86,377.00 935.86,377.00
             935.86,377.00 932.30,385.01 932.30,385.01
             932.30,385.01 923.00,386.00 923.00,386.00
             923.00,386.00 929.85,361.00 929.85,361.00
             929.85,361.00 947.97,297.00 947.97,297.00
             947.97,297.00 960.00,255.00 960.00,255.00
             960.00,255.00 969.00,256.00 969.00,256.00 Z
           M 947.97,346.00
           C 947.97,346.00 964.12,286.00 964.12,286.00
             964.12,286.00 969.53,266.00 969.53,266.00
             969.53,266.00 972.56,258.02 972.56,258.02
             972.56,258.02 981.00,257.00 981.00,257.00
             981.00,257.00 971.73,293.00 971.73,293.00
             971.73,293.00 954.89,356.00 954.89,356.00
             954.89,356.00 949.89,375.00 949.89,375.00
             949.89,375.00 946.49,384.40 946.49,384.40
             946.49,384.40 938.00,386.00 938.00,386.00
             938.00,386.00 947.97,346.00 947.97,346.00 Z
           M 993.00,258.00
           C 993.00,258.00 983.42,296.00 983.42,296.00
             983.42,296.00 967.01,356.00 967.01,356.00
             967.01,356.00 961.34,377.00 961.34,377.00
             961.34,377.00 958.42,383.98 958.42,383.98
             958.42,383.98 951.00,385.00 951.00,385.00
             951.00,385.00 958.63,355.00 958.63,355.00
             958.63,355.00 977.47,283.00 977.47,283.00
             977.47,283.00 984.00,258.00 984.00,258.00
             984.00,258.00 993.00,258.00 993.00,258.00 Z
           M 970.11,357.00
           C 970.11,357.00 989.12,287.00 989.12,287.00
             989.12,287.00 994.20,268.00 994.20,268.00
             994.20,268.00 997.51,260.01 997.51,260.01
             997.51,260.01 1005.00,260.01 1005.00,260.01
             1005.00,260.01 997.58,288.00 997.58,288.00
             997.58,288.00 979.63,356.00 979.63,356.00
             979.63,356.00 974.52,376.00 974.52,376.00
             974.52,376.00 970.58,383.98 970.58,383.98
             970.58,383.98 963.00,385.00 963.00,385.00
             963.00,385.00 970.11,357.00 970.11,357.00 Z
           M 984.85,348.00
           C 984.85,348.00 1000.65,287.00 1000.65,287.00
             1000.65,287.00 1005.63,269.00 1005.63,269.00
             1005.63,269.00 1008.72,261.00 1008.72,261.00
             1008.72,261.00 1016.00,261.00 1016.00,261.00
             1016.00,261.00 991.87,355.00 991.87,355.00
             991.87,355.00 986.71,375.00 986.71,375.00
             986.71,375.00 983.44,382.98 983.44,382.98
             983.44,382.98 976.00,384.00 976.00,384.00
             976.00,384.00 984.85,348.00 984.85,348.00 Z
           M 1028.00,262.00
           C 1028.00,262.00 1003.29,356.00 1003.29,356.00
             1003.29,356.00 998.42,375.00 998.42,375.00
             998.42,375.00 995.28,383.01 995.28,383.01
             995.28,383.01 988.00,384.00 988.00,384.00
             988.00,384.00 992.15,367.00 992.15,367.00
             992.15,367.00 1006.89,309.00 1006.89,309.00
             1006.89,309.00 1019.00,261.00 1019.00,261.00
             1019.00,261.00 1028.00,262.00 1028.00,262.00 Z
           M 1036.89,263.60
           C 1036.89,263.60 1036.37,271.00 1036.37,271.00
             1036.37,271.00 1032.13,288.00 1032.13,288.00
             1032.13,288.00 1013.88,360.00 1013.88,360.00
             1013.88,360.00 1010.21,375.00 1010.21,375.00
             1010.21,375.00 1007.30,382.01 1007.30,382.01
             1007.30,382.01 1000.00,383.00 1000.00,383.00
             1000.00,383.00 1005.77,360.00 1005.77,360.00
             1005.77,360.00 1016.10,319.00 1016.10,319.00
             1016.10,319.00 1017.75,311.00 1017.75,311.00
             1017.75,311.00 1030.00,262.00 1030.00,262.00
             1030.00,262.00 1036.89,263.60 1036.89,263.60 Z
           M 1021.12,344.00
           C 1021.12,344.00 1034.42,289.00 1034.42,289.00
             1034.42,289.00 1040.26,266.13 1040.26,266.13
             1041.53,263.24 1044.89,262.12 1047.53,264.18
             1049.55,265.92 1048.15,269.75 1047.53,272.00
             1047.53,272.00 1042.27,294.00 1042.27,294.00
             1042.27,294.00 1028.53,349.00 1028.53,349.00
             1028.53,349.00 1020.00,383.00 1020.00,383.00
             1020.00,383.00 1012.00,383.00 1012.00,383.00
             1012.00,383.00 1021.12,344.00 1021.12,344.00 Z
           M 1060.00,265.00
           C 1060.00,265.00 1041.77,338.00 1041.77,338.00
             1041.77,338.00 1031.00,382.00 1031.00,382.00
             1031.00,382.00 1023.00,383.00 1023.00,383.00
             1023.00,383.00 1032.12,344.00 1032.12,344.00
             1032.12,344.00 1044.37,295.00 1044.37,295.00
             1044.37,295.00 1052.00,264.00 1052.00,264.00
             1052.00,264.00 1060.00,265.00 1060.00,265.00 Z
           M 1041.13,351.00
           C 1041.13,351.00 1056.12,291.00 1056.12,291.00
             1056.12,291.00 1060.58,273.00 1060.58,273.00
             1060.58,273.00 1063.56,266.01 1063.56,266.01
             1063.56,266.01 1070.00,266.01 1070.00,266.01
             1070.00,266.01 1064.47,289.00 1064.47,289.00
             1064.47,289.00 1050.53,346.00 1050.53,346.00
             1050.53,346.00 1042.00,382.00 1042.00,382.00
             1042.00,382.00 1034.00,382.00 1034.00,382.00
             1034.00,382.00 1041.13,351.00 1041.13,351.00 Z
           M 1080.00,267.00
           C 1080.00,267.00 1070.47,305.00 1070.47,305.00
             1070.47,305.00 1058.37,355.00 1058.37,355.00
             1058.37,355.00 1054.00,373.00 1054.00,373.00
             1054.00,373.00 1051.27,380.40 1051.27,380.40
             1051.27,380.40 1045.00,382.00 1045.00,382.00
             1045.00,382.00 1052.63,348.00 1052.63,348.00
             1052.63,348.00 1064.65,297.00 1064.65,297.00
             1064.65,297.00 1072.00,266.00 1072.00,266.00
             1072.00,266.00 1080.00,267.00 1080.00,267.00 Z
           M 1089.00,267.00
           C 1089.00,267.00 1080.89,303.00 1080.89,303.00
             1080.89,303.00 1068.50,357.00 1068.50,357.00
             1068.50,357.00 1063.00,381.00 1063.00,381.00
             1063.00,381.00 1055.00,382.00 1055.00,382.00
             1055.00,382.00 1063.12,346.00 1063.12,346.00
             1063.12,346.00 1082.00,267.00 1082.00,267.00
             1082.00,267.00 1089.00,267.00 1089.00,267.00 Z
           M 1099.00,268.00
           C 1099.00,268.00 1091.89,300.00 1091.89,300.00
             1091.89,300.00 1078.99,355.00 1078.99,355.00
             1078.99,355.00 1074.58,373.00 1074.58,373.00
             1074.58,373.00 1071.49,379.98 1071.49,379.98
             1071.49,379.98 1065.00,381.00 1065.00,381.00
             1065.00,381.00 1073.50,345.00 1073.50,345.00
             1073.50,345.00 1081.37,310.00 1081.37,310.00
             1081.37,310.00 1091.00,268.00 1091.00,268.00
             1091.00,268.00 1099.00,268.00 1099.00,268.00 Z
           M 1095.79,294.00
           C 1095.79,294.00 1100.00,276.00 1100.00,276.00
             1100.00,276.00 1102.58,270.02 1102.58,270.02
             1102.58,270.02 1108.00,270.02 1108.00,270.02
             1108.00,270.02 1088.23,354.00 1088.23,354.00
             1088.23,354.00 1084.00,372.00 1084.00,372.00
             1084.00,372.00 1081.27,379.01 1081.27,379.01
             1081.27,379.01 1076.00,380.00 1076.00,380.00
             1076.00,380.00 1095.79,294.00 1095.79,294.00 Z
           M 1116.00,270.00
           C 1116.00,270.00 1109.66,300.00 1109.66,300.00
             1109.66,300.00 1097.42,355.00 1097.42,355.00
             1097.42,355.00 1093.65,372.00 1093.65,372.00
             1093.65,372.00 1090.57,378.98 1090.57,378.98
             1090.57,378.98 1085.00,378.98 1085.00,378.98
             1085.00,378.98 1096.88,330.00 1096.88,330.00
             1096.88,330.00 1111.00,270.00 1111.00,270.00
             1111.00,270.00 1116.00,270.00 1116.00,270.00 Z
           M 1126.00,272.00
           C 1126.00,272.00 1122.01,288.00 1122.01,288.00
             1122.01,288.00 1113.11,329.00 1113.11,329.00
             1113.11,329.00 1102.00,379.00 1102.00,379.00
             1102.00,379.00 1096.00,379.00 1096.00,379.00
             1096.00,379.00 1100.80,355.00 1100.80,355.00
             1100.80,355.00 1112.42,302.00 1112.42,302.00
             1112.42,302.00 1119.00,271.00 1119.00,271.00
             1119.00,271.00 1126.00,272.00 1126.00,272.00 Z
           M 1134.00,272.00
           C 1134.00,272.00 1121.89,327.00 1121.89,327.00
             1121.89,327.00 1116.12,354.00 1116.12,354.00
             1116.12,354.00 1112.27,371.00 1112.27,371.00
             1112.27,371.00 1109.42,377.98 1109.42,377.98
             1109.42,377.98 1104.00,379.00 1104.00,379.00
             1104.00,379.00 1111.89,344.00 1111.89,344.00
             1111.89,344.00 1128.00,272.00 1128.00,272.00
             1128.00,272.00 1134.00,272.00 1134.00,272.00 Z
           M 1123.42,331.00
           C 1123.42,331.00 1131.08,297.00 1131.08,297.00
             1131.08,297.00 1134.88,280.00 1134.88,280.00
             1134.88,280.00 1137.72,272.99 1137.72,272.99
             1137.72,272.99 1143.00,272.00 1143.00,272.00
             1143.00,272.00 1135.42,308.00 1135.42,308.00
             1135.42,308.00 1120.00,379.00 1120.00,379.00
             1120.00,379.00 1113.00,378.00 1113.00,378.00
             1113.00,378.00 1123.42,331.00 1123.42,331.00 Z
           M 1130.35,343.00
           C 1130.35,343.00 1140.37,297.00 1140.37,297.00
             1140.37,297.00 1145.98,274.60 1145.98,274.60
             1145.98,274.60 1151.00,273.00 1151.00,273.00
             1151.00,273.00 1145.42,300.00 1145.42,300.00
             1145.42,300.00 1133.65,354.00 1133.65,354.00
             1133.65,354.00 1130.42,369.00 1130.42,369.00
             1130.42,369.00 1128.07,376.40 1128.07,376.40
             1128.07,376.40 1123.00,378.00 1123.00,378.00
             1123.00,378.00 1130.35,343.00 1130.35,343.00 Z
           M 1159.00,274.00
           C 1159.00,274.00 1154.40,299.00 1154.40,299.00
             1154.40,299.00 1142.74,354.00 1142.74,354.00
             1142.74,354.00 1138.87,371.00 1138.87,371.00
             1138.87,371.00 1136.28,377.01 1136.28,377.01
             1136.28,377.01 1131.00,378.00 1131.00,378.00
             1131.00,378.00 1138.77,342.00 1138.77,342.00
             1138.77,342.00 1148.45,296.00 1148.45,296.00
             1148.45,296.00 1153.00,274.00 1153.00,274.00
             1153.00,274.00 1159.00,274.00 1159.00,274.00 Z
           M 1146.58,346.00
           C 1146.58,346.00 1156.37,299.00 1156.37,299.00
             1156.37,299.00 1159.60,284.00 1159.60,284.00
             1159.60,284.00 1161.93,276.60 1161.93,276.60
             1161.93,276.60 1167.00,275.00 1167.00,275.00
             1167.00,275.00 1150.63,354.00 1150.63,354.00
             1150.63,354.00 1145.15,376.40 1145.15,376.40
             1145.15,376.40 1140.00,378.00 1140.00,378.00
             1140.00,378.00 1146.58,346.00 1146.58,346.00 Z
           M 1175.00,276.00
           C 1175.00,276.00 1167.39,314.00 1167.39,314.00
             1167.39,314.00 1160.45,347.00 1160.45,347.00
             1158.70,355.72 1156.67,370.44 1153.00,378.00
             1153.00,378.00 1149.00,378.00 1149.00,378.00
             1149.00,378.00 1148.00,377.00 1148.00,377.00
             1148.00,377.00 1161.42,312.00 1161.42,312.00
             1161.42,312.00 1169.00,275.00 1169.00,275.00
             1169.00,275.00 1175.00,276.00 1175.00,276.00 Z
           M 1182.22,278.31
           C 1182.76,279.93 1181.63,283.29 1181.23,285.00
             1181.23,285.00 1178.12,300.00 1178.12,300.00
             1178.12,300.00 1162.00,377.00 1162.00,377.00
             1162.00,377.00 1156.00,377.00 1156.00,377.00
             1156.00,377.00 1164.21,337.00 1164.21,337.00
             1164.21,337.00 1177.00,276.00 1177.00,276.00
             1178.93,276.16 1181.46,276.04 1182.22,278.31 Z
           M 1167.74,358.00
           C 1167.74,358.00 1179.80,300.00 1179.80,300.00
             1179.80,300.00 1183.12,285.00 1183.12,285.00
             1183.12,285.00 1185.01,278.60 1185.01,278.60
             1185.01,278.60 1190.00,277.00 1190.00,277.00
             1190.00,277.00 1184.45,305.00 1184.45,305.00
             1184.45,305.00 1175.79,348.00 1175.79,348.00
             1175.79,348.00 1170.00,377.00 1170.00,377.00
             1170.00,377.00 1164.00,377.00 1164.00,377.00
             1164.00,377.00 1167.74,358.00 1167.74,358.00 Z
           M 1197.00,277.00
           C 1197.00,277.00 1190.67,312.00 1190.67,312.00
             1190.67,312.00 1189.54,320.00 1189.54,320.00
             1189.54,320.00 1182.69,354.00 1182.69,354.00
             1182.69,354.00 1177.28,375.40 1177.28,375.40
             1177.28,375.40 1172.00,377.00 1172.00,377.00
             1172.00,377.00 1176.55,352.00 1176.55,352.00
             1176.55,352.00 1186.21,305.00 1186.21,305.00
             1186.21,305.00 1192.00,277.00 1192.00,277.00
             1192.00,277.00 1197.00,277.00 1197.00,277.00 Z
           M 1194.80,301.00
           C 1194.80,301.00 1200.14,279.57 1200.14,279.57
             1200.14,279.57 1204.00,278.00 1204.00,278.00
             1204.00,278.00 1197.80,312.00 1197.80,312.00
             1197.80,312.00 1185.00,376.00 1185.00,376.00
             1185.00,376.00 1180.00,376.00 1180.00,376.00
             1180.00,376.00 1194.80,301.00 1194.80,301.00 Z
           M 1212.00,279.00
           C 1212.00,279.00 1207.00,304.00 1207.00,304.00
             1207.00,304.00 1198.60,347.00 1198.60,347.00
             1198.60,347.00 1193.00,376.00 1193.00,376.00
             1193.00,376.00 1187.00,376.00 1187.00,376.00
             1187.00,376.00 1199.34,315.00 1199.34,315.00
             1199.34,315.00 1207.00,278.00 1207.00,278.00
             1207.00,278.00 1212.00,279.00 1212.00,279.00 Z
           M 1219.00,280.00
           C 1219.00,280.00 1215.00,299.00 1215.00,299.00
             1215.00,299.00 1199.00,376.00 1199.00,376.00
             1199.00,376.00 1195.00,376.00 1195.00,376.00
             1195.00,376.00 1214.00,280.00 1214.00,280.00
             1214.00,280.00 1219.00,280.00 1219.00,280.00 Z
           M 1225.00,280.00
           C 1225.00,280.00 1221.28,303.00 1221.28,303.00
             1221.28,303.00 1211.26,352.00 1211.26,352.00
             1211.26,352.00 1206.69,373.49 1206.69,373.49
             1206.69,373.49 1203.00,376.00 1203.00,376.00
             1202.11,370.01 1207.04,350.01 1208.58,343.00
             1208.58,343.00 1214.28,313.00 1214.28,313.00
             1214.28,313.00 1221.00,280.00 1221.00,280.00
             1221.00,280.00 1225.00,280.00 1225.00,280.00 Z
           M 1226.00,296.00
           C 1226.00,296.00 1226.00,312.00 1226.00,312.00
             1225.98,324.36 1216.81,360.09 1214.00,375.00
             1214.00,375.00 1209.00,376.00 1209.00,376.00
             1209.00,376.00 1214.55,347.00 1214.55,347.00
             1214.55,347.00 1218.21,327.00 1218.21,327.00
             1218.21,327.00 1224.00,296.00 1224.00,296.00
             1224.00,296.00 1226.00,296.00 1226.00,296.00 Z
           M 1222.79,364.00
           C 1221.52,369.72 1222.15,373.59 1216.00,375.00
             1216.00,375.00 1218.72,362.00 1218.72,362.00
             1218.72,362.00 1225.00,332.00 1225.00,332.00
             1228.28,340.26 1224.67,355.56 1222.79,364.00 Z
           M 1223.00,374.00
           C 1223.00,374.00 1225.00,365.00 1225.00,365.00
             1226.41,368.54 1227.04,372.32 1223.00,374.00 Z" />
               <path id="structure"
        fill="none"
        d="M 685.70,223.84
           C 685.70,223.84 689.72,213.40 689.72,213.40
             689.72,213.40 692.67,208.58 692.67,208.58
             692.67,208.58 696.68,209.38 696.68,209.38
             696.68,209.38 700.70,211.79 700.70,211.79
             700.70,211.79 703.11,215.81 703.11,215.81
             703.11,215.81 701.77,219.82 701.77,219.82
             701.77,219.82 698.02,225.18 698.02,225.18
             698.02,225.18 694.81,234.28 694.81,234.28
             694.81,234.28 692.13,243.12 692.13,243.12
             692.13,243.12 691.59,250.08 691.59,250.08
             691.59,250.08 687.85,245.79 687.85,245.79
             687.85,245.79 685.44,238.56 685.44,238.56
             685.44,238.56 685.44,230.53 685.44,230.53
             685.44,230.53 685.70,223.30 685.70,223.30
             685.70,223.30 685.70,223.84 685.70,223.84 Z
           M 697.75,203.49
           C 697.75,203.49 705.25,199.74 705.25,199.74
             705.25,199.74 711.68,198.40 711.68,198.40
             711.68,198.40 718.64,198.94 718.64,198.94
             718.64,198.94 726.40,202.15 726.40,202.15
             726.40,202.15 718.90,203.76 718.90,203.76
             718.90,203.76 714.89,205.63 714.89,205.63
             714.89,205.63 711.94,208.31 711.94,208.31
             711.94,208.31 707.66,205.90 707.66,205.90
             707.66,205.90 703.64,204.29 703.64,204.29
             703.64,204.29 697.75,203.49 697.75,203.49 Z
           M 729.35,204.83
           C 729.35,204.83 733.36,208.84 733.36,208.84
             733.36,208.84 735.77,214.20 735.77,214.20
             735.77,214.20 737.65,219.55 737.65,219.55
             737.65,219.55 738.72,224.91 738.72,224.91
             738.72,224.91 738.72,230.80 738.72,230.80
             738.72,230.80 738.45,235.89 738.45,235.89
             738.45,235.89 737.11,240.71 737.11,240.71
             737.11,240.71 735.24,244.99 735.24,244.99
             735.24,244.99 732.56,247.94 732.83,247.94
             733.10,247.94 732.02,242.04 732.02,242.04
             732.02,242.04 729.88,235.08 729.88,235.08
             729.88,235.08 727.20,229.46 727.20,229.46
             727.20,229.46 724.80,224.64 724.80,224.64
             724.80,224.64 722.39,219.82 722.39,219.82
             722.39,219.82 718.64,214.73 718.64,214.73
             718.64,214.73 721.58,211.25 721.85,211.25
             722.12,211.25 725.87,208.31 725.87,208.31
             725.87,208.31 729.35,204.83 729.35,204.83 Z
           M 710.60,223.30
           C 710.60,223.30 706.05,226.52 706.05,226.52
             706.05,226.52 701.77,231.60 701.77,231.60
             701.77,231.60 698.29,237.23 698.29,237.23
             698.29,237.23 695.61,242.31 695.61,242.31
             695.61,242.31 693.47,248.20 693.47,248.20
             693.47,248.20 692.40,251.95 692.40,251.95
             692.40,251.95 696.95,256.77 696.95,256.77
             696.95,256.77 703.38,259.72 703.38,259.72
             703.38,259.72 708.19,260.52 708.19,260.52
             708.19,260.52 713.01,261.05 713.01,261.05
             713.01,261.05 717.57,259.98 717.57,259.98
             717.57,259.98 722.92,257.84 722.92,257.84
             722.92,257.84 727.74,254.09 727.74,254.09
             727.74,254.09 729.88,251.68 729.88,251.68
             729.88,251.68 729.08,246.60 729.08,246.60
             729.08,246.60 727.20,243.12 727.20,242.85
             727.20,242.58 723.46,236.15 723.46,236.15
             723.46,236.15 717.57,228.66 717.57,228.66
             717.57,228.66 710.60,223.30 710.60,223.30 Z
           M 827.61,93.53
           C 827.61,92.42 827.61,91.84 827.61,91.84
             827.61,91.84 842.07,81.13 842.07,81.13
             842.07,81.13 843.94,87.29 843.94,87.29
             843.94,87.29 843.94,341.91 844.21,341.91
             844.48,341.91 834.84,356.37 834.84,356.37
             834.84,356.37 828.15,352.62 828.15,352.62
             828.15,352.62 827.66,115.89 827.61,93.53 Z
           M 825.74,93.98
           C 825.47,93.98 821.45,94.52 821.45,94.52
             821.45,94.52 816.90,94.52 816.90,94.52
             816.90,94.52 410.99,141.10 410.99,141.10
             410.99,141.10 376.45,144.85 376.45,144.85
             376.45,144.85 358.78,146.46 358.78,146.46
             358.78,146.46 351.29,147.26 351.29,147.26
             351.29,147.26 361.19,139.76 361.19,139.76M 351.02,148.87
           C 351.02,148.87 352.09,352.62 352.09,352.62
             352.09,352.62 826.27,353.70 826.27,353.70M 846.09,343.79
           C 846.09,343.79 894.01,395.46 894.01,395.46
             894.01,395.46 1234.86,379.40 1234.86,379.40M 846.35,234.28
           C 846.35,234.28 1234.32,273.64 1234.32,273.64M 44.45,183.41
           C 44.45,183.41 348.88,148.33 348.88,148.33M 43.38,249.54
           C 43.38,249.54 349.41,229.19 349.41,229.19M 46.59,257.04
           C 46.59,257.04 349.68,238.83 349.68,238.83M 334.69,249.81
           C 334.69,249.81 341.91,249.81 341.91,249.81M 334.15,254.09
           C 334.15,254.09 341.91,253.83 341.91,253.83M 47.12,277.12
           C 47.12,277.12 349.14,262.13 349.14,262.13M 43.64,283.81
           C 43.64,283.81 349.95,272.03 349.95,272.03M 43.38,351.29
           C 43.38,351.29 349.14,352.62 349.14,352.62M 72.29,259.45
           C 72.29,259.45 324.51,243.65 324.51,243.65
             324.51,243.65 325.31,258.11 325.31,258.11
             325.31,258.11 70.95,272.03 70.95,272.03
             70.95,272.03 72.29,259.45 72.29,259.45 Z
           M 78.18,265.87
           C 78.18,265.87 314.60,251.68 314.60,251.68" />
</svg>

<img src="http://codepen.myxotod.de/svg/xbox.png" alt="" />
            
          
!
            
              body {
  background-color: #fff;
}

img {
  max-width: 80%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  opacity: 0;
  animation-name: show;
  animation-delay: 6s;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-iteration-count: 1;
  animation-timing-function: linear;
}

svg {
  max-width: 80%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  path {
    stroke-width: 2;
    animation-fill-mode: forwards;
    animation-iteration-count: 1;
    animation-name: draw;
    animation-timing-function: linear;
    &#case {
      stroke: #666;
      stroke-dasharray: 2810;
      stroke-dashoffset: 2810;
      animation-duration: 3s;
    }
    &#cooler {
      stroke: #ddd;
      stroke-dasharray: 300;
      stroke-dashoffset: 300;
      animation-duration: 2s;
      animation-delay: 4s;
    }
    &#structure {
      stroke: #999;
      stroke-dasharray: 680;
      stroke-dashoffset: 680;
      animation-duration: 3s;
      animation-delay: 2s;
    }
  }
}

@keyframes draw {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes show {
  to {
    opacity: 1;
  }
}
            
          
!
999px
Close

Asset uploading is a PRO feature.

As a PRO member, you can drag-and-drop upload files here to use as resources. Images, Libraries, JSON data... anything you want. You can even edit them anytime, like any other code on CodePen.

Go PRO

Loading ..................

Console