Logo
Voorbeelden
Visuele voorbeeld:
%20--%3e%3csvg%20version='1.1'%20id='Layer_1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20x='0px'%20y='0px'%20viewBox='0%200%20292.3%2082.6'%20style='enable-background:new%200%200%20292.3%2082.6;'%20xml:space='preserve'%3e%3cg%3e%3cpath%20d='M0,81.5V1.3h5.6v75h38.3v5.3H0z'/%3e%3cpath%20d='M125.1,41.3c0,12.7-3.2,22.8-9.5,30.2c-6.4,7.4-15.1,11.1-26.3,11.1c-11.2,0-19.9-3.7-26.3-11.1%20c-6.4-7.4-9.5-17.5-9.5-30.3c0-12.8,3.2-22.8,9.6-30.2C69.5,3.7,78.2,0,89.3,0c11.2,0,20,3.7,26.3,11.1%20C122,18.4,125.1,28.5,125.1,41.3z%20M59.5,41.3c0,11.5,2.6,20.4,7.7,26.6c5.1,6.3,12.5,9.4,22.1,9.4c9.7,0,17-3.1,22.1-9.3%20c5.1-6.2,7.7-15.1,7.7-26.7c0-11.6-2.6-20.4-7.7-26.6c-5.1-6.2-12.5-9.2-22-9.2c-9.5,0-16.9,3.1-22.1,9.3%20C62.1,21,59.5,29.8,59.5,41.3z'/%3e%3cpath%20d='M175.1,41.1h29.6v36.6c-7.8,3.3-16.5,4.9-26.2,4.9c-12.7,0-22.4-3.6-29.1-10.7c-6.8-7.2-10.1-17.3-10.1-30.4%20c0-8.2,1.7-15.4,5-21.7c3.3-6.3,8.1-11.2,14.4-14.6c6.2-3.4,13.4-5.2,21.5-5.2c8.7,0,16.6,1.6,23.5,4.8l-2.3,5%20c-7-3.2-14.2-4.8-21.6-4.8c-10.6,0-19,3.3-25.2,9.8c-6.2,6.5-9.3,15.3-9.3,26.4c0,12.1,2.9,21.2,8.8,27.2c5.9,6.1,14.5,9.1,26,9.1%20c7.4,0,13.7-1,18.8-3.1V46.3h-23.9V41.1z'/%3e%3cpath%20d='M292.3,41.3c0,12.7-3.2,22.8-9.5,30.2s-15.1,11.1-26.3,11.1c-11.2,0-19.9-3.7-26.3-11.1s-9.5-17.5-9.5-30.3%20c0-12.8,3.2-22.8,9.6-30.2c6.4-7.3,15.2-11,26.3-11c11.2,0,20,3.7,26.3,11.1C289.1,18.4,292.3,28.5,292.3,41.3z%20M226.7,41.3%20c0,11.5,2.6,20.4,7.7,26.6c5.1,6.3,12.5,9.4,22.1,9.4c9.7,0,17-3.1,22.1-9.3c5.1-6.2,7.7-15.1,7.7-26.7c0-11.6-2.6-20.4-7.7-26.6%20c-5.1-6.2-12.5-9.2-22-9.2c-9.6,0-16.9,3.1-22.1,9.3C229.3,21,226.7,29.8,226.7,41.3z'/%3e%3c/g%3e%3c/svg%3e)
Bedrijfs- of product-naam HTML-voorbeeld:
<a href="{base}/components/logo" class="logo" aria-label="Logo bedrijfs- of product-naam, ga naar de homepage van bedrijfs- of product-naam">
<img src="/logo.svg" alt="Logo bedrijfs- of product-naam" />
Bedrijfs- of product-naam
</a>Benodigde bestanden
logo/logo-base.scsslogo/logo-base-variables.scss