Is Github rolling out flat design?

almost 7 years ago from

Today, I just noticed that Github removes gradients in some design parts especially in Top Navigation.


  • Mark Otto, almost 7 years ago

    Hi, GitHub designer/developer here.

    Yup, we removed the header gradients, a bunch of the text and box shadows, swapped out some icons, moved a few things around, and simplified our search bar. All in the name of focus and simplicity and thinking through the future styles of the site.

    I wouldn't say we're "rolling out flat design", but whenever we feel something is superfluous, we're going to remove it (or improve it). In this case, the header felt cramped and quite full with the added noise of the content and visual effects we were using.

    So, we nuked it.

    Sure, it's flat, but the idea isn't to make everything flat. Things that are more interactive—buttons—should maintain their tactile feel and affordance. Things like headers, alerts, and the like should be lightweight and let the content shine.

    The big thing with GitHub is that our content can range from Markdown-formatted text to code of all different languages. The diffs and blobs for those files can be super heavy and complicated to look at. Removing visual clutter is a huge part of making that stuff faster (to serve and use) and easier to work with.

    Hope that helps. Don't hesitate to ask more questions here or to me on Twitter or GitHub.

    15 points
    • Cihad TurhanCihad Turhan, almost 7 years ago (edited almost 7 years ago )

      Question: How do you publish new version? What is your method to remove old cache in the browser?

      And yeah, welcome aboard :)

      0 points
      • Mark Otto, almost 7 years ago

        We deploy dozens of times every day. Every deploy invalidates the old CSS and issues a new versioned bundle of CSS, so there's not caching to deal with on our end save for the CDN we serve from. However, since the CSS is versioned, there's nothing to remove in the browser.

        1 point
  • Marc EdwardsMarc Edwards, almost 7 years ago

    Just the header today, I think: https://twitter.com/mdo/status/501895751316680706

    2 points
  • Clay MacTavishClay MacTavish, almost 7 years ago (edited almost 7 years ago )

    No, they be rolling out @mdo

    0 points
  • Paulo TeixeiraPaulo Teixeira, almost 7 years ago

    great change but still have gradients on buttons

    0 points
  • Thibault MaekelberghThibault Maekelbergh, almost 7 years ago

    Seems like it, the icons got a new place in the header too. They changed some of the grey gradients to flat too.

    0 points