- background-image: repeating-linear-gradient( calc(@pn(45deg, -45deg)), @multi(15, ( @p(#ED7B4E, #E3363A, #3B120E, #EDEED1, #4CAABE) calc(@n() * 100% / 15), @lp() calc((@n() + 1) * 100% / 15) )) );
- :container { transform: rotate(45deg) translate(-25%); will-change: transform; @size: 150%; } background-image: repeating-linear-gradient( @pd(120deg, -120deg), @multi(@calc(@size() * 2), ( @pd(#E3363A, #3B120E, #4CAABE, #ED7B4E, #EDEED1) calc(@n() * 100% / (@size() * 2)), @lp() calc((@n() + 1) * 100% / (@size() * 2)) )) );
- :container { transform: scale(2) rotateY(-45deg) rotate(-45deg); will-change: transform; } background: @multi(5, ( linear-gradient( @pd(#E3363A, #3B120E, #4CAABE, #ED7B4E, #EDEED1), @lp() ) 50% 50% / @pn(30%, 55%, 70%, 85%, 100%) @lp() no-repeat ));
- background-image: repeating-linear-gradient( @multi(@size(), ( @pd(#ED7B4E, #E3363A, #3B120E, #EDEED1, #4CAABE) calc((@n() - 1) * 100% / @size()), @lp() calc(@n() * 100% / @size()) )) ); background-size: 100% 80%; background-position: 0 calc(@i() * @i() * -100% / 80);
- --p: @pn(0 100%, 0 0, 100% 100%, 100% 0); background: @multi(5, ( linear-gradient(@p(#4CAABE, #EDEED1, #ED7B4E, #3B120E, #E3363A), @lp()) var(--p) / @pn(20%, 40%, 60%, 80%, 100%) @lp() no-repeat ))
- background: @multi(5, linear-gradient( -135deg, @p(#ED7B4E, #E3363A, #3B120E, #4CAABE) 50%, #EDEED1 50% )); background-size: 25% 25%, 25% 25%, 25% 25%, 50% 50%, 100% 100%; background-position: 66.66% 100%, 0 33.33%, 0 100%, 0 100%, 100% 0; background-repeat: no-repeat; transform: rotateY(@p(180deg, 0deg)) rotateX(@p(180deg, 0deg));
- :container { transform: rotate(45deg) scale(1.5); will-change: transform; } background: @multi(10, ( linear-gradient(@p(#E3363A, #3B120E, #4CAABE, #ED7B4E, #EDEED1), @lp()) 100% 100% / calc(@n() * 10%) calc(@n() * 10%) no-repeat ))
- transform: rotate(@p(45deg, -45deg)) scale(1.5); will-change: transform; background: linear-gradient( @p(#ED7B4E, #E3363A, #3B120E, #4CAABE) 50%, #EDEED1 50% ) 0 0 / 100% @r(10%, 100%);
- --s: @r(15%, 85%); --t: calc(100% - var(--s)); background: @multi(2, linear-gradient(@p(#ED7B4E, #E3363A, #3B120E, #4CAABE), @lp()) ); background-color: #EDEED1; background-size: var(--s) var(--s), var(--t) var(--t); background-position: 0 0, 100% 100%; background-repeat: no-repeat;
- background: @multi(2, ( linear-gradient( @p(45deg, -45deg), @multi(2, @p(#E3363A, #3B120E, #4CAABE, #ED7B4E, #EDEED1) 50%) ) @p(100% 100%, 0 100%, 100%, 0 0) / calc(@n() * 100% / 2) calc(@n() * 100% / 2) no-repeat ))
- margin: -20%; transform: rotate(@r(-2deg, 2deg)); mix-blend-mode: @p(color-burn, hard-light); background-blend-mode: @p(color-burn, hard-light); background: linear-gradient( @multi(2, @p(#ED7B4E, #E3363A, #3B120E, #4CAABE, #EDEED1) 50%) ); @random(.5) { background: linear-gradient(@p(#ED7B4E, #E3363A, #3B120E, #4CAABE, #EDEED1) 50%, transparent 50%) 0 0 / 100% @r(20%), linear-gradient( @multi(2, @p(#ED7B4E, #E3363A, #3B120E, #4CAABE, #EDEED1) 50%) ); }
- :container { transform: scale(2) rotateY(-45deg) rotate(-45deg); will-change: transform; } background: linear-gradient(45deg, @multi(2, @p(#ED7B4E, #E3363A, #3B120E, #4CAABE, #EDEED1) 50%) ); mix-blend-mode: @p(color-burn, screen); margin: -25%;