Generador de gradientes CSS

:root { --colorInner: {{colorInner}}; --colorOuter: {{colorOuter}}; --colorUI: {{colorUI}}}; }

img:is([sizes="auto" i]){contain-intrinsic-size:3000px 1500px;}.wp-site-blocks > .alignleft{float:left;margin-right:2em;}.wp-site-blocks > .alignright{float:right;margin-left:2em;}.wp-site-blocks > .aligncenter{justify-content:center;margin-left:auto;margin-right:auto;}:where(.wp-site-blocks) > *{margin-block-start:24px;margin-block-end:0;}:root :where(.is-layout-flow) > :first-child{margin-block-start:0;}:root :where(.is-layout-flow) > :last-child{margin-block-end:0;}:root :where(.is-layout-flow) > *{margin-block-start:24px;margin-block-end:0;}:root :where(.is-layout-constrained) > :first-child{margin-block-start:0;}:root :where(.is-layout-constrained) > :last-child{margin-block-end:0;}:root :where(.is-layout-constrained) > *{margin-block-start:24px;margin-block-end:0;}:root :where(.is-layout-flex){gap:24px;}:root :where(.is-layout-grid){gap:24px;}.is-layout-flow > .alignleft{float:left;margin-inline-start:0;margin-inline-end:2em;}.is-layout-flow > .alignright{float:right;margin-inline-start:2em;margin-inline-end:0;}.is-layout-flow > .aligncenter{margin-left:auto !important;margin-right:auto !important;}.is-layout-constrained > .alignleft{float:left;margin-inline-start:0;margin-inline-end:2em;}.is-layout-constrained > .alignright{float:right;margin-inline-start:2em;margin-inline-end:0;}.is-layout-constrained > .aligncenter{margin-left:auto !important;margin-right:auto !important;}.is-layout-constrained > .alignwide{max-width:var(--wp--style--global--wide-size);}body .is-layout-flex{display:flex;}.is-layout-flex{flex-wrap:wrap;align-items:center;}.is-layout-flex > :is(*,div){margin:0;}body .is-layout-grid{display:grid;}.is-layout-grid > :is(*,div){margin:0;}:root :where(.wp-element-button,.wp-block-button__link){background-color:#32373c;border-width:0;color:#fff;font-family:inherit;font-size:inherit;line-height:inherit;padding:calc(.667em + 2px) calc(1.333em + 2px);text-decoration:none;}.has-black-color{color:var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-color{color:var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-color{color:var(--wp--preset--color--white) !important;}.has-pale-pink-color{color:var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-color{color:var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-color{color:var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-color{color:var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-color{color:var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-color{color:var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-color{color:var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-color{color:var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-color{color:var(--wp--preset--color--vivid-purple) !important;}.has-black-background-color{background-color:var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-background-color{background-color:var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-background-color{background-color:var(--wp--preset--color--white) !important;}.has-pale-pink-background-color{background-color:var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-background-color{background-color:var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-background-color{background-color:var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-background-color{background-color:var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-background-color{background-color:var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-background-color{background-color:var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-background-color{background-color:var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-background-color{background-color:var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-background-color{background-color:var(--wp--preset--color--vivid-purple) !important;}.has-black-border-color{border-color:var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-border-color{border-color:var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-border-color{border-color:var(--wp--preset--color--white) !important;}.has-pale-pink-border-color{border-color:var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-border-color{border-color:var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-border-color{border-color:var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-border-color{border-color:var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-border-color{border-color:var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-border-color{border-color:var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-border-color{border-color:var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-border-color{border-color:var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-border-color{border-color:var(--wp--preset--color--vivid-purple) !important;}.has-vivid-cyan-blue-to-vivid-purple-gradient-background{background:var(--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple) !important;}.has-light-green-cyan-to-vivid-green-cyan-gradient-background{background:var(--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan) !important;}.has-luminous-vivid-amber-to-luminous-vivid-orange-gradient-background{background:var(--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange) !important;}.has-luminous-vivid-orange-to-vivid-red-gradient-background{background:var(--wp--preset--gradient--luminous-vivid-orange-to-vivid-red) !important;}.has-very-light-gray-to-cyan-bluish-gray-gradient-background{background:var(--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray) !important;}.has-cool-to-warm-spectrum-gradient-background{background:var(--wp--preset--gradient--cool-to-warm-spectrum) !important;}.has-blush-light-purple-gradient-background{background:var(--wp--preset--gradient--blush-light-purple) !important;}.has-blush-bordeaux-gradient-background{background:var(--wp--preset--gradient--blush-bordeaux) !important;}.has-luminous-dusk-gradient-background{background:var(--wp--preset--gradient--luminous-dusk) !important;}.has-pale-ocean-gradient-background{background:var(--wp--preset--gradient--pale-ocean) !important;}.has-electric-grass-gradient-background{background:var(--wp--preset--gradient--electric-grass) !important;}.has-midnight-gradient-background{background:var(--wp--preset--gradient--midnight) !important;}.has-small-font-size{font-size:var(--wp--preset--font-size--small) !important;}.has-medium-font-size{font-size:var(--wp--preset--font-size--medium) !important;}.has-large-font-size{font-size:var(--wp--preset--font-size--large) !important;}.has-x-large-font-size{font-size:var(--wp--preset--font-size--x-large) !important;}:root :where(.wp-block-pullquote){font-size:1.5em;line-height:1.6;}.e-con.e-parent:nth-of-type(n+4):not(.e-lazyloaded):not(.e-no-lazyload),.e-con.e-parent:nth-of-type(n+4):not(.e-lazyloaded):not(.e-no-lazyload) *{background-image:none !important;}@media screen and (max-height: 1024px){.e-con.e-parent:nth-of-type(n+3):not(.e-lazyloaded):not(.e-no-lazyload),.e-con.e-parent:nth-of-type(n+3):not(.e-lazyloaded):not(.e-no-lazyload) *{background-image:none !important;}.e-con.e-parent:nth-of-type(n+3):not(.e-lazyloaded):not(.e-no-lazyload).nitro-lazy,.e-con.e-parent:nth-of-type(n+3):not(.e-lazyloaded):not(.e-no-lazyload) *.nitro-lazy{background-image:none !important;}}@media screen and (max-height: 640px){.e-con.e-parent:nth-of-type(n+2):not(.e-lazyloaded):not(.e-no-lazyload),.e-con.e-parent:nth-of-type(n+2):not(.e-lazyloaded):not(.e-no-lazyload) *{background-image:none !important;}.e-con.e-parent:nth-of-type(n+2):not(.e-lazyloaded):not(.e-no-lazyload).nitro-lazy,.e-con.e-parent:nth-of-type(n+2):not(.e-lazyloaded):not(.e-no-lazyload) *.nitro-lazy{background-image:none !important;}}.e-con.e-parent:nth-of-type(n+4):not(.e-lazyloaded):not(.e-no-lazyload).nitro-lazy,.e-con.e-parent:nth-of-type(n+4):not(.e-lazyloaded):not(.e-no-lazyload) *.nitro-lazy{background-image:none !important;}button:hover{color:#fff !important;background-color:unset !important;}input{background-color:transparent !important;}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;}input[type=range]{margin:0;width:20vmin;}input[type=range]:focus{outline:none;}input[type=range]::-webkit-slider-runnable-track{width:100%;height:1.4vmin;cursor:pointer;animate:.2s;background:transparent;color:transparent;border-radius:0;border:solid var(--colorInner);border-width:0 0 1px;}input[type=range]::-webkit-slider-thumb{position:relative;z-index:1;font-size:1.9vmin;border-radius:50%;border-bottom-left-radius:0;width:1em;height:1em;background-color:var(--colorInner);box-shadow:0 0 0 .1em var(--colorUI);-webkit-transition:200ms box-shadow linear;transition:200ms box-shadow linear;cursor:pointer;-webkit-appearance:none;transform:translateY(-.8em) rotate(-45deg);}input[type=range]::-moz-range-track{width:100%;height:1.4vmin;cursor:pointer;animate:.2s;background:transparent;color:transparent;border-radius:0;border:solid var(--colorInner);border-width:0 0 1px;}input[type=range]::-moz-range-thumb{position:relative;z-index:1;font-size:1.9vmin;border-radius:50%;border-bottom-left-radius:0;width:1em;height:1em;background-color:var(--colorInner);box-shadow:0 0 0 .1em var(--colorUI);-moz-transition:200ms box-shadow linear;transition:200ms box-shadow linear;cursor:pointer;-webkit-appearance:none;transform:translateY(-.8em) rotate(-45deg);}input[type=range]::-ms-track{width:100%;height:1.4vmin;cursor:pointer;animate:.2s;background:transparent;color:transparent;border-radius:0;border:solid var(--colorInner);border-width:0 0 1px;}input[type=range]::-ms-fill-lower{background:var(--colorUI);-ms-transition:200ms background-color linear;transition:200ms background-color linear;border:none;border-radius:100%;}input[type=range]::-ms-fill-upper{background:var(--colorUI);-ms-transition:200ms background-color linear;transition:200ms background-color linear;border-radius:100%;box-shadow:none;}input[type=range]::-ms-thumb{position:relative;z-index:1;font-size:1.9vmin;border-radius:50%;border-bottom-left-radius:0;width:1em;height:1em;background-color:var(--colorInner);box-shadow:0 0 0 .1em var(--colorUI);-ms-transition:200ms box-shadow linear;transition:200ms box-shadow linear;cursor:pointer;-webkit-appearance:none;transform:translateY(-.8em) rotate(-45deg);}.gradient{transition:200ms box-shadow linear;}.gradient__text{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);}.gradient ::before{transition:200ms background-color linear;}.gradient__text{line-height:1.6;text-align:center;width:20vmin;font-size:1.9vmin;color:var(--colorInner);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;margin-top:8vmin;}.gradient__text strong{display:block;margin-bottom:.5em;}.gradient__text.pouf-enter-active,.gradient__text.pouf-leave-active{opacity:1;transition:opacity .3s linear,transform .4s cubic-bezier(.7,.3,0,1);}.gradient__text.pouf-enter,.gradient__text.pouf-leave-to{opacity:0;transform:translate(-50%,-75%);transform-origin:50% 0%;}.picker .ellipse{opacity:0;}.picker__svg{stroke-width:15;overflow:auto;width:100%;height:100%;transform:scale(.925);}.picker--inner .ellipse{transform:translate(2px,2px) scale(.98);}.pointer,.pointer__marker{pointer-events:none;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:57vmin;height:57vmin;}.pointer{cursor:move;width:100%;height:100%;}.pointer__marker{width:51.6vmin;height:51.6vmin;}.pointer__marker::before,.pointer__marker::after{content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);}.pointer__marker::before{height:5vmin;width:.1rem;background:var(--colorUI);transition:200ms background-color linear;}.pointer__marker::after{background:currentColor;border-radius:50%;transform:translateX(-50%) rotate(-45deg);border-bottom-left-radius:0;font-size:1.9vmin;margin-top:-.5em;width:1em;height:1em;box-shadow:0 0 0 .1rem var(--colorUI);transition:200ms box-shadow linear;}.pointer--lower .pointer__marker{margin-top:-.7rem;}.pointer--lower .pointer__marker::before{box-shadow:0 0 0 .6rem var(--colorUI);transition:200ms box-shadow linear;width:.7rem;border-radius:100%;}.pointer--lower .pointer__marker::after{display:none;}.title{position:absolute;top:50%;left:0;right:0;text-align:center;font-size:.8em;margin-top:-6vmin;}.ratio{z-index:2;position:absolute;pointer-events:auto;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;text-shadow:0 0 .5em var(--colorUI);transition:200ms text-shadow linear;}.ratio__label{display:none;font-size:.7rem;text-align:center;margin-bottom:.5em;}.gradientval{display:none;}.actions--up .actions__button{transform:translateY(-8vmin);transition:340ms transform cubic-bezier(.8,.3,.5,1.2);}.actions--up .actions__button:nth-child(1){transition-delay:100ms;transform:translate(-3.5vmin,-8vmin);}.actions--up .actions__button:nth-child(2){transition-delay:170ms;}.actions--up .actions__button:nth-child(3){transition-delay:240ms;transform:translate(3.5vmin,-8vmin);}.actions--up .actions__button:nth-child(4){transition-delay:250ms;}.button{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;}.button:hover svg{transform:scale(1);}.button:hover .button__text{opacity:1;transform:translateX(50%);}.button__text{pointer-events:none;transition:transform 200ms,opacity 100ms;transition-delay:100ms,100ms;}.button svg{transition:100ms transform ease-out;}.app--uianimate .controls{transition:444ms transform ease-in-out 200ms;will-change:transform;}.app--uianimate .gradient::before{transition:444ms transform ease-in-out 100ms;will-change:transform;}.app--uihide .controls{transform:translate(-50%,-50%) scale(0);}.app--uihide .gradient::before{transform:translate(-50%,-50%) scale(0);}

Legal

Herramientas

Páginas

Contacto