No designer o

r
design softwa
re
required!

TABLE OF CONTENTS
ABOUT THE CTA BUTTONS 3
USING HEX COLORS & TIPS FOR CUSTOMIZING 5
7 SETS OF 27 CUSTOMIZABLE CTAs 10
HOW TO USE THESE CTAs 32
CONCLUSION 38
COLLECT CTA METRICS IN HUBSPOT 40

ABOUT THE CTA BUTTONS

We know that creating calls-to-action (CTAs) can be difficult with
limited tools. Even more difficult is the ability to track the success
of those CTAs.
Were here to help.
Here youll find a set of 27 customizable CTA designs that you can
use on any digital asset landing page, blog post, social media
updates, you name it.
The best part? You can then upload your customized CTAs into
the HubSpot CTA builder for free to start collecting
performance metrics. Yep, youll know how many people viewed,
and even better, how many people clicked on your call-to-action!
Beauty and data what could be better?

GRABBING YOUR COLOR HEX

CODES
As much as we'd love to, we can't create CTAs that match the
skin of every website -- unless, of course, your website just
happens to match the colors you find in here! But if you're like
most marketers (including us), you can customize the colors by
getting the HEX code of the main colors of your website, and
inputting it into PowerPoint.
A hex code is a 6-character alpha-numerical code that represents
a color. To grab the HEX codes for your website or blog, simply
take a screenshot of your website or blog, and then head over to
http://www.imagecolorpicker.com/.
Once there, upload that screenshot by clicking the Upload your
image button. Then select any point of the uploaded picture,
and immediately see its corresponding HEX code on the right!

PUTTING YOUR HEX CODES

IN POWERPOINT
Once the corresponding HEX code appears, youll need to
transfer that information to PowerPoint.
Go to Design Colors Create New Theme Colors. From there
youll be taken to a place that allows you to change the colors in
your color palate to match your brand.

PUTTING YOUR HEX CODES

IN POWERPOINT
Now, click any Accent option, and within the dropdown options
select More Colors
From there, make sure youre
on the Custom tab. Youll
see the option to input a
number for Red, Green,
and Blue. These are your
RGB colors that appear in the
HEX code generated on
imagecolorpicker.com.
Just add those generated
numbers here. Click OK and
voila! That color is now in your
palate. Keep going down the
accents until you have all the
colors you need.

2 QUICK TIPS FOR

CUSTOMIZING CTAs IN
POWERPOINT
Double clicking on any image, textbox, or shape
will open up various options for you to change the
appearance of the respective object -- whether that
be shading, colors, fills, outline, or styles. Be open to
playing around, and see what you discover!
When inserting images for your CTA, you might
find the image you selected has a white background,
while your CTA does not. To fix this, either give the
image a border, or use the transparent tool in your
toolbar. Simply click Transparent Color, and then
click the background of your image.

SET

Basic CTA Buttons

This first set of CTAs is perfect for a simple
landing page that needs a touch of color to
draw the viewers eye. Feel free to change
the shape type, the color (by doubleclicking), and the text by simply clicking in
the text box.

Download Template
Now
these
n
i
t
x
e
t
e the
eeds,
n
r
To chang
u
o
y
t
to mee
s
n
o
t
t
u
b
on the
e
c
n
o
k
c
i
l
ape,
h
s
simply c
e
h
t
e
hang
text! To c r, double click
olo
size, or c
pe.
a
h
s
e
h
t
on

REGISTER FOR
WEBINAR

SUBSCRIBE TO THIS BLOG FOR DAILY

UPDATES!

REGISTER FOR
INBOUND
CTA can
a
,
r
e
b
Remem
t calls
a
h
t
g
n
i
be anyth
act
o
t
l
a
u
d
i
iv
on an ind
s just

t
i
f
i
n
e
ev
em to
h
t
g
n
i
c
n
infue
tweet!

Click Here to
Tweet This
Offer to Your
Followers!

SET

CTAs in Speech Bubbles

Similar to the first set, these CTAs help spice
up your page and draw visitors eyes
with a pop of color and an interesting shape.
Their shapes also emphasize that visitors
are being called upon to perform an action.
Pun intended.

SIGN UP
FOR A FREE
HUBSPOT
TRIAL

ction
e
r
i
d
e the
g
bble
n
u
a
b
h
h
C
eec
p
s
e
h
t he
n
of t
o
g
g
ckin
by cli and movin
,
nd
shape low diamo
el
the y ur mouse.
o
with y

Grab Your
Coupon

Download Template
Now
Have a Sales
Rep Call You
to Chat About
HubSpots
CTA Tool

Share This on
Facebook

SET

Circle CTAs
This is another basic set of CTA buttons that
can be used on any color background, with
room for custom shapes and text. The
buttons are designed with a very subtle 3D
look to add some depth to your landing
pages.

Change th
e
style of yo
ur
fonts by
clicking on
the text bo
x,
and going
to
Format.

rent
e
ff
i
d
sing r
u
y
r
T
o
ows n these
d
a
h
i
s
ients g the
d
a
r
g
n
s usi tions in
e
l
c
r
i
c
op
t
a
m
For Point.
r
Powe

SET

CTAs with Pre-built Backgrounds

While the previous CTA options all provided
different variations of shapes and
backgrounds with customizable colors, this
set has pre-built backgrounds (so you cant
change the colors). These were made in
Photoshop and converted into image files so
that you can overlay custom text on them.

Download This Free

Template

Download This Free

Ebook

