fettepalette/dist/index.min.js

Color ramp generator using curves within the HSV color model

var fettepalette=(()=>{var V=Object.defineProperty;var I=Math.pow;var H=e=>V(e,"__esModule",{value:!0});var X=(e,t)=>{H(e);for(var r in t)V(e,r,{get:t[r],enumerable:!0})};var G={};X(G,{colorToCSS:()=>$,easingFunctions:()=>O,generateRandomColorRamp:()=>Y,generateRandomColorRampParams:()=>j,hsv2hsl:()=>y,hsv2hsx:()=>d,pointOnCurve:()=>C});var O={linear:e=>e,easeInSine:(e,t=0)=>1-Math.cos(e*Math.PI/2+t*Math.PI/2),easeOutSine:(e,t=0)=>Math.sin(e*Math.PI/2+t*Math.PI/2),easeInOutSine:(e,t=0)=>-(Math.cos(Math.PI*(e+t)/(1+2*t))-1)/2,easeInQuad:(e,t=0)=>e*e+t*e*(1-e),easeOutQuad:(e,t=0)=>1-(1-e)*(1-e)-t*e*(1-e),easeInOutQuad:(e,t=0)=>e<.5?2*e*e+t*e*(1-2*e):1-Math.pow(-2*e+2,2)/2-t*(2*e-1)*(1-Math.pow(-2*e+2,2)/2),easeInCubic:(e,t=0)=>e*e*e+t*e*e*(1-e),easeOutCubic:(e,t=0)=>1-Math.pow(1-e,3)-t*Math.pow(1-e,2)*(1-e),easeInOutCubic:(e,t=0)=>e<.5?4*e*e*e+t*e*e*(1-2*e):1-Math.pow(-2*e+2,3)/2-t*Math.pow(-2*e+2,2)*(2*e-1)/2,easeInQuart:(e,t=0)=>e*e*e*e+t*e*e*e*(1-e),easeOutQuart:(e,t=0)=>1-Math.pow(1-e,4)-t*Math.pow(1-e,3)*(1-e),easeInOutQuart:(e,t=0)=>e<.5?8*e*e*e*e+t*e*e*e*(1-2*e):1-Math.pow(-2*e+2,4)/2-t*Math.pow(-2*e+2,3)*(2*e-1)/2,easeInQuint:(e,t=0)=>e*e*e*e*e+t*e*e*e*e*(1-e),easeOutQuint:(e,t=0)=>1-Math.pow(1-e,5)-t*Math.pow(1-e,4)*(1-e),easeInOutQuint:(e,t=0)=>e<.5?16*e*e*e*e*e+t*e*e*e*e*(1-2*e):1-Math.pow(-2*e+2,5)/2-t*Math.pow(-2*e+2,4)*(2*e-1)/2,easeInExpo:(e,t=0)=>(e===0?0:Math.pow(2,10*e-10))+t*Math.pow(2,10*(e-1)),easeOutExpo:(e,t=0)=>(e===1?1:1-Math.pow(2,-10*e))-t*(1-Math.pow(2,-10*e)),easeInOutExpo:(e,t=0)=>e===0?0:e===1?1:e<.5?Math.pow(2,20*e-10)/2+t*Math.pow(2,20*e-10)/2:(2-Math.pow(2,-20*e+10))/2-t*(2-Math.pow(2,-20*e+10))/2,easeInCirc:(e,t=0)=>1-Math.sqrt(1-Math.pow(e,2))+t*Math.sqrt(1-Math.pow(e,2)),easeOutCirc:(e,t=0)=>Math.sqrt(1-Math.pow(e-1,2))-t*Math.sqrt(1-Math.pow(e-1,2)),easeInOutCirc:(e,t=0)=>e<.5?(1-Math.sqrt(1-Math.pow(2*e,2)))/2+t*(1-Math.sqrt(1-Math.pow(2*e,2)))/2:(Math.sqrt(1-Math.pow(-2*e+2,2))+1)/2-t*(Math.sqrt(1-Math.pow(-2*e+2,2))+1)/2,random:()=>Math.random()},g=Object.keys(O),y=(e,t,r,n=r-r*t/2,u=Math.min(n,1-n))=>[e,u?(r-n)/u:0,n],d=(e,t,r,n)=>n==="hsl"?y(e,t,r):[e,t,r],C=(e,t,r,n,u=[0,0],m=[1,1])=>{let w=Math.PI/2,h=w/r,o=t/r,s=0,a=0;if(e==="lam\xE9"){let p=o*w,b=2/(2+20*n),i=Math.cos(p),M=Math.sin(p);s=Math.sign(i)*I(Math.abs(i),b),a=Math.sign(M)*I(Math.abs(M),b)}else if(e==="arc")a=Math.cos(-Math.PI/2+t*h+n),s=Math.sin(Math.PI/2+t*h-n);else if(e==="pow")s=Math.pow(1-o,1-n),a=Math.pow(o,1-n);else if(e==="powY")s=Math.pow(1-o,n),a=Math.pow(o,1-n);else if(e==="powX")s=Math.pow(o,n),a=Math.pow(o,1-n);else if(typeof e=="function"){let p=e(o,n);s=p[0],a=p[1]}else if(g.includes(e))s=o,a=1-O[e](o,n*-1)||0;else throw new Error(`pointOnCurve() curveAccent parameter is expected to be "lam\xE9" | "arc" | "pow" | "powY" | "powX" or a function but \`${e}\` given.`);return s=u[0]+Math.min(Math.max(s,0),1)*(m[0]-u[0]),a=u[1]+Math.min(Math.max(a,0),1)*(m[1]-u[1]),[s,a]};function Y({total:e=3,centerHue:t=0,hueCycle:r=.3,offsetTint:n=.1,offsetShade:u=.1,curveAccent:m=0,tintShadeHueShift:w=.1,curveMethod:h="arc",offsetCurveModTint:o=.03,offsetCurveModShade:s=.03,minSaturationLight:a=[0,0],maxSaturationLight:p=[1,1],colorModel:b="hsl"}={}){let i=[],M=[],c=[];for(let l=1;l<e+1;l++){let[P,R]=C(h,l,e+1,m,a,p),f=(360+(-180*r+(t+l*(360/(e+1))*r)))%360,k=d(f,P,R,b);i.push(k);let[T,q]=C(h,l,e+1,m+o,a,p),S=d(f,T,q,b);M.push([(f+360*w)%360,S[1]-n,S[2]+n]);let[E,F]=C(h,l,e+1,m-s,a,p),Q=d(f,E,F,b);c.push([(360+(f-360*w))%360,Q[1]-u,Q[2]-u])}return{light:M,dark:c,base:i,all:[...M,...i,...c]}}var L={oklch:e=>[e[2],e[1]*.4,e[0]],lch:e=>[e[2]*100,e[1]*150,e[0]],hsl:e=>[e[0],e[1]*100+"%",e[2]*100+"%"]},$=(e,t="oklch")=>`${t}(${L[t](e).join(" ")})`,j={curveMethod:{default:"lam\xE9",props:{options:["lam\xE9","arc","pow","powY","powX",...g]}},curveAccent:{default:0,props:{min:-.095,max:1,step:.001}},total:{default:9,props:{min:3,max:35,step:1}},centerHue:{default:0,props:{min:0,max:360,step:.1}},hueCycle:{default:.3,props:{min:-1.25,max:1.5,step:.001}},offsetTint:{default:.01,props:{min:0,max:.4,step:.001}},offsetShade:{default:.01,props:{min:0,max:.4,step:.001}},tintShadeHueShift:{default:.01,props:{min:0,max:1,step:.001}},offsetCurveModTint:{default:.03,props:{min:0,max:.4,step:1e-4}},offsetCurveModShade:{default:.03,props:{min:0,max:.4,step:1e-4}},minSaturation:{default:0,props:{min:-.25,max:1,step:.001}},minLight:{default:0,props:{min:-.25,max:1,step:.001}},maxSaturation:{default:1,props:{min:0,max:1,step:.001}},maxLight:{default:1,props:{min:0,max:1,step:.001}}};return G;})();