Headline displays short phrases of text prominently centered on the screen. It is a full-screen responsive template across device modes that works with header, footer, and background responsive components.

Layouts Package

The design recommendations in the guide reference the Layouts Package, which is an additional set of properties that you will need to import to use responsive components in your skill. Check out Alexa Layouts Package for more information.

An example of two hub devices a headline saying Ask for the Space Image of the Day from the NASA archives with hint text in the footer on the default background dark blue color.

How to use the headline template

A headline can be made up of primary and secondary content. Primary content consists of up to two lines of text across the screen and should emphasize the main action or focus of the skill content at that particular moment for the customer. Secondary content is limited to one line and should be presented after primary content. Any secondary text will be truncated for smaller device modes.

For example, a headline is great for a welcome message. “Welcome to Pizza Delivery! Let’s get you a pizza, pronto.” Your hint text could tell the customer how to order a pizza: “Just say ‘pepperoni pizza’ or another ingredient to get started.”

Best practices

  • Keep your headlines to primary text only, if possible. Your headlines should be concise enough to describe the main action or content of the skill at that moment without being overly verbose and difficult to read.
  • Secondary text should only be used if the action or content is complex in nature and a supporting statement is needed. Keep in mind that secondary text will usually be truncated and vital information should not be presented as secondary text.

Additional resources