Skip to content
ECL - Europa Component Library
JavaScript CSS Other
Branch: v2-dev
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.
.github docs: update getting started and contribution guide - no issue (#1264) Aug 19, 2019
docs docs: fix typo in - no issue (#1305) Sep 25, 2019
examples chore: prepare release of ECL 2.12.0 (#1336) Oct 10, 2019
patches chore: update dependencies - INNO-1811 (#1302) Sep 24, 2019
scripts fix(drone): fix website deployment - INNO-1731 (#1257) Aug 16, 2019
src docs: update content - no issue Oct 17, 2019
.browserslistrc feat(browserslist): update config and display browsers list - INNO-17… Aug 8, 2019
.drone.yml chore(ci): keep build size in check - INNO-958 (#1271) Aug 23, 2019
.editorconfig chore(release): prepare next release - no-issue (#527) Dec 15, 2017
.eslintignore chore: update dependencies - no issue (#1141) Jun 3, 2019
.eslintrc.js chore: update dependencies - no issue (#1317) Oct 2, 2019
.gitattributes chore(repo): push initial commit Jan 30, 2017
.gitignore chore: rename storybook folder into playground - INNO-1486 (#1123) May 14, 2019
.nvmrc fix(react-warnings): fix React warnings - INNO-1292 (#963) Nov 28, 2018
.prettierignore chore: update dependencies - no issue (#1141) Jun 3, 2019
.prettierrc chore(release): prepare next release - no-issue (#527) Dec 15, 2017
.size-limit.json feat(breadcrumb-harmonised): add component - INNO-1817 (#1340) Oct 11, 2019
.stylelintignore chore(eslint): lint JSX files - no issue (#819) Sep 24, 2018
.stylelintrc.js chore(deps): update dependencies - no issue (#769) Aug 15, 2018 chore: prepare release of ECL 2.12.0 (#1336) Oct 10, 2019
LICENSE chore(licence): add a licence Jan 31, 2017 docs: update sri hashes Oct 10, 2019 docs(developer): update developers documentation for v2 - INNO-1277 (#… Dec 12, 2018
lerna.json chore: prepare dev Oct 10, 2019
netlify.toml feat: export to codepen - INNO-1646 (#1217) Aug 1, 2019
package.json feat(site-header-harmonised): add component - INNO-1813 (#1328) Oct 10, 2019
yarn.lock chore: update dependencies - no issue (#1317) Oct 2, 2019

ECL v2 - Europa Component Library

Build Status code style: prettier lerna Netlify Status

The Europa Component Library (ECL) is a library of components applicable to all European Commission websites (hosted under domain). The library contains all available components which you can use to build your website.

The Digital Transformation team (DTT) - a cross European Commission team led by DGs COMM, DIGIT, and DTT - is the owner of this library.

All library elements are accompanied with

  • documentation: what the component is intended for and recommendations regarding its usage
  • demo: visual representation of the component
  • code: technologically agnostic HTML/CSS code for implementation


Read the technical documentation on GitHub.

Quick start

The ECL is bundled in various presets in order to accomodate the different needs of everyone. Once you know which preset you want to use, you can:

  • download the latest release of the preset of your choice

  • install the preset with npm or yarn, e.g. npm install @ecl/ec-preset-website or yarn add @ecl/ec-preset-website

  • use the CDN, https://cdn{1,2,3 or 4}{tag}/{preset}/{path/to/the/asset}. Here's an example:

      integrity="sha256-/sT3apQa2GaJ8o90vDVyVYWCWQrbgLnquOuwe0CSwZA= sha384-SjVsHwST5vXRVSO++I64bmZ67ABq3C0mcyDNLBWt1Y9OD2z/dkj2pX+c2+Y/FMUE sha512-hfyL0S0E3Qo4/wJ8cxiEhi7l1yYNSq4/u5YRMTdEjPa5/MAB1clSqPHtgTI3YtnOdq4ewu3BkmGcd4VI9S1IUg=="
      integrity="sha256-Jc39hPNlJbxo7m5wO7Fb23BfT4VX1PYMi6/fxIKsHCc= sha384-GNmYY8w7ypnny808T8ZPnm5TLMoMd8ADObKPZ2gRRCW967JrMqDmpsHF3k0i/XJQ sha512-Xit5gQZktqSPrucMNwVTHKcJcGyFbrP7F1oMihQDJ9dDdrZALnw1LrUcxCyD+Kb5SE27DfBwLzPLnortfZytyQ=="
      integrity="sha256-rXNGwt2MQ1k+n9CvL7I13sWakQl5t7gJhYKseynWX90= sha384-ajZqQ5o0363ZcwzjJ1vV0yEKaO6gzWAlD6L3O7m7iqBJPnddrQezp5oorZ1/SlpX sha512-R5maBtyEu0xkD1sOzT7AfB1sHXGWyKQth0WPUm7+qz+iwG2PFu/XDBOBxm9N52/PbjvgVQKM0pj2wfoJMvHj7w=="

Need help?

Please contact COMM Europa Management for support on using this resource for a European Commission website.

Previous major versions

You can’t perform that action at this time.