With
addW this CTA
init t
hais C, try
rectad ghsm
andging llerTA,
le om
t
squa
rere
r aller ry
ctsan s s
wg
to csq
rea
utaere itlhesteoxr
invitto
asnwit t
ing
crb
h te
ea
xt
t
u
e
invit
ttoa
n
n
.
i ng
butt
on .

se a
u
o
s
pe s
l
a
a
h
n
s
a
c
You
ustom TA.
c
f
o
C
ty
varie ce up the an
c
u
to spr rget, you fferent
fo
di
Dont und with
s to
e
p
o
a
r
h
fool a nts and s
, as
A
o
f
T
C
r
o
col
your
e
z
i
m
custo
well.

ape
h
s
a
k in g
a
m
Try
CTA
e
h
t
nt
within transpare
ly
g
slight ble clickin
u
by do ving the
o
l
and m rent scrol
pa
trans
tool.

Download This Free Ebook

Register For This Webinar

SET

Image Inclusive CTAs

Now that we have an amalgam of basic
shape + text combo CTAs, lets dive into
CTAs that are image inclusive from custom
images, to stock photography, to logos.
Remember, graphics make a CTA pop, and
help visually emphasize your offer.

g post, you
lo
b
a
f
o
d
n
e
e
th
t
A
content
re
o
m
re
a
sh
to
t
n
probably wa
help convert
to
ic
p
to
e
m
sa
e
about th
A, you might
T
C
is
th
r
o
F
.
rs
e
d
rea
an image of
g
in
s
u
h
it
w
t
n
e
m
experi
e basic
th
to
n
io
it
d
d
a
in
the offer
shapes and text.

101 Examples to Inspire Your CTA

Creation

As you customize CTAs in

this template, feel free to
check out 101 examples of
effective CTAs for further
inspiration.

DOWNLOAD NOW >>

drop
n
e
v
an e
c
u
any
o
p
Y
m
o
rc
in you add some
o
logo t anding to
r
nice b As logos
CT
o!
o
t
your
,
s
l
is u a
are v

WATCH A
DEMO
All-in-one
marketing
software.

JOIN A
USER GROUP
Learn More >

Add to Wish List

In this CTA,
we inserted
three images
(in this case,
covers of our
ebooks) and
used the
rotate tool to
align them
over one
another. Do
this by
clicking on
the picture
you insert by
going to
Insert
Picture, and
using the
green circle
that appears
on the image
to rotate it.

See HubSpots
all-in-one
marketing
software in
action.

WATCH A
DEMO

,
In this CTA
t ed
we elimina
s
this image
rd
original ha
ing
borders us
the soft
ol
edges to
under the
to
Format tab
give the
der
image bor
ok
a softer lo
this way, it
ore
appears m
naturally
within the
r
CTA, rathe
big
than as a
image
distracting
from your
text.

SET

CTAs with social media

sentiment
Now that youve learned how to incorporate
visuals into your CTAs, lets up your game
with some CTAs that leverage the power of
social proof just one more way to help
improve the conversion rates of your CTAs,
and generate more leads.

Essential Step-by-Step Guide to Internet

Marketing

ing
Try search
through
find
Twitter to
social
to
sentiment
up
help back
of
the value
your offer.
ple
When peo
see that
e
others hav
d
downloade
d
or retrieve
it
the offer,
infuences
o
them to d
so, too!

As you customize CTAs in this

template, feel free to check
out 101 examples of effective
CTAs for further inspiration.

DOWNLOAD NOW >>

this
The background of
gray
image is the same
ents
as Facebook comm
ep it
so feel free to ke
to
the same in order
blend your own
ts
Facebook commen
into it naturally!

Downloa
d Ebook
>>

If you pre
fer, you c
an also ad
publicly-p
d
osted com
ments to
your CTAs
to drive th
e same ty
of infuen
pe
ce from so
cial media
users.

HOW TO USE THESE CTAs

Now that youve gone through the 27 different customizable
buttons, its time to learn how to actually use the buttons you
end up customizing!
Step 1: For each CTA, click on every element associated with
it, as shown in this screenshot:

HOW TO USE THESE CTAs

Step 2: With each component still selected, right click, and
click Save as Picture

HOW TO USE THESE CTAs

Step 3, Option 1:
Start a free HubSpot
trial to upload these
images into the CTA
tool and start
collecting metrics
on performance
right away. You can
use the HubSpot
CTA tool to upload
your CTA, and then
simply paste the
embed code that is
generated into your
website.

HOW TO USE THESE CTAs

By uploading the image into
HubSpots CTA tool, you can go
back into HubSpot for free to see
data on how the CTA is
performing on your own
website. As long as it uses the
embed code generated from
HubSpot (as shown to the right)
you can collect metrics in the
HubSpot software such as the
conversion rate of views to clicks,
no matter where that CTA is
placed.

HOW TO USE THESE CTAs

Step 3, Option 2: If youre not interested in generating
specific performance metrics for your CTAs, upload the
images onto your website as you would any other image, and
then hyperlink the image to your CTA destination. And voila!
You now have one of these custom CTAs on your website.

CONCLUSION
CTAs play a major role in conversion. Whether that
conversion be from prospect to lead, or lead to customer,
CTAs drive action that benefits your business. Dont
undermine these important marketing tools with sloppy or
poorly thought-out design. Limited design capabilities should
never hurt your conversion rates. Thats why we built these
templates in the first place!
Now go customize, upload, and convert.

START COLLECTING DATA ON

YOUR CTA PERFORMANCE

Try HubSpots CTA tool to see which CTAs are

converting your visitors into leads for your business
all for free.

http://bitly.com/Try-CTA-Tool