Layout 11: Swatch palette grid using minmax

Swatches generated from colors from the Santa Monica mountains

Layout 10: Santa Monica mountains color palettes

The grid uses widths and is nine columns. Some simple math to generate the various column widths.

Layout 9: grid-template-areas

Pretty simple layout, but I like how the grid-template-areas gives plenty of white space for the text to have some breathing room.

Layout 8: nth-of-type

Layout 7: Walt Disney Concert Hall

I like how this layout turned out. What is a simple grid offers visual interest.

Layout 6: Walt Disney Concert Hall

I like how this layout works across mobile, tablet and desktop. I think minmax is going to be a favorite layout friend.

Layout 5: Brown Pelican Mural

An unmistakable bird of coastal waters, groups of Brown Pelicans fly low over the waves in single file, flapping and gliding in unison. One of my favorite birds, I used kayak in Marina del Rey and paddle alongside them.

Layout 4: Santa Monica Pier

The Santa Monica Pier is a large double-jointed pier at the foot of Colorado Avenue in Santa Monica, California.

Layout 3: Westin Bonaventure Hotel

Today’s layout is of the iconic downtown hotel, the Bonaventure.

Layout 2: DTLA The Park

I first visited the Park at a CSS.la meetup on CSS Animations. While walking up to the workshop I took this photo.