<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>double Archives - scmGalaxy</title>
	<atom:link href="https://www.scmgalaxy.com/tutorials/tag/double/feed/" rel="self" type="application/rss+xml" />
	<link>https://www.scmgalaxy.com/tutorials/tag/double/</link>
	<description>A Platform for Software Engineers</description>
	<lastBuildDate>Wed, 13 Apr 2022 16:34:28 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=7.1</generator>
	<item>
		<title>How to create a creative double face card hover effect &#038; creative expandable card effect using HTML &#038; CSS?</title>
		<link>https://www.scmgalaxy.com/tutorials/how-to-create-a-creative-double-face-card-hover-effect-creative-expandable-card-effect-using-html-css/</link>
					<comments>https://www.scmgalaxy.com/tutorials/how-to-create-a-creative-double-face-card-hover-effect-creative-expandable-card-effect-using-html-css/#respond</comments>
		
		<dc:creator><![CDATA[rajeshkumar]]></dc:creator>
		<pubDate>Thu, 09 Sep 2021 12:02:21 +0000</pubDate>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[card]]></category>
		<category><![CDATA[creative]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[double]]></category>
		<category><![CDATA[effect]]></category>
		<category><![CDATA[expandable]]></category>
		<category><![CDATA[face]]></category>
		<guid isPermaLink="false">https://www.scmgalaxy.com/tutorials/?p=8898</guid>

					<description><![CDATA[<p>In this blog, I am creating a creative double face card hover effect &#38; creative expandable card effect using HTML [&#8230;]</p>
<p>The post <a href="https://www.scmgalaxy.com/tutorials/how-to-create-a-creative-double-face-card-hover-effect-creative-expandable-card-effect-using-html-css/">How to create a creative double face card hover effect &#038; creative expandable card effect using HTML &#038; CSS?</a> appeared first on <a href="https://www.scmgalaxy.com/tutorials">scmGalaxy</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p class="wp-block-paragraph">In this blog, I am creating a creative double face card hover effect &amp; creative expandable card effect using <strong>HTML </strong>&amp; <strong>CSS</strong>. So, Let’s create an <strong>index.html &amp; style.css </strong>below-</p>



<script src="https://gist.github.com/ajcotocus/4476ef12486da09cf5043e7dc91c63d8.js"></script>



<script src="https://gist.github.com/ajcotocus/3a2ff98e987839ebd8a9511cfad19f9a.js"></script>



<figure class="wp-block-image size-full"><img fetchpriority="high" decoding="async" width="562" height="364" src="https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-52.png" alt="" class="wp-image-8899" srcset="https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-52.png 562w, https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-52-300x194.png 300w" sizes="(max-width: 562px) 100vw, 562px" /><figcaption>creative double face card hover effect before hover</figcaption></figure>



<figure class="wp-block-image size-full"><img decoding="async" width="705" height="642" src="https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-53.png" alt="" class="wp-image-8900" srcset="https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-53.png 705w, https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-53-300x273.png 300w" sizes="(max-width: 705px) 100vw, 705px" /><figcaption>creative double face card hover effect after hover</figcaption></figure>



<script src="https://gist.github.com/ajcotocus/035bd73cd26a19642baf0fcb7f22b039.js"></script>



<script src="https://gist.github.com/ajcotocus/8120d6a03668e758c6433ab5bd28ccd0.js"></script>



<figure class="wp-block-image size-full"><img decoding="async" width="719" height="538" src="https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-54.png" alt="" class="wp-image-8901" srcset="https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-54.png 719w, https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-54-300x224.png 300w" sizes="(max-width: 719px) 100vw, 719px" /><figcaption>creative expandable card effect before hover</figcaption></figure>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="770" height="764" src="https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-55.png" alt="" class="wp-image-8902" srcset="https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-55.png 770w, https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-55-300x298.png 300w, https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-55-150x150.png 150w, https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-55-768x762.png 768w" sizes="auto, (max-width: 770px) 100vw, 770px" /><figcaption>creative expandable card effect after hover</figcaption></figure>



<script src="https://gist.github.com/ajcotocus/03d649214aa8aaa00d181b89b97a2404.js"></script>



<script src="https://gist.github.com/ajcotocus/fa3001450024e36146a4b902fee2eab4.js"></script>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="545" height="531" src="https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-56.png" alt="" class="wp-image-8903" srcset="https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-56.png 545w, https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-56-300x292.png 300w" sizes="auto, (max-width: 545px) 100vw, 545px" /><figcaption>creative layered card hover effect before hover</figcaption></figure>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="672" height="606" src="https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-57.png" alt="" class="wp-image-8904" srcset="https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-57.png 672w, https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-57-300x271.png 300w" sizes="auto, (max-width: 672px) 100vw, 672px" /><figcaption>creative layered card hover effect after hover</figcaption></figure>



<script src="https://gist.github.com/ajcotocus/d5a1cbb13ea33aa5ce99876ff7b51a6e.js"></script>



<script src="https://gist.github.com/ajcotocus/fd7adf4e732ef2067a1234ac1d208b5d.js"></script>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="546" height="625" src="https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-59.png" alt="" class="wp-image-8906" srcset="https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-59.png 546w, https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-59-262x300.png 262w" sizes="auto, (max-width: 546px) 100vw, 546px" /><figcaption>creative scaling card effect before hover</figcaption></figure>



<figure class="wp-block-image size-full"><img loading="lazy" decoding="async" width="493" height="614" src="https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-58.png" alt="" class="wp-image-8905" srcset="https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-58.png 493w, https://www.scmgalaxy.com/tutorials/wp-content/uploads/2021/09/image-58-241x300.png 241w" sizes="auto, (max-width: 493px) 100vw, 493px" /><figcaption>creative scaling card effect after hover</figcaption></figure>
<p>The post <a href="https://www.scmgalaxy.com/tutorials/how-to-create-a-creative-double-face-card-hover-effect-creative-expandable-card-effect-using-html-css/">How to create a creative double face card hover effect &#038; creative expandable card effect using HTML &#038; CSS?</a> appeared first on <a href="https://www.scmgalaxy.com/tutorials">scmGalaxy</a>.</p>
]]></content:encoded>
					
					<wfw:commentRss>https://www.scmgalaxy.com/tutorials/how-to-create-a-creative-double-face-card-hover-effect-creative-expandable-card-effect-using-html-css/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
