alert--smallalertarchive--smallarchivearrow-left--smallarrow-leftarrow-right--smallarrow-rightblock--smallblockcalendar--smallcalendarcamera--smallcameracheck--smallcheck-circle--smallcheck-circlecheckchevron-down--smallchevron-downchevron-left--smallchevron-leftchevron-right--smallchevron-rightchevron-up--smallchevron-upclock--smallclock-arrow--smallclock-arrowclockcog--smallcogconversation--smallconversationcopy--smallcopycreditcard--smallcreditcardcross--smallcross-circle--smallcross-circlecrossdownload--smalldownloadedit--smalleditexport--smallexportexternal-facebookexternal-facebookboxedexternal-flickrexternal-gmailexternal-instagramexternal-linkedinexternal-mediumexternal-messenger-outlined--smallexternal-messenger-outlinedexternal-outlookexternal-tumblrexternal-twitter-outlined--smallexternal-twitter-outlinedexternal-twitterexternal-yahooexternal-youtubefilter--smallfilterfolder--smallfolderglobe--smallglobegroups--smallgroupsheart--smallheart-outline--smallheart-outlinehearthide--smallhidehome--smallhomeinfo--smallinfoinvite--smallinvitelaunch-new-window--smalllaunch-new-windowlink--smalllinklocation-pin--smalllocation-pin-slashed--smalllocation-pin-slashedlocation-pinlocation-services--smalllocation-serviceslock--smalllockmail--smallmailmeetup-m--smallmeetup-mmessages--smallmessagesminus--smallminusnotifications--smallnotifications-badged--smallnotifications-badgednotifications-mute--smallnotifications-mutenotificationsoverflow--smalloverflowphoto-album--smallphoto-album-add--smallphoto-album-addphoto-albumplus--smallplus-circle--smallplus-circleplusprofile--smallprofilepulse--smallpulserefresh--smallrefreshreply--smallreplysearch--smallsearchsend--smallsendsent-messages--smallsent-messagesshow--smallshowstar--smallstartextblock--smalltextblockticket--smalltickettrash--smalltrashupdates--smallupdates

Layout

We have a set of responsive layout components to design and build with. On top of handling general layout concerns (e.g. creating columns, separating regions of the page, etc.), layout components create consistent spacing between content.

Designers are encouraged to experiment with layouts to suit whatever content they’re designing for—these components and concepts are simply a baseline. Our layout components are designed to make it simple for engineers to quickly put together a responsive page layout with consistent spacing.

Layout components, exploded view Layout components, exploded view

Page layed out using layout components Page layed out using layout components

Give feedback

If this page is missing something or if you'd like to make an edit, you can:

  • open a PR in the Swarm Design System repo
  • file a ticket in JIRA
  • send us a message in the #design-systems Slack channel in Meetup's Slack team
Meetup home

Last updated Jan 01 2018, 6:00 PM