Skip to content

Commit 166000e

Browse files
committed
another pattern
1 parent a3f586c commit 166000e

File tree

1 file changed

+15
-1
lines changed

1 file changed

+15
-1
lines changed

index.html

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@
2727
<h1><span>C</span><span>S</span><span>S</span> Pattern</h1>
2828
<p>powered by CSS gradients</p>
2929
<h2>the biggest collection of background Patterns</h2>
30-
<p>Explore 133 CSS-only patterns made with CSS gradients and optimized with CSS variables.</p>
30+
<p>Explore 134 CSS-only patterns made with CSS gradients and optimized with CSS variables.</p>
3131
</header>
3232
<script async src="https://media.ethicalads.io/media/client/ethicalads.min.js"></script>
3333
<div class="adaptive" data-ea-publisher="css-challengescom" id="css-pattern" data-ea-type="text" data-ea-style="fixedfooter"></div>
@@ -2314,6 +2314,20 @@ <h2>the biggest collection of background Patterns</h2>
23142314
0 0/calc(2*var(--s)) calc(2*var(--s));
23152315
background-blend-mode: difference;
23162316
}
2317+
</style><button>Copy the CSS</button>
2318+
</section>
2319+
<section id="g134">
2320+
<style>#g134 {
2321+
--s: 60px; /* control the size */
2322+
2323+
--g1:conic-gradient(at 37.5% 87.5%,#0000 75%,#53777A 0);
2324+
--g2:conic-gradient(at 12.5% 62.5%,#0000 75%,#CFF09E 0);
2325+
background:
2326+
var(--g2) calc( var(--s)/4) calc( var(--s)/4),
2327+
var(--g2) calc(5*var(--s)/4) calc(5*var(--s)/4),
2328+
var(--g1),var(--g1) var(--s) var(--s) #CFF09E;
2329+
background-size: calc(2*var(--s)) calc(2*var(--s));
2330+
}
23172331
</style><button>Copy the CSS</button>
23182332
</section>
23192333
<section>

0 commit comments

Comments
 (0)