Image – SVG

[TS-VCSC-Icon-Title title=”Images with SVG Overlay” align=”center” font_family=”Default:regular” size=”48″ font_weight=”300″ highlight_allow=”true” highlight_color=”#2691bd” highlight_strings=”U1ZHJTJDJTIwT3ZlcmxheQ==” el_file1=”” el_file2=””][TS_VCSC_Fancy_List list_type=”image” marker_image=”http://tekanewascripts.com/composium/wp-content/plugins/ts-visual-composer-extend/images/bullets/bullet_arrow_blue.png”]

  • 5 SVG shape combinations
  • Apply grayscale effect to image
  • Open image in lightbox or link to another page
  • Link only button or whole element
  • Apply tooltip to element to show full content
  • Define colors for SVG background, title, text and button

[/TS_VCSC_Fancy_List]

[TS-VCSC-Spacer height=”20″]
[TS_VCSC_Image_SVG image=”17947″ grayscale=”false” text_title=”SVG Shape 1″ text_content=”I’m an abstract rose pattern.” text_button=”Click Me!” lightbox_social=”false”]
[TS_VCSC_Image_SVG image=”17950″ style=”imagesvg2″ grayscale=”false” text_title=”SVG Shape 2″ text_content=”It’s a sunny day out there!” text_button=”Click Me!” lightbox_social=”false”]
[TS_VCSC_Image_SVG image=”17943″ style=”imagesvg3″ grayscale=”false” text_title=”SVG Shape 3″ text_content=”A Phoenix rises from the ashes!” text_button=”Click Me!” lightbox_social=”false”]
[TS-VCSC-Spacer height=”20″]
[TS_VCSC_Image_SVG image=”17946″ style=”imagesvg4″ grayscale=”false” text_title=”SVG Shape 4″ text_content=”After the storm, there will be a rainbow!” text_button=”Click Me!” lightbox_social=”false”]
[TS_VCSC_Image_SVG image=”17941″ style=”imagesvg5″ grayscale=”false” text_title=”SVG Shape 5″ text_content=”After the storm, there will be a rainbow!” text_button=”Click Me!” lightbox_social=”false”]

Grayscale Effect

[TS-VCSC-Divider divider_border_thick=”2″][TS_VCSC_Image_SVG image=”18013″ text_title=”Grayscale Filter” text_content=”This image has a CSS3 grayscale effect!” text_button=”Click Me!” lightbox_social=”false”]