Skip to content

Commit 53cb420

Browse files
committed
another pattern
1 parent e8fd6c3 commit 53cb420

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 136 CSS-only patterns made with CSS gradients and optimized with CSS variables.</p>
30+
<p>Explore 137 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>
@@ -2359,6 +2359,20 @@ <h2>the biggest collection of background Patterns</h2>
23592359
var(--c1) 0);
23602360
background-size: var(--s) var(--s);
23612361
}
2362+
</style><button>Copy the CSS</button>
2363+
</section>
2364+
<section id="g137">
2365+
<style>#g137 {
2366+
--s: 90px; /* control the size */
2367+
--c:#DDD9AB;
2368+
2369+
--g:#0000 calc(125%/3),var(--c) 0 calc(175%/3),#0000 0;
2370+
--p:calc(var(--s)/2) calc(var(--s)/2)/calc(2*var(--s)) calc(2*var(--s));
2371+
background:
2372+
radial-gradient(var(--c) 34%,#0000 36%) 0 0/var(--s) var(--s),
2373+
linear-gradient( 45deg,var(--g)) var(--p),
2374+
linear-gradient(-45deg,var(--g)) var(--p) #E5625C;
2375+
}
23622376
</style><button>Copy the CSS</button>
23632377
</section>
23642378
<section>

0 commit comments

Comments
 (0)