index.html

---
layout: default
title: Twitter Open Source
description: Twitter Open Source Website
keywords: twitter, open, source, open source, finatra, finagle, scala
url: https://opensource.twitter.com
custom_css: index.css
custom_js: index.js
---

<!-- Header -->

<div class="header home-header">
    <div class="Grid container">
        <div id="header-text" class="Grid-cell u-size7of8">
            <h1 class="subheading">
                <a href="https://twitter.com/TwitterOSS" target="_blank">@TwitterOSS</a>
            </h1>
            <h1 class="large-title">Open Source is Happening</h1>
        </div>
    </div>
</div>

<!-- #OurPhilosophy -->

<div class="section grey">
    <div class="Grid container">
        <div id="philosophy-text" class="Grid-cell u-size4of6 u-before1of6 u-after1of6">
            <h1 class="small-title center-text mega-margin">#OurPhilosophy</h1>
            <p class="center-text mega-margin">For anything to grow, you need three things:</p>
        </div>
    </div>
    <div class="Grid small-container">
        <div class="Grid-cell u-size1of3 emoji-card">
            <img src="assets/fire.png" alt="Fire emoji" class="emoji-img center-margin large-margin">
            <h1 class="center-text medium-margin">Heat</h1>
            <p class="center-text">Heat means work.<br/>Upstream contributions, bug fixes, designs, docs--the rigorous work that drives the community.</p>
        </div>

        <div class="Grid-cell u-size1of3 emoji-card">
            <img src="assets/sun.png" alt="Sun emoji" class="emoji-img center-margin large-margin">
            <h1 class="center-text medium-margin">Light</h1>
            <p class="center-text">Light means visibility. <br/>For the projects, contributions, opportunities, challenges, and people that impact the community.</p>
        </div>

        <div class="Grid-cell u-size1of3 emoji-card">
            <img src="assets/pride.png" alt="Pride heart emoji" class="emoji-img center-margin large-margin">
            <h1 class="center-text medium-margin">Love</h1>
            <p class="center-text">Love means culture and support.<br/>Why we care. How we work. Actions that grow the community.</p>
        </div>

    </div>
</div>

<!-- Explore Projects -->

<div class="section explore-projects">
    <div class="Grid container">
        <div class="Grid-cell left-text u-size5of12 u-after1of12">
            <h1 class="small-title mega-margin">Explore Projects</h1>
            <p class="mega-margin">Twitter has been built on open source since the beginning. Openness is part of our DNA. The projects you see here were born at Twitter, and patches are always welcome!</p>
            <button onclick="location.href='projects.html'" type="button" class="Button Button--large">View All Projects</button>
        </div>
        <div class="Grid-cell explore-projects-blank"></div>
    </div>
</div>

<!-- Follow Us @TwitterOSS -->

<div class="grey section">
    <div class="Grid container">
        <!-- The heading "Follow Us @TwitterOSS" is inserted with Javascript -->
        <div id="open-source-timeline" class="Grid-cell timeline-cell u-size1of2">
            <a class="twitter-timeline" data-height="700px" href="https://twitter.com/TwitterOSS?ref_src=twsrc%5Etfw">Tweets by TwitterOSS</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
        </div>
    </div>
</div>

<!-- Join the Flock -->

<div class="section">
    <div class="Grid container">
        <div id="career-text" class="Grid-cell left-text u-size5of12 u-after1of12 same-mega-margin">
            <h1 class="small-title mega-margin career-title">Join the Flock</h1>
            <p class="mega-margin">We are always on the lookout for innovative and creative individuals who are passionate about building a platform where all voices can be heard.</p>
            <button onclick="window.open('https://careers.twitter.com')" type="button" class="Button Button--large">View All Careers</button>
        </div>
        <div class="Grid-cell timeline-cell u-size1of2">
            <a class="twitter-timeline" data-height="700px" data-partner="tweetdeck" href="https://twitter.com/TwitterOSS/timelines/1028044487681925121?ref_src=twsrc%5Etfw">#TwitterOSSJobs - Curated tweets by TwitterOSS</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
        </div>
    </div>
</div>