san francisco symphony logo
Pattern Library

content blade component


IMAGES:

We recommend a minimum image width of 768px for this component.

RULES & DEPENDENCIES:

This component will have fields for:

  • background color: can be white, gray, dark, primary or secondary (optional, the default is white)
  • title: (optional)
  • image: (optional)
  • alternative image text: (optional, but highly recommended)
  • video: iframe url for vimeo or youtube (optional)
  • alignment: aligns the image or video and can be set to left or right (optional, the default is left)
  • cta text: text for the button (optional, but required if link is given)
  • link: url for the button (optional, but required if cta is given)
  • content: (optional)

EXAMPLES:

Default (white) style:

learn more

Gray style:

This is a link to learn more.

Dark style:

learn more

Primary color style:

learn more

Secondary color style:

learn more