| layout | title |
|---|---|
default |
Style guide |
Here are some color and grid examples. These colors can be used througout the site, but should not be all used side-by-side as seen here – pick a color for cards for a section and stick with it. Different color cards can be used on the same page, but should not appear side by side.
Now, let's use some filler text to illustrate an example of how these different color cards can sucsesfully be used on the same page. Meh kombucha pug crucifix, fixie authentic forage ugh neutra cray cornhole twee gluten-free. Try-hard echo park fanny pack, dreamcatcher next level meggings artisan. Franzen chicharrones farm-to-table trust fund. Leggings direct trade photo booth paleo ennui synth. Plaid pitchfork heirloom, cornhole hella tousled direct trade pop-up. IPhone austin direct trade, sartorial craft beer meh tofu. Umami tumblr hoodie migas yr kinfolk salvia, lumbersexual meditation gentrify master cleanse butcher banh mi man braid synth.
Ugh hammock everyday carry, banjo butcher cliche pinterest readymade tote bag tilde flexitarian disrupt. Locavore swag master cleanse +1, butcher intelligentsia humblebrag. Street art normcore squid, tacos shoreditch kickstarter direct trade. Tacos chartreuse 90's, wayfarers mustache meh jean shorts cliche pug kombucha normcore fanny pack ugh listicle. Butcher forage lumbersexual, small batch four dollar toast etsy PBR&B plaid fap tacos tofu. Everyday carry tilde raw denim intelligentsia, trust fund direct trade wolf mumblecore salvia venmo twee hashtag retro microdosing actually. Yuccie typewriter retro, squid whatever four loko food truck lumbersexual polaroid street art hoodie bitters hammock vegan art party.
Pop-up tofu chartreuse health goth cred jean shorts pug, hashtag seitan. Direct trade tousled migas lo-fi venmo, meggings normcore austin offal distillery keffiyeh vegan. PBR&B fanny pack everyday carry waistcoat, thundercats keffiyeh tilde master cleanse selvage jean shorts sartorial cornhole cred chambray. Kombucha microdosing narwhal seitan. Freegan occupy listicle, waistcoat portland lumbersexual polaroid microdosing hoodie deep v. Hashtag truffaut 90's, polaroid four loko meditation locavore shoreditch taxidermy PBR&B twee tofu offal. Truffaut sustainable celiac etsy paleo chartreuse fap everyday carry you probably haven't heard of them.
Kale chips affogato everyday carry, vinyl twee direct trade man braid venmo mumblecore forage literally portland meditation semiotics. Man bun gentrify fanny pack literally, PBR&B lomo forage bespoke chambray retro whatever messenger bag gluten-free. Meh trust fund tacos, normcore actually DIY fixie pug master cleanse banh mi heirloom asymmetrical. Kitsch kombucha bushwick craft beer, typewriter twee disrupt. Migas bitters food truck, disrupt normcore venmo fixie gastropub green juice. Twee swag cred intelligentsia franzen disrupt ethical, chambray neutra. Messenger bag lo-fi letterpress echo park.
Man bun ennui locavore kombucha. Intelligentsia humblebrag vegan pour-over photo booth farm-to-table pickled. Semiotics celiac portland, man braid gochujang shabby chic echo park iPhone mlkshk tote bag. Celiac kinfolk sriracha, seitan four dollar toast salvia cronut godard DIY chicharrones ennui mustache williamsburg. Butcher jean shorts portland letterpress pork belly bespoke. Photo booth pickled helvetica cold-pressed. Trust fund cornhole asymmetrical portland tofu.
Master cleanse PBR&B sartorial schlitz meggings, pour-over paleo marfa plaid mixtape chillwave. Photo booth 3 wolf moon PBR&B keffiyeh readymade meggings, forage you probably haven't heard of them intelligentsia cliche pork belly XOXO. Put a bird on it leggings messenger bag bushwick bespoke, cliche try-hard whatever keytar umami semiotics jean shorts. Retro whatever vinyl, 8-bit slow-carb wolf tousled freegan +1 gentrify street art. Deep v beard raw denim, fingerstache tumblr cronut portland twee blue bottle. Ethical butcher etsy bitters, narwhal wayfarers beard offal blog synth twee sustainable tilde. Pork belly seitan paleo, keffiyeh thundercats tote bag post-ironic portland biodiesel.
+1 chillwave tacos, mlkshk selvage wolf meditation trust fund cred disrupt taxidermy. Fixie kitsch tilde gluten-free, actually irony stumptown messenger bag scenester beard XOXO bicycle rights listicle cronut. Cardigan cold-pressed chia, butcher viral franzen synth celiac single-origin coffee fashion axe XOXO dreamcatcher distillery knausgaard. Farm-to-table craft beer locavore sriracha skateboard banjo. Yuccie tattooed mixtape, vice echo park everyday carry kickstarter cronut kinfolk banh mi banjo sartorial organic quinoa truffaut. Dreamcatcher swag small batch, occupy photo booth williamsburg microdosing. Offal lumbersexual selfies taxidermy.
You probably haven't heard of them sriracha chambray fashion axe leggings hammock. Mlkshk plaid etsy whatever. Hella irony squid cold-pressed gastropub crucifix synth. Synth church-key marfa single-origin coffee. Franzen flexitarian microdosing, photo booth food truck drinking vinegar blue bottle blog seitan shoreditch lomo brunch mustache small batch. Occupy humblebrag tattooed, locavore slow-carb pop-up ugh tofu lo-fi +1 sriracha. Readymade photo booth YOLO, plaid kogi raw denim schlitz church-key sustainable seitan fanny pack messenger bag everyday carry.
DIY gentrify craft beer whatever, farm-to-table ramps meh deep v XOXO pour-over. 8-bit knausgaard gastropub normcore, authentic gochujang truffaut quinoa whatever pickled heirloom ennui kombucha. Keffiyeh paleo put a bird on it cornhole mumblecore small batch. Schlitz drinking vinegar trust fund, chia bitters tofu cray. Whatever food truck cardigan heirloom, YOLO meh pitchfork bushwick health goth raw denim chicharrones crucifix organic thundercats skateboard. Food truck single-origin coffee poutine chartreuse. Cardigan try-hard polaroid actually trust fund.
Not sure about that red color – perhaps a bit too much. In any case, that is an example of how you can use more than one color card on the same page, just make sure they're not close enough that they'll be seen at the same time.
Sliders are used when you have a series of content chunks that make sense to go in sequential order. They save vertical space, and add a different dimension of interactivity to the site.
The slider will automatically adjust its height to fit the content of each slide, but try if you can to make the length of each slide relatively uniform – or at least try to eliminate greate discrepancies. Click to the next slide to see why.
DIY gentrify craft beer whatever, farm-to-table ramps meh deep v XOXO pour-over. 8-bit knausgaard gastropub normcore, authentic gochujang truffaut quinoa whatever pickled heirloom ennui kombucha. Keffiyeh paleo put a bird on it cornhole mumblecore small batch. Schlitz drinking vinegar trust fund, chia bitters tofu cray. Whatever food truck cardigan heirloom, YOLO meh pitchfork bushwick health goth raw denim chicharrones crucifix organic thundercats skateboard. Food truck single-origin coffee poutine chartreuse. Cardigan try-hard polaroid actually trust fund.
– Ben Fino-Radin, Associate Media Conservator, MoMAThis is what a blockquote looks like. These are useful for having in-line quotes, sometimes reffered to as "pull quotes". A quote needs to be at least two lines long, preferably a bit more – otherwise they look funny.
You can refer to the markdown file for this page, but here is the HTML that gives the quote citation it's style. As you can see, this is the same class used for image captions:
<span class="img-caption" markdown="1">
– Ben Fino-Radin, Associate Media Conservator, MoMA
</span>
This is what hyperlinks look like
- They look slightly bolder when they are in a bulleted list though
- For instance...