![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 103 100" xmlns="http://www.w3.org/2000/svg"><g d="M 4 42 C 4 21.013 21.013 4 42 4 C 62.987 4 80 21.013 80 42 C 80 62.987 62.987 80 42 80 C 21.013 80 4 62.987 4 42 Z M 42 80 C 21.013 80 4 62.987 4 42 L 4 42 C 4 21.013 21.013 4 42 4 L 42 4 C 62.987 4 80 21.013 80 42 L 80 42 C 80 62.987 62.987 80 42 80 Z M 57.035 38.971 C 58.884 40.15 58.884 42.85 57.035 44.029 L 36.613 57.057 C 34.616 58.331 32 56.896 32 54.528 L 32 28.472 C 32 26.103 34.616 24.669 36.613 25.943 Z M 42 84 C 18.804 84 0 65.196 0 42 L 0 42 C 0 18.804 18.804 0 42 0 L 42 0 C 65.196 0 84 18.804 84 42 L 84 42 C 84 65.196 65.196 84 42 84 Z" fill="transparent" height="84px" id="uktlehcz7" transform="translate(10 8)" width="84px"><g d="M 0 38 C 0 17.013 17.013 0 38 0 C 58.987 0 76 17.013 76 38 C 76 58.987 58.987 76 38 76 C 17.013 76 0 58.987 0 38 Z M 38 76 C 17.013 76 0 58.987 0 38 L 0 38 C 0 17.013 17.013 0 38 0 L 38 0 C 58.987 0 76 17.013 76 38 L 76 38 C 76 58.987 58.987 76 38 76 Z M 53.035 34.971 C 54.884 36.15 54.884 38.85 53.035 40.029 L 32.613 53.057 C 30.616 54.331 28 52.896 28 50.528 L 28 24.472 C 28 22.103 30.616 20.669 32.613 21.943 Z" fill="transparent" height="76px" id="SvAca2qmp" transform="translate(4 4)" width="76px"><path d="M 0 38 C 0 17.013 17.013 0 38 0 C 58.987 0 76 17.013 76 38 C 76 58.987 58.987 76 38 76 C 17.013 76 0 58.987 0 38 Z" fill="transparent" height="76px" id="cWzz57WRs" width="76px"/><path d="M 38 76 C 17.013 76 0 58.987 0 38 L 0 38 C 0 17.013 17.013 0 38 0 L 38 0 C 58.987 0 76 17.013 76 38 L 76 38 C 76 58.987 58.987 76 38 76 Z" fill="rgb(0, 132, 255)" height="76px" id="fMs9bjFbp" width="76px"/><g d="M 25.035 13.503 C 26.884 14.683 26.884 17.382 25.035 18.562 L 4.613 31.59 C 2.616 32.864 0 31.429 0 29.06 L 0 3.005 C 0 0.636 2.616 -0.798 4.613 0.476 Z" fill="transparent" height="32.065213476447504px" id="n6eO_ZW61" transform="translate(28 21.467)" width="26.421900000000004px"><path d="M 25.035 13.503 C 26.884 14.683 26.884 17.382 25.035 18.562 L 4.613 31.59 C 2.616 32.864 0 31.429 0 29.06 L 0 3.005 C 0 0.636 2.616 -0.798 4.613 0.476 Z" fill="rgb(255, 255, 255)" height="32.065213476447504px" id="zcdZoLVfe" width="26.421900000000004px"/></g></g><path d="M 42 84 C 18.804 84 0 65.196 0 42 L 0 42 C 0 18.804 18.804 0 42 0 L 42 0 C 65.196 0 84 18.804 84 42 L 84 42 C 84 65.196 65.196 84 42 84 Z" fill="transparent" height="84px" id="co8XG5T1F" stroke-dasharray="" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-width="8" stroke="rgba(0, 132, 255, 0.22)" width="84px"/></g></svg>)
Supercharge videos in Framer with a fully customizable media player
for video files, YouTube and Vimeo videos.
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 98 105" xmlns="http://www.w3.org/2000/svg"><g d="M 4 42 C 4 21.013 21.013 4 42 4 C 62.987 4 80 21.013 80 42 C 80 62.987 62.987 80 42 80 C 21.013 80 4 62.987 4 42 Z M 42 80 C 21.013 80 4 62.987 4 42 L 4 42 C 4 21.013 21.013 4 42 4 L 42 4 C 62.987 4 80 21.013 80 42 L 80 42 C 80 62.987 62.987 80 42 80 Z M 41.921 43.616 C 40.499 42.564 40.499 40.436 41.921 39.384 L 56.802 28.373 C 58.539 27.087 61 28.327 61 30.489 L 61 52.512 C 61 54.673 58.539 55.914 56.802 54.628 Z M 19.86 43.616 C 18.438 42.564 18.438 40.436 19.86 39.384 L 34.74 28.373 C 36.478 27.087 38.939 28.327 38.939 30.489 L 38.939 52.512 C 38.939 54.673 36.478 55.914 34.74 54.628 Z M 42 84 C 18.804 84 0 65.196 0 42 L 0 42 C 0 18.804 18.804 0 42 0 L 42 0 C 65.196 0 84 18.804 84 42 L 84 42 C 84 65.196 65.196 84 42 84 Z" fill="transparent" height="84px" id="IjdVMaKVf" transform="translate(7 9)" width="84px"><g d="M 0 38 C 0 17.013 17.013 0 38 0 C 58.987 0 76 17.013 76 38 C 76 58.987 58.987 76 38 76 C 17.013 76 0 58.987 0 38 Z M 38 76 C 17.013 76 0 58.987 0 38 L 0 38 C 0 17.013 17.013 0 38 0 L 38 0 C 58.987 0 76 17.013 76 38 L 76 38 C 76 58.987 58.987 76 38 76 Z M 37.921 39.616 C 36.499 38.564 36.499 36.436 37.921 35.384 L 52.802 24.373 C 54.539 23.087 57 24.327 57 26.489 L 57 48.512 C 57 50.673 54.539 51.914 52.802 50.628 Z M 15.86 39.616 C 14.438 38.564 14.438 36.436 15.86 35.384 L 30.74 24.373 C 32.478 23.087 34.939 24.327 34.939 26.489 L 34.939 48.512 C 34.939 50.673 32.478 51.914 30.74 50.628 Z" fill="transparent" height="76px" id="Fj50UoPv8" transform="translate(4 4)" width="76px"><path d="M 0 38 C 0 17.013 17.013 0 38 0 C 58.987 0 76 17.013 76 38 C 76 58.987 58.987 76 38 76 C 17.013 76 0 58.987 0 38 Z" fill="transparent" height="76px" id="LtqPgWpV5" width="76px"/><path d="M 38 76 C 17.013 76 0 58.987 0 38 L 0 38 C 0 17.013 17.013 0 38 0 L 38 0 C 58.987 0 76 17.013 76 38 L 76 38 C 76 58.987 58.987 76 38 76 Z" fill="rgb(255, 89, 46)" height="76px" id="RKky9q7Q6" width="76px"/><g d="M 1.067 15.765 C -0.356 14.713 -0.356 12.585 1.067 11.533 L 15.947 0.521 C 17.685 -0.765 20.146 0.476 20.146 2.637 L 20.146 24.66 C 20.146 26.822 17.685 28.062 15.947 26.776 Z" fill="transparent" height="27.29763563380223px" id="jPU5fUZgU" transform="translate(36.855 23.851)" width="20.145650000000003px"><path d="M 1.067 15.765 C -0.356 14.713 -0.356 12.585 1.067 11.533 L 15.947 0.521 C 17.685 -0.765 20.146 0.476 20.146 2.637 L 20.146 24.66 C 20.146 26.822 17.685 28.062 15.947 26.776 Z" fill="rgb(255, 255, 255)" height="27.29763563380223px" id="PFaRmdpcg" width="20.145650000000003px"/></g><g d="M 1.067 15.765 C -0.356 14.713 -0.356 12.585 1.067 11.533 L 15.947 0.521 C 17.685 -0.765 20.146 0.476 20.146 2.637 L 20.146 24.66 C 20.146 26.822 17.685 28.062 15.947 26.776 Z" fill="transparent" height="27.29763563380223px" id="NkcCs4qhM" transform="translate(14.793 23.851)" width="20.145650000000003px"><path d="M 1.067 15.765 C -0.356 14.713 -0.356 12.585 1.067 11.533 L 15.947 0.521 C 17.685 -0.765 20.146 0.476 20.146 2.637 L 20.146 24.66 C 20.146 26.822 17.685 28.062 15.947 26.776 Z" fill="rgb(255, 255, 255)" height="27.29763563380223px" id="BepCcULNd" width="20.145650000000003px"/></g></g><path d="M 42 84 C 18.804 84 0 65.196 0 42 L 0 42 C 0 18.804 18.804 0 42 0 L 42 0 C 65.196 0 84 18.804 84 42 L 84 42 C 84 65.196 65.196 84 42 84 Z" fill="transparent" height="84px" id="SyfsF3L1M" stroke-dasharray="" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-width="8" stroke="rgba(255, 89, 46, 0.22)" width="84px"/></g></svg>)
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 180 110" xmlns="http://www.w3.org/2000/svg"><g d="M 12 110 C 5.373 110 0 104.627 0 98 L 0 12 C 0 5.373 5.373 0 12 0 L 168 0 C 174.627 0 180 5.373 180 12 L 180 98 C 180 104.627 174.627 110 168 110 Z M 90.5 42 L 104 42 L 104 55.5 L 100.4 55.5 L 100.4 48.145 L 83.145 65.4 L 90.5 65.4 L 90.5 69 L 77 69 L 77 55.5 L 80.6 55.5 L 80.6 62.855 L 97.855 45.6 L 90.5 45.6 Z M 13 9 L 10 9 L 10 12 L 10 25 L 13 25 L 13 12 L 26 12 L 26 9 Z M 166 9 L 169 9 L 169 12 L 169 25 L 166 25 L 166 12 L 153 12 L 153 9 Z M 10 97 L 10 100 L 13 100 L 26 100 L 26 97 L 13 97 L 13 84 L 10 84 Z M 169 97 L 169 100 L 166 100 L 153 100 L 153 97 L 166 97 L 166 84 L 169 84 Z" fill="transparent" height="110px" id="nWJxUilyi" width="180px"><path d="M 12 110 C 5.373 110 0 104.627 0 98 L 0 12 C 0 5.373 5.373 0 12 0 L 168 0 C 174.627 0 180 5.373 180 12 L 180 98 C 180 104.627 174.627 110 168 110 Z" fill="rgb(100, 17, 36)" height="110px" id="MtYtSBXRq" width="180px"/><path d="M 13.5 0 L 27 0 L 27 13.5 L 23.4 13.5 L 23.4 6.145 L 6.145 23.4 L 13.5 23.4 L 13.5 27 L 0 27 L 0 13.5 L 3.6 13.5 L 3.6 20.855 L 20.855 3.6 L 13.5 3.6 Z" fill="rgb(255, 172, 131)" height="27px" id="pDeU4IwDy" transform="translate(77 42)" width="27px"/><path d="M 3 0 L 0 0 L 0 3 L 0 16 L 3 16 L 3 3 L 16 3 L 16 0 Z" fill="rgba(255, 255, 255, 0.3)" height="16px" id="daphO5Z4A" transform="translate(10 9)" width="16px"/><path d="M 13 0 L 16 0 L 16 3 L 16 16 L 13 16 L 13 3 L 0 3 L 0 0 Z" fill="rgba(255, 255, 255, 0.3)" height="16px" id="ipkJsJhsE" transform="translate(153 9)" width="16px"/><path d="M 0 13 L 0 16 L 3 16 L 16 16 L 16 13 L 3 13 L 3 0 L 0 0 Z" fill="rgba(255, 255, 255, 0.3)" height="16px" id="YWXtWkwBV" transform="translate(10 84)" width="16px"/><path d="M 16 13 L 16 16 L 13 16 L 0 16 L 0 13 L 13 13 L 13 0 L 16 0 Z" fill="rgba(255, 255, 255, 0.3)" height="16px" id="DvUG8yZeb" transform="translate(153 84)" width="16px"/></g></svg>)
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 105 102" xmlns="http://www.w3.org/2000/svg"><path d="M 8.523 41.364 C 3.816 41.364 0 37.548 0 32.841 L 0 8.523 C 0 3.816 3.816 0 8.523 0 L 61.477 0 C 66.184 0 70 3.816 70 8.523 L 70 32.841 C 70 37.548 66.184 41.364 61.477 41.364 Z" fill="rgb(255, 255, 255)" height="41.3636px" id="TVJrLW8fZ" transform="translate(18 4)" width="70px"/><path d="M 7.98 40.279 C 3.573 40.279 0 36.706 0 32.299 L 0 7.98 C 0 3.573 3.573 0 7.98 0 L 60.935 0 C 65.342 0 68.915 3.573 68.915 7.98 L 68.915 32.299 C 68.915 36.706 65.342 40.279 60.935 40.279 Z" fill="transparent" height="40.2789px" id="Ii2k0Nzvr" stroke-dasharray="" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-width="1.08471" stroke="rgba(0, 0, 0, 0.05)" transform="translate(18.542 4.542)" width="68.9153px"/><path d="M 8.523 41.364 C 3.816 41.364 0 37.548 0 32.841 L 0 8.523 C 0 3.816 3.816 0 8.523 0 L 61.477 0 C 66.184 0 70 3.816 70 8.523 L 70 32.841 C 70 37.548 66.184 41.364 61.477 41.364 Z" fill="rgb(255, 255, 255)" height="41.36359999999999px" id="mCtPmpMV0" transform="translate(18 59)" width="70px"/><path d="M 7.98 40.279 C 3.573 40.279 0 36.706 0 32.299 L 0 7.98 C 0 3.573 3.573 0 7.98 0 L 60.935 0 C 65.342 0 68.915 3.573 68.915 7.98 L 68.915 32.299 C 68.915 36.706 65.342 40.279 60.935 40.279 Z" fill="transparent" height="40.27889999999999px" id="cMSpXTtFO" stroke-dasharray="" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-width="1.08471" stroke="rgba(0, 0, 0, 0.05)" transform="translate(18.542 59.542)" width="68.9153px"/><path d="M 2.698 3.159 C 2.006 3.887 0.976 4.082 0 4.082 L 0 1.952 C 1.384 1.793 2.29 1.26 2.698 0 L 5.289 0 L 5.289 12.424 L 2.698 12.424 Z M 7.05 12.424 L 10.245 7.756 L 7.245 3.195 L 10.032 3.195 L 11.718 5.893 L 13.404 3.195 L 16.191 3.195 L 13.191 7.756 L 16.386 12.424 L 13.599 12.424 L 11.718 9.62 L 9.837 12.424 Z" fill="rgb(0, 0, 0)" height="12.42400000267029px" id="RbHjjm79t" transform="translate(45.145 18.144)" width="16.385899985504153px"/><path d="M 0 11.998 C 0 9.744 0.639 8.2 3.266 6.656 C 4.934 5.697 6.194 5.183 6.212 3.798 C 6.248 2.538 5.289 2.201 4.473 2.201 C 3.532 2.201 2.68 2.716 2.68 4.118 L 2.68 4.366 L 0.178 4.366 L 0.178 4.011 C 0.178 1.81 1.438 0 4.508 0 C 7.312 0 8.803 1.491 8.803 3.638 C 8.803 6.07 6.904 7.064 5.413 7.898 C 3.638 8.928 2.964 9.584 2.964 10.383 L 2.964 10.436 L 8.768 10.436 L 8.768 12.584 L 0 12.584 Z M 10.047 12.584 L 13.242 7.916 L 10.243 3.355 L 13.029 3.355 L 14.715 6.052 L 16.401 3.355 L 19.188 3.355 L 16.188 7.916 L 19.383 12.584 L 16.597 12.584 L 14.715 9.78 L 12.834 12.584 Z" fill="rgb(0, 0, 0)" height="12.583800055313105px" id="vM72Z_X0L" transform="translate(43.582 72.985)" width="19.383299656677252px"/><g d="M 10.714 52 C 4.797 52 0 47.203 0 41.286 L 0 10.714 C 0 4.797 4.797 0 10.714 0 L 81.286 0 C 87.203 0 92 4.797 92 10.714 L 92 41.286 C 92 47.203 87.203 52 81.286 52 Z M 10.714 51.318 C 5.174 51.318 0.682 46.827 0.682 41.286 L 0.682 10.714 C 0.682 5.174 5.174 0.682 10.714 0.682 L 81.286 0.682 C 86.826 0.682 91.318 5.174 91.318 10.714 L 91.318 41.286 C 91.318 46.827 86.826 51.318 81.286 51.318 Z" fill="transparent" height="52px" id="Vua33uI_e" transform="translate(7 25)" width="92px"><path d="M 10.714 52 C 4.797 52 0 47.203 0 41.286 L 0 10.714 C 0 4.797 4.797 0 10.714 0 L 81.286 0 C 87.203 0 92 4.797 92 10.714 L 92 41.286 C 92 47.203 87.203 52 81.286 52 Z" fill="rgb(255, 34, 75)" height="52px" id="WnvI2f04d" width="92px"/><path d="M 10.032 50.636 C 4.492 50.636 0 46.145 0 40.604 L 0 10.033 C 0 4.492 4.492 0 10.032 0 L 80.604 0 C 86.145 0 90.636 4.492 90.636 10.033 L 90.636 40.604 C 90.636 46.145 86.145 50.636 80.604 50.636 Z" fill="transparent" height="50.63640000000001px" id="BRZdi2Cp2" stroke-dasharray="" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-width="1.36364" stroke="rgba(0, 0, 0, 0.05)" transform="translate(0.682 0.682)" width="90.63639999999998px"/></g><path d="M 3.392 3.972 C 2.521 4.886 1.227 5.132 0 5.132 L 0 2.454 C 1.74 2.254 2.878 1.584 3.392 0 L 6.649 0 L 6.649 15.619 L 3.392 15.619 Z M 11.05 15.842 C 9.979 15.842 9.086 14.994 9.086 13.901 C 9.086 12.83 9.979 11.96 11.05 11.96 C 12.143 11.96 13.035 12.83 13.035 13.901 C 13.035 14.994 12.143 15.842 11.05 15.842 Z M 20.577 15.842 C 16.85 15.842 14.753 13.678 14.798 10.621 L 17.743 10.621 C 17.81 12.517 19.305 13.209 20.487 13.209 C 21.625 13.209 23.299 12.607 23.299 10.241 C 23.299 7.832 21.625 7.319 20.532 7.319 C 19.461 7.319 18.435 7.832 18.033 8.724 L 15.021 8.724 L 16.337 0 L 25.061 0 L 25.061 2.588 L 18.568 2.588 L 18.055 6.047 C 18.122 5.935 19.126 4.819 21.38 4.819 C 24.325 4.819 26.534 6.872 26.534 10.241 C 26.534 13.834 24.147 15.842 20.577 15.842 Z M 27.733 15.619 L 31.749 9.751 L 27.978 4.016 L 31.481 4.016 L 33.601 7.408 L 35.721 4.016 L 39.224 4.016 L 35.453 9.751 L 39.469 15.619 L 35.966 15.619 L 33.601 12.093 L 31.236 15.619 Z" fill="rgb(255, 255, 255)" height="15.84190031280518px" id="hrs_OQDFq" transform="translate(33.876 43.381)" width="39.469199530029286px"/></svg>)
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 160 52" xmlns="http://www.w3.org/2000/svg"><path d="M 14.222 51.556 C 6.367 51.556 0 45.188 0 37.333 L 0 14.222 C 0 6.367 6.367 0 14.222 0 L 145.778 0 C 153.633 0 160 6.367 160 14.222 L 160 37.333 C 160 45.188 153.633 51.556 145.778 51.556 Z" fill="rgb(2, 48, 51)" height="51.5556px" id="WQRkhGheY" transform="translate(0 0.222)" width="160px"/><path d="M 13.657 50.424 C 6.114 50.424 0 44.31 0 36.768 L 0 13.657 C 0 6.114 6.114 0 13.657 0 L 145.212 0 C 152.755 0 158.869 6.114 158.869 13.657 L 158.869 36.768 C 158.869 44.31 152.755 50.424 145.212 50.424 Z" fill="transparent" height="50.4242px" id="HOOAauHWd" stroke-dasharray="" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-width="1.13131" stroke="rgba(0, 0, 0, 0.05)" transform="translate(0.566 0.788)" width="158.86900000000003px"/><path d="M 6.934 17.743 C 3.578 17.743 0 15.448 0 8.859 C 0 2.32 3.578 0 6.934 0 C 10.34 0 13.869 2.32 13.869 8.859 C 13.869 15.448 10.34 17.743 6.934 17.743 Z M 3.43 8.859 C 3.43 11.919 4.294 14.732 6.934 14.732 C 9.575 14.732 10.439 11.919 10.439 8.859 C 10.439 5.849 9.575 3.011 6.934 3.011 C 4.294 3.011 3.43 5.849 3.43 8.859 Z M 19.319 4.615 C 18.356 5.626 16.925 5.898 15.568 5.898 L 15.568 2.937 C 17.493 2.715 18.751 1.974 19.319 0.222 L 22.922 0.222 L 22.922 17.496 L 19.319 17.496 Z M 27.499 17.743 C 26.315 17.743 25.328 16.805 25.328 15.596 C 25.328 14.411 26.315 13.449 27.499 13.449 C 28.709 13.449 29.696 14.411 29.696 15.596 C 29.696 16.805 28.709 17.743 27.499 17.743 Z M 25.328 6.811 C 25.328 5.626 26.315 4.664 27.499 4.664 C 28.709 4.664 29.696 5.626 29.696 6.811 C 29.696 8.02 28.709 8.958 27.499 8.958 C 26.315 8.958 25.328 8.02 25.328 6.811 Z M 31.595 16.682 C 31.595 13.548 32.484 11.401 36.136 9.254 C 38.456 7.921 40.208 7.206 40.232 5.281 C 40.282 3.529 38.949 3.06 37.814 3.06 C 36.506 3.06 35.322 3.776 35.322 5.725 L 35.322 6.071 L 31.842 6.071 L 31.842 5.577 C 31.842 2.517 33.594 0 37.863 0 C 41.762 0 43.835 2.073 43.835 5.059 C 43.835 8.44 41.195 9.822 39.122 10.981 C 36.654 12.413 35.716 13.326 35.716 14.436 L 35.716 14.51 L 43.786 14.51 L 43.786 17.496 L 31.595 17.496 Z M 53.166 17.496 L 53.166 13.449 L 45.688 13.449 L 45.688 10.562 L 53.166 0.222 L 56.769 0.222 L 56.769 10.562 L 58.743 10.562 L 58.743 13.449 L 56.769 13.449 L 56.769 17.496 Z M 48.822 10.562 L 53.166 10.562 L 53.166 4.565 Z" fill="rgb(255, 255, 255)" height="17.7429px" id="BUQlBUOLK" transform="translate(14.526 18.059)" width="58.7427994506836px"/><path d="M 0 17.447 L 6.737 0.222 L 10.34 0.222 L 3.628 17.447 Z M 15.732 4.615 C 14.77 5.626 13.339 5.898 11.981 5.898 L 11.981 2.937 C 13.906 2.715 15.165 1.974 15.732 0.222 L 19.335 0.222 L 19.335 17.496 L 15.732 17.496 Z M 22.104 16.682 C 22.104 13.548 22.993 11.401 26.645 9.254 C 28.965 7.921 30.717 7.206 30.742 5.281 C 30.791 3.529 29.458 3.06 28.323 3.06 C 27.015 3.06 25.831 3.776 25.831 5.725 L 25.831 6.071 L 22.351 6.071 L 22.351 5.577 C 22.351 2.517 24.103 0 28.373 0 C 32.272 0 34.344 2.073 34.344 5.059 C 34.344 8.44 31.704 9.822 29.631 10.981 C 27.163 12.413 26.226 13.326 26.226 14.436 L 26.226 14.51 L 34.295 14.51 L 34.295 17.496 L 22.104 17.496 Z M 38.493 17.743 C 37.308 17.743 36.321 16.805 36.321 15.596 C 36.321 14.411 37.308 13.449 38.493 13.449 C 39.702 13.449 40.689 14.411 40.689 15.596 C 40.689 16.805 39.702 17.743 38.493 17.743 Z M 36.321 6.811 C 36.321 5.626 37.308 4.664 38.493 4.664 C 39.702 4.664 40.689 5.626 40.689 6.811 C 40.689 8.02 39.702 8.958 38.493 8.958 C 37.308 8.958 36.321 8.02 36.321 6.811 Z M 49.029 17.743 C 44.908 17.743 42.589 15.349 42.638 11.969 L 45.895 11.969 C 45.969 14.066 47.623 14.831 48.931 14.831 C 50.189 14.831 52.04 14.165 52.04 11.549 C 52.04 8.884 50.189 8.316 48.98 8.316 C 47.795 8.316 46.66 8.884 46.216 9.871 L 42.885 9.871 L 44.341 0.222 L 53.989 0.222 L 53.989 3.085 L 46.808 3.085 L 46.241 6.91 C 46.315 6.786 47.425 5.552 49.918 5.552 C 53.175 5.552 55.618 7.823 55.618 11.549 C 55.618 15.522 52.978 17.743 49.029 17.743 Z M 63.385 17.743 C 59.807 17.743 57.067 15.867 57.067 12.536 C 57.067 10.463 58.054 8.884 60.103 8.02 C 58.425 7.107 57.98 5.676 57.98 4.417 C 57.98 1.95 59.93 0 63.385 0 C 66.84 0 68.789 1.95 68.789 4.417 C 68.789 5.676 68.345 7.107 66.667 8.02 C 68.715 8.884 69.702 10.463 69.702 12.536 C 69.702 15.867 66.963 17.743 63.385 17.743 Z M 60.497 12.116 C 60.497 13.498 61.435 14.732 63.385 14.732 C 65.334 14.732 66.272 13.498 66.272 12.116 C 66.272 10.759 65.285 9.501 63.385 9.501 C 61.485 9.501 60.497 10.759 60.497 12.116 Z M 61.139 4.738 C 61.139 5.824 61.879 6.786 63.385 6.786 C 64.89 6.786 65.63 5.824 65.63 4.738 C 65.63 3.578 64.841 2.764 63.385 2.764 C 61.929 2.764 61.139 3.578 61.139 4.738 Z" fill="rgba(255, 255, 255, 0.4)" height="17.742900004553793px" id="zIyVeLRfE" transform="translate(75.001 18.059)" width="69.70189834594726px"/></svg>)
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 150 53" xmlns="http://www.w3.org/2000/svg"><path d="M 10.714 51.818 C 4.797 51.818 0 47.021 0 41.104 L 0 10.714 C 0 4.797 4.797 0 10.714 0 L 139.286 0 C 145.203 0 150 4.797 150 10.714 L 150 41.104 C 150 47.021 145.203 51.818 139.286 51.818 Z" fill="rgb(255, 255, 255)" height="51.818200000000004px" id="jxD4HPiRy" transform="translate(0 0.273)" width="150px"/><path d="M 10.032 50.454 C 4.492 50.454 0 45.963 0 40.422 L 0 10.033 C 0 4.492 4.492 0 10.032 0 L 138.603 0 C 144.144 0 148.636 4.492 148.636 10.033 L 148.636 40.422 C 148.636 45.963 144.144 50.454 138.603 50.454 Z" fill="transparent" height="50.454499999999996px" id="hRTNfN5dT" stroke-dasharray="" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-width="1.36364" stroke="rgba(0, 0, 0, 0.05)" transform="translate(0.682 0.955)" width="148.63599999999997px"/><path d="M 1 2 C 0.448 2 0 1.552 0 1 L 0 1 C 0 0.448 0.448 0 1 0 L 75 0 C 75.552 0 76 0.448 76 1 L 76 1 C 76 1.552 75.552 2 75 2 Z" fill="rgba(0, 0, 0, 0.13)" height="2px" id="yefc28h_F" transform="translate(53 25)" width="76px"/><path d="M 1 2 C 0.448 2 0 1.552 0 1 L 0 1 C 0 0.448 0.448 0 1 0 L 63 0 C 63.552 0 64 0.448 64 1 L 64 1 C 64 1.552 63.552 2 63 2 Z" fill="rgb(96, 22, 227)" height="2px" id="SSFfn8c9G" transform="translate(53 25)" width="64px"/><path d="M 0 4.607 C 0 2.063 2.063 0 4.607 0 C 7.152 0 9.214 2.063 9.214 4.607 C 9.214 7.152 7.152 9.214 4.607 9.214 C 2.063 9.214 0 7.152 0 4.607 Z" fill="rgb(96, 22, 227)" height="9.214280000000002px" id="Ab1wMaSOU" transform="translate(108.214 21.701)" width="9.214280000000002px"/><path d="M 1.071 13.334 L 5.238 13.334 L 10.91 17.976 C 10.989 18.04 11.084 18.081 11.185 18.093 C 11.285 18.105 11.388 18.089 11.479 18.046 C 11.571 18.002 11.648 17.934 11.703 17.848 C 11.757 17.762 11.786 17.663 11.786 17.561 L 11.786 0.536 C 11.786 0.435 11.757 0.335 11.703 0.249 C 11.648 0.164 11.571 0.095 11.479 0.052 C 11.388 0.008 11.285 -0.008 11.185 0.004 C 11.084 0.016 10.989 0.057 10.91 0.121 L 5.239 4.763 L 1.071 4.763 C 0.787 4.763 0.515 4.876 0.314 5.077 C 0.113 5.278 0 5.55 0 5.834 L 0 12.263 C 0 12.547 0.113 12.82 0.314 13.02 C 0.515 13.221 0.787 13.334 1.071 13.334 Z M 23.571 9.049 C 23.571 12.576 22.022 15.741 19.566 17.901 L 18.047 16.381 C 19.108 15.477 19.961 14.353 20.544 13.087 C 21.128 11.821 21.43 10.443 21.429 9.049 C 21.43 7.654 21.129 6.276 20.545 5.01 C 19.961 3.744 19.109 2.62 18.048 1.716 L 19.566 0.196 C 20.826 1.301 21.836 2.663 22.526 4.189 C 23.217 5.716 23.574 7.373 23.571 9.049 Z M 18.214 9.049 C 18.215 8.076 17.995 7.116 17.57 6.242 C 17.146 5.367 16.528 4.6 15.764 3.999 L 14.233 5.53 C 14.8 5.925 15.264 6.451 15.584 7.064 C 15.904 7.676 16.071 8.357 16.071 9.049 C 16.071 10.506 15.344 11.792 14.233 12.567 L 15.765 14.099 C 16.529 13.498 17.147 12.731 17.571 11.856 C 17.995 10.981 18.215 10.021 18.214 9.049 Z" fill="rgb(96, 22, 227)" height="18.097117086598985px" id="E956szDfH" transform="translate(16.071 17.416)" width="23.571409296255364px"/></svg>)
Framer’s default video player adds watermarks and redirects viewers away from your site. Keep your audience focused—and your brand front and center.
![](data:image/svg+xml,<svg aria-label="Vector" display="block" role="presentation" viewBox="0 0 63 63" xmlns="http://www.w3.org/2000/svg"><path d="M 31.5 0 C 48.897 0 63 14.103 63 31.5 C 63 48.897 48.897 63 31.5 63 C 14.103 63 0 48.897 0 31.5 C 0 14.103 14.103 0 31.5 0 Z" fill="rgb(255, 255, 255)" height="63px" id="ZoVEExLn4" width="63px"/><path d="M 12.174 3.961 C 12.571 3.379 13.429 3.379 13.826 3.961 L 23.191 17.686 C 23.644 18.35 23.169 19.25 22.365 19.25 L 3.635 19.25 C 2.831 19.25 2.356 18.35 2.809 17.686 Z" fill="rgb(0, 0, 0)" height="22px" id="nqezV2Y4b" transform="translate(21 21) rotate(90 13 11)" width="26px"/></svg>)
Build your video player like anything else in Framer. Just drag & drop from our advanced component library.
CUSTOM PLAYBACK CONTROLS
Take control with custom playback options.
PROGRESS BAR
Instantly jump to your desired scene with the interactive progress bar.
VIDEO TIME LABELS
Make it easy to show the length of the video.
SHOW/HIDE CONTROLS
Animate your video player like anything else inside of Framer with effects.
FULL SCREEN MODE
Make any video full screen easily.
PICTURE-IN-PICTURE
Have your video playing at all times, even if you need to switch tabs.
32
+4.0
64
+2.3
125
+1.0
250
+0.3
1k
-1.2
2k
-0.1
4k
+1.6
8k
+3.1
16k
+3.3
CUSTOM AUDIO PLAYERS
Style your podcasts, interviews & music to match your brand
VOLUME CONTROL
Control the volume of your video directly from your player!
UNLIMITED USES
Use VideoFrame as many times as you need.
NO WATERMARKS
No secret logos here. Make it yours, not ours.
ALL IN FRAMER
No embeds needed! VideoFrame uses Framer code components.
LIFE-TIME ACCESS
No on-going subscriptions. Just pay once.
HOW IT WORKS
LAUNCH THE PLUGIN
Open your project, hit ⌘K, and launch the Videoframe plugin.
START BUILDING
Just drag and drop to create your perfect video player with our video components!I
MAKE IT YOURS
Head ot the properties panel and adjust your video settings.
Stop using Framer's cookie-cutter video controls. Videoframe lets you customize everything, including animations, speed controls, and Picture-in-Picture.
Build custom video players in Framer without limits. One-time payment.
