Buttons

[tm_textblock textarea_html_bkg_color=”#ffffff”]

Buttons can be styled in a variety of ways to achieve the look required by using a combination of size classes, background color/border-color, text color classes, border style classes and icons.

[/tm_textblock]

[tm_divider border_color=”#dddddd”]
[tm_textblock textarea_html_bkg_color=”#ffffff”]

Button Sizes

[/tm_textblock]

[tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ button_label=”Small Button” display_inline=”true” button_size=”small” border_style=”rounded” bkg_color=”#232323″ bkg_color_hover=”#000000″ border_color=”#232323″ border_color_hover=”#000000″ label_color=”#ffffff” label_color_hover=”#ffffff”][tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ button_label=”Medium Button” display_inline=”true” border_style=”rounded” bkg_color=”#232323″ bkg_color_hover=”#000000″ border_color=”#232323″ border_color_hover=”#000000″ label_color=”#ffffff” label_color_hover=”#ffffff”][tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ button_label=”Large Button” display_inline=”true” button_size=”large” border_style=”rounded” bkg_color=”#232323″ bkg_color_hover=”#000000″ border_color=”#232323″ border_color_hover=”#000000″ label_color=”#ffffff” label_color_hover=”#ffffff”][tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ button_label=”xLarge Button” display_inline=”true” button_size=”xlarge” border_style=”rounded” bkg_color=”#232323″ bkg_color_hover=”#000000″ border_color=”#232323″ border_color_hover=”#000000″ label_color=”#ffffff” label_color_hover=”#ffffff”]
[tm_textblock textarea_html_bkg_color=”#ffffff”]

Button With Icons

[/tm_textblock]

[tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ icon_id=”tm-entypo-icon-app-store” button_label=”AppStore” display_inline=”true” button_size=”large” border_style=”rounded” bkg_color=”#232323″ bkg_color_hover=”#ffffff” border_color=”#232323″ border_color_hover=”#232323″ label_color=”#ffffff” label_color_hover=”#232323″ is_scroll_link=”true”][tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ icon_id=”tm-entypo-icon-google-play” button_label=”GooglePlay” display_inline=”true” button_size=”large” border_style=”rounded” bkg_color=”#232323″ bkg_color_hover=”#ffffff” border_color=”#232323″ border_color_hover=”#232323″ label_color=”#ffffff” label_color_hover=”#232323″][tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ icon_id=”tm-entypo-icon-dribbble” button_label=”I’m On Dribbble” display_inline=”true” button_size=”large” border_style=”rounded” bkg_color=”#ea4c89″ bkg_color_hover=”#ffffff” border_color=”#ea4c89″ border_color_hover=”#ea4c89″ label_color=”#ffffff” label_color_hover=”#ea4c89″][tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ icon_id=”tm-entypo-icon-facebook” button_label=”Share On Facebook” display_inline=”true” button_size=”large” border_style=”rounded” bkg_color=”#3b5998″ bkg_color_hover=”#ffffff” border_color=”#3b5998″ border_color_hover=”#3b5998″ label_color=”#ffffff” label_color_hover=”#3b5998″][tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ icon_id=”tm-entypo-icon-twitter” button_label=”I’m On Twitter” display_inline=”true” button_size=”large” border_style=”rounded” bkg_color=”#00aced” bkg_color_hover=”#ffffff” border_color=”#00aced” border_color_hover=”#00aced” label_color=”#ffffff” label_color_hover=”#00aced”]
[tm_textblock textarea_html_bkg_color=”#ffffff”]

Button Variations

[/tm_textblock]

[tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ button_label=”With Shadow” display_inline=”true” drop_shadow=”true” button_size=”large” bkg_color=”#3fb58b” bkg_color_hover=”#ffffff” border_color=”#3fb58b” border_color_hover=”#3fb58b” label_color=”#ffffff” label_color_hover=”#3fb58b”][tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ button_label=”Rounded Corners” display_inline=”true” button_size=”large” border_style=”rounded” bkg_color=”#3fb58b” bkg_color_hover=”#ffffff” border_color=”#3fb58b” border_color_hover=”#3fb58b” label_color=”#ffffff” label_color_hover=”#3fb58b”][tm_button margin_bottom=”10″ button_label=”Pill Shaped” display_inline=”true” button_size=”large” border_style=”pill” bkg_color=”#3fb58b” bkg_color_hover=”#ffffff” border_color=”#3fb58b” border_color_hover=”#3fb58b” label_color=”#ffffff” label_color_hover=”#3fb58b”][tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ icon_id=”tm-entypo-icon-location” button_label=”Pill with Icon” display_inline=”true” button_size=”large” border_style=”pill” bkg_color=”#3fb58b” bkg_color_hover=”#ffffff” border_color=”#3fb58b” border_color_hover=”#3fb58b” label_color=”#ffffff” label_color_hover=”#3fb58b”][tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ icon_id=”tm-entypo-icon-right-circled” button_label=”Icon on the Right” display_inline=”true” icon_alignment=”right” button_size=”large” border_style=”rounded” bkg_color=”#3fb58b” bkg_color_hover=”#ffffff” border_color=”#3fb58b” border_color_hover=”#3fb58b” label_color=”#ffffff” label_color_hover=”#3fb58b”]
[tm_textblock textarea_html_bkg_color=”#ffffff”]

AppĀ Buttons

[/tm_textblock]

[tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ icon_id=”tm-entypo-icon-app-store” button_type=”app” button_label=”AppStore” link_url=”#” display_inline=”true” button_size=”large” border_style=”rounded” bkg_color=”#232323″ bkg_color_hover=”#ffffff” border_color=”#232323″ border_color_hover=”#999999″ label_color=”#ffffff” label_color_hover=”#666666″ button_sub_label=”Download on The”][tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ icon_id=”tm-entypo-icon-google-play” button_type=”app” button_label=”PlayStore” link_url=”#” display_inline=”true” button_size=”large” border_style=”rounded” bkg_color=”#232323″ bkg_color_hover=”#ffffff” border_color=”#232323″ border_color_hover=”#999999″ label_color=”#ffffff” label_color_hover=”#666666″ button_sub_label=”Download on The”][tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ icon_id=”tm-entypo-icon-download” button_type=”app” button_label=”FireFly” link_url=”#” display_inline=”true” button_size=”large” border_style=”rounded” bkg_color=”#232323″ bkg_color_hover=”#ffffff” border_color=”#232323″ border_color_hover=”#999999″ label_color=”#ffffff” label_color_hover=”#666666″ button_sub_label=”Get Version 1.0.2″][tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ icon_id=”tm-entypo-icon-upload-to-cloud” button_type=”app” button_label=”Upload Now” link_url=”#” display_inline=”true” button_size=”large” border_style=”rounded” bkg_color=”#232323″ bkg_color_hover=”#ffffff” border_color=”#232323″ border_color_hover=”#999999″ label_color=”#ffffff” label_color_hover=”#666666″ button_sub_label=”Cloud Storage”]
[tm_textblock textarea_html_bkg_color=”#ffffff”]

Button Actions

[/tm_textblock]

[tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ button_label=”Page in New Tab” link_url=”https://www.google.com” link_target=”_blank” display_inline=”true”][tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ link_to=”lightbox” lightbox_toolbar_zoom_button=”true” lightbox_toolbar_share_buttons=”true” lightbox_caption=”Vimeo Video Caption” video_vimeo_id=”169675730″ button_label=”Lightbox Vimeo Button” display_inline=”true” video_url_parameters=”autoplay=1″][tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ link_to=”lightbox” media_type=”youtube” lightbox_toolbar_zoom_button=”true” lightbox_toolbar_share_buttons=”true” lightbox_caption=”YouTube Video Caption” video_youtube_id=”8tYqsJzE6OY” button_label=”Lightbox YouTube Button” display_inline=”true” video_url_parameters=”autoplay=1″][tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ link_to=”modal” button_label=”Modal Button” modal_target=”2883″ display_inline=”true”][tm_button margin_bottom=”10″ margin_bottom_mobile=”10″ link_to=”scroll” button_label=”Scroll to Section Button” link_url=”#intro” scroll_offset=”0″ display_inline=”true”]