CTA design
Before implementing a Call to Action (CTA) on your website or application, we recommend reviewing Instacart's button design guidelines.
Button design guidelines
CTA buttons should be round, with Instacart’s:
- Branded logo.
- Color scheme.
- Font usage.
- Padding, and spacing.
- Dark
- Light
- White
- Button Height: 46px
- Button Width: Dynamic based on Text
- Button Text: “Get Recipe Ingredients”
- Logo Size: 22px
- Padding Vertical: 16px
- Padding Horizontal: 18px
- Background Color: #003D29
- Foreground Text Color: #FAF1E5
- Foreground Full Color Logo (#FF7009 & #0AAD0A)
- Stroke Color: N/A
- Stroke Weight: N/A
- Button Height: 46px
- Button Width: Dynamic based on Text
- Button Text: “Get Recipe Ingredients”
- Logo Size: 22px
- Padding Vertical: 16px
- Padding Horizontal: 18px
- Background Color: #FAF1E5
- Foreground Text Color: #003D29
- Foreground Full Color Logo (#FF7009 & #0AAD0A)
- Stroke Color: #EFE9E1
- Stroke Weight: 0.5px
- Button Height: 46px
- Button Width: Dynamic based on Text
- Button Text: “Get Recipe Ingredients”
- Logo Size: 22px
- Padding Vertical: 16px
- Padding Horizontal: 18px
- Background Color: #FFFFFF
- Foreground Text Color: #000000
- Foreground Full Color Logo (#FF7009 & #0AAD0A)
- Stroke Color: #E8E9EB
- Stroke Weight: 0.5px