color: #999;

.footer-media-links {

background: #e8345a; /* a more sedated version of pink-a400 */

padding: 20px;

}

.footer-media-links a {

color: black;

display: inline-block;

padding: 3px 20px;

font-size: 13px;

font-weight: 500;

text-shadow: none;

text-decoration: none;

text-align: center;

min-width: 100px;

white-space: nowrap;

}

.footer-media-links a span {

line-height: 24px;

margin-left: 5px;

}

background: #263238; /* blue-grey-900 */

color: white;

color: #979797;

background: black;

color: white;

<section class="footer-media-links">

<div class="layout horizontal center center-justified">

<a href="http://plus.google.com/107187849809354688692/" title="Follow +polymer on Google+" aria-label="Follow polymer on Google+">

<iron-icon icon="social-icons:gplus"></iron-icon>

<span>Polymer</span></a>

<a href="https://twitter.com/intent/follow?screen_name=polymer" title="Follow @polymer on Twitter" aria-label="Follow polymer on Twitter">

<iron-icon icon="social-icons:twitter"></iron-icon>

<span>@Polymer</span>

</a>

<a href="https://github.com/polymer" title="Get the Polymer code on GitHub" aria-label="Get the Polymer code on GitHub">

<iron-icon icon="social-icons:github"></iron-icon>

<span>/Polymer</span>

</a>

<a href="https://polymer-slack.herokuapp.com/" title="Join the Polymer slack channel" aria-label="Join the Polymer slack channel">

<iron-icon icon="social-icons:slack"></iron-icon>

<span>Slack Channel</span>

</a>

<a href="https://stackoverflow.com/questions/tagged/polymer" title="StackOverflow questions tagged Polymer" aria-label="StackOverflow questions tagged Polymer">

<iron-icon icon="social-icons:so"></iron-icon>

<span>Stack Overflow</span>

</a>

</div>

</section>

<div class="title">Getting Started</div>

<a href="/2.0/start/first-element/intro">Your first element</a>

<a href="/2.0/start/toolbox/set-up">Your first app</a>

<a href="/2.0/docs/tools/overview">Using the tools</a>

</div>

<div class="flex">

<div class="title">Polymer Docs</div>

<a href="/2.0/docs/api/">Polymer 2.x API Reference</a>

<a href="/2.0/docs/devguide/feature-overview">Polymer 2.x Guides</a>

<a href="/1.0/docs/devguide/feature-overview">Polymer 1.x Guides</a>

</div>

<div class="flex">

<div class="title">App Toolbox</div>

<a href="/2.0/toolbox/index">Overview</a>

<a href="/2.0/toolbox/case-study">App Case Study</a>

</div>

<div class="flex">

<div class="title">Blog</div>

<a href="/blog/">Articles</a>

<a href="https://www.youtube.com/playlist?list=PLNYkxOF6rcIDdS7HWIC_BYRunV6MHs5xo">Polycasts</a>

<div class="title">Community</div>

<a href="/community/">Resources</a>

<a href="https://www.webcomponents.org/">Element Catalog</a>

&copy; 2017 Polymer Authors.

<span class="additional-text">Code Licensed under the BSD License. Documentation licensed under CC BY 3.0.<span>

<h1>Polymer library</h1>

<a href="https://github.com/Polymer/lit-element/blob/master/README.md" class="blue-button flex">lit-element</a>

<a href="https://github.com/Polymer/pwa-starter-kit/blob/master/README.md" class="blue-button flex">PWA Starter Kit</a>

<a href="https://github.com/material-components/material-components-web-components/blob/master/README.md" class="blue-button flex">Material Web Components</a>

<section class="library light">

<div class="section-columns">

<div class="flex">

<h2 class="underline">About the Polymer Project</h2>

<div class="flex">

<p>As a team of front-end engineers embedded in the Chrome team, our mission is to make the web better, by helping developers unlock the web’s full potential and by spurring the web platform to evolve and improve.</p>

<p>We work on libraries, tools and patterns to help developers build modern Progressive Web Apps, taking advantage of cutting-edge features like Web Components, Service Workers and HTTP/2.</p>

<p>We also participate in the standards process, doing our part to ensure that front-end developers have a strong voice in the evolution of the platform.</p>

</div>

<a href="/about" class="blue-button">More About the Project</a>

</div>

<div class="flex">

<h2 class="underline">Why Web Components?</h2>

<div class="flex">

<p>Web Components are the web platform's native solution for component-based development.</p>

<p>With Web Components, you can create reusable custom elements that interoperate seamlessly with the browser’s built-in elements, or break your app up into right-sized pieces, making your code cleaner and less expensive to maintain.</p>

<p>Our products sprinkle a bit of sugar over the standard Web Components APIs and shine a light on best practices for building elements and apps, making it easier for you to get great results.</p>

</div>

<a href="https://webcomponents.org" class="blue-button">More about Web Components</a>

</div>

</div>

</section>

<section class="grey gradient-light page-index-logos">

<div>

<h2>Who's using Polymer products</h2>

<div class="page-index-partners layout horizontal wrap spaced">

<img src="/images/partners/bbva.png" alt="BBVA logo">

<img src="/images/partners/Coca-Cola.png" alt="Coca Cola logo">

<img class="logo-embiggen" src="/images/partners/Comcast.png" alt="Comcast logo">

<img src="/images/partners/google.png" alt="Google logo">

<img class="logo-embiggen" src="/images/partners/ING.png" alt="ING logo">

<img class="logo-emsmallen" src="/images/partners/net-a-porter.png" alt="Net-a-porter logo">

<img class="logo-embiggen" style="margin:0 10px;" src="/images/partners/USA-Today.png" alt="USA-Today logo">

</div>

</div>

</section>

<div>Polymer products <a href="/3.0/docs/browsers">work in all major browsers</a> (Chrome, Firefox, IE, Edge, Safari, and Opera).</div>