Default splash page
<div class="ecl-splash-page"> <div class="ecl-splash-page__logo-container"> <div class="ecl-container"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__logo-link" aria-label="European Commission"> <picture class="ecl-picture ecl-splash-page__picture" title="European Commission"> <source srcset="/dist/media/icons.b6764719.svg" media="(min-width: 768px)"><img class="ecl-splash-page__logo-image" src="/dist/media/icons.b6764719.svg" alt="European Commission logo" /> </picture> </a></div> </div> <div class="ecl-container ecl-splash-page__language-container"> <div class="ecl-splash-page__language-title">Select your language</div> <div class="ecl-splash-page__language-content"> <div class="ecl-splash-page__language-category"> <div class="ecl-splash-page__language-category-title">Official EU languages:</div> <ul class="ecl-splash-page__language-list"> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="bg" hreflang="bg"><span class="ecl-splash-page__language-link-code">bg</span><span class="ecl-splash-page__language-link-label">български</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="es" hreflang="es"><span class="ecl-splash-page__language-link-code">es</span><span class="ecl-splash-page__language-link-label">español</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="cs" hreflang="cs"><span class="ecl-splash-page__language-link-code">cs</span><span class="ecl-splash-page__language-link-label">čeština</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="da" hreflang="da"><span class="ecl-splash-page__language-link-code">da</span><span class="ecl-splash-page__language-link-label">dansk</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="de" hreflang="de"><span class="ecl-splash-page__language-link-code">de</span><span class="ecl-splash-page__language-link-label">Deutsch</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="et" hreflang="et"><span class="ecl-splash-page__language-link-code">et</span><span class="ecl-splash-page__language-link-label">eesti</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="el" hreflang="el"><span class="ecl-splash-page__language-link-code">el</span><span class="ecl-splash-page__language-link-label">ελληνικά</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link ecl-splash-page__language-link--active" lang="en" hreflang="en"><span class="ecl-splash-page__language-link-code">en</span><span class="ecl-splash-page__language-link-label">English</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="fr" hreflang="fr"><span class="ecl-splash-page__language-link-code">fr</span><span class="ecl-splash-page__language-link-label">français</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="ga" hreflang="ga"><span class="ecl-splash-page__language-link-code">ga</span><span class="ecl-splash-page__language-link-label">Gaeilge</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="hr" hreflang="hr"><span class="ecl-splash-page__language-link-code">hr</span><span class="ecl-splash-page__language-link-label">hrvatski</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="it" hreflang="it"><span class="ecl-splash-page__language-link-code">it</span><span class="ecl-splash-page__language-link-label">italiano</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="lv" hreflang="lv"><span class="ecl-splash-page__language-link-code">lv</span><span class="ecl-splash-page__language-link-label">latviešu</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="lt" hreflang="lt"><span class="ecl-splash-page__language-link-code">lt</span><span class="ecl-splash-page__language-link-label">lietuvių</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="hu" hreflang="hu"><span class="ecl-splash-page__language-link-code">hu</span><span class="ecl-splash-page__language-link-label">magyar</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="mt" hreflang="mt"><span class="ecl-splash-page__language-link-code">mt</span><span class="ecl-splash-page__language-link-label">Malti</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="nl" hreflang="nl"><span class="ecl-splash-page__language-link-code">nl</span><span class="ecl-splash-page__language-link-label">Nederlands</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="pl" hreflang="pl"><span class="ecl-splash-page__language-link-code">pl</span><span class="ecl-splash-page__language-link-label">polski</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="pt" hreflang="pt"><span class="ecl-splash-page__language-link-code">pt</span><span class="ecl-splash-page__language-link-label">português</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="ro" hreflang="ro"><span class="ecl-splash-page__language-link-code">ro</span><span class="ecl-splash-page__language-link-label">română</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="sk" hreflang="sk"><span class="ecl-splash-page__language-link-code">sk</span><span class="ecl-splash-page__language-link-label">slovenčina</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="sl" hreflang="sl"><span class="ecl-splash-page__language-link-code">sl</span><span class="ecl-splash-page__language-link-label">slovenščina</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="fi" hreflang="fi"><span class="ecl-splash-page__language-link-code">fi</span><span class="ecl-splash-page__language-link-label">suomi</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="sv" hreflang="sv"><span class="ecl-splash-page__language-link-code">sv</span><span class="ecl-splash-page__language-link-label">svenska</span></a></li> </ul> </div> <div class="ecl-splash-page__language-category"> <div class="ecl-splash-page__language-category-title">Other languages:</div> <ul class="ecl-splash-page__language-list"> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="ar" hreflang="ar"><span class="ecl-splash-page__language-link-code">ar</span><span class="ecl-splash-page__language-link-label">عَرَبِيّ</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="ca" hreflang="ca"><span class="ecl-splash-page__language-link-code">ca</span><span class="ecl-splash-page__language-link-label">Català</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="is" hreflang="is"><span class="ecl-splash-page__language-link-code">is</span><span class="ecl-splash-page__language-link-label">Íslenska</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="lb" hreflang="lb"><span class="ecl-splash-page__language-link-code">lb</span><span class="ecl-splash-page__language-link-label">Lëtzebuergesch</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="ja" hreflang="ja"><span class="ecl-splash-page__language-link-code">ja</span><span class="ecl-splash-page__language-link-label">日本語</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="nb" hreflang="nb"><span class="ecl-splash-page__language-link-code">nb</span><span class="ecl-splash-page__language-link-label">Norsk bokmål</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="ru" hreflang="ru"><span class="ecl-splash-page__language-link-code">ru</span><span class="ecl-splash-page__language-link-label">русский язык</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="tr" hreflang="tr"><span class="ecl-splash-page__language-link-code">tr</span><span class="ecl-splash-page__language-link-label">Türkçe</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="uk" hreflang="uk"><span class="ecl-splash-page__language-link-code">uk</span><span class="ecl-splash-page__language-link-label">українська мова</span></a></li> <li class="ecl-splash-page__language-item"><a href="/example" class="ecl-link ecl-link--standalone ecl-splash-page__language-link" lang="zh" hreflang="zh"><span class="ecl-splash-page__language-link-code">zh</span><span class="ecl-splash-page__language-link-label">中文</span></a></li> </ul> </div> </div> </div> </div>
Try it yourself on the playground
Playground