The Call to Action Component
The Call to Action component has three basic styles, each with some customizable options. Each style can be wide, spanning the width of the viewport, or full, spanning the full width of the content area. The Simple sytle has an additional Narrow alignment, which spans the width of the Narrow content region on desktop devices.
In addition, each style can be displayed in three different colors: Black, Gray and White.
CTA: Simple
Align Wide
CTA Simple Align Wide Black
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA Simple Align Wide White
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA Simple Align Wide Gray
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
Align Full
CTA Simple Align Full Black
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA Simple Align Full White
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA Simple Align Full Gray
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
Align Narrow
CTA Simple Align Narrow Black
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA Simple Align Narrow White
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA Simple Align Narrow Gray
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA: Image
The CTA Image style can be presented on either the right or left, full or wide, and in any of the three color options.
Align Wide
CTA Image Title Lorem Ipsum Dolor Sit Amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA Image Title Lorem Ipsum Dolor Sit Amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA Image Title Lorem Ipsum Dolor Sit Amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
Align Full
CTA Image Title Lorem Ipsum Dolor Sit Amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA Image Title Lorem Ipsum Dolor Sit Amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA Image Title Lorem Ipsum Dolor Sit Amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA: Double
The CTA Double-style allows two CTAs in the same component, and you can choose your color combination
Align Wide
CTA Image Title Lorem Ipsum Dolor Sit Amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA Image Title Lorem Ipsum Dolor Sit Amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA Image Title Lorem Ipsum Dolor Sit Amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA Image Title Lorem Ipsum Dolor Sit Amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
Align full
CTA Image Title Lorem Ipsum Dolor Sit Amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA Image Title Lorem Ipsum Dolor Sit Amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA Image Title Lorem Ipsum Dolor Sit Amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!
CTA Image Title Lorem Ipsum Dolor Sit Amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint iste atque ad aspernatur, fugiat commodi temporibus distinctio non excepturi autem quae corporis voluptatem sequi explicabo est! Aut veritatis adipisci atque!