Spline3D Viewer

<!-- wp:heading {"textAlign":"center"} -->
<h2 class="wp-block-heading has-text-align-center" id="spline-viewer-for-greenshift"><spline-viewer> for Greenshift</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Easily embed your 3d Spline scenes into your website directly in Gutenberg editor and use special Smart loader feature without degrading your web vitals score. </p>
<!-- /wp:paragraph -->

<!-- wp:greenshift-blocks/container {"id":"gsbp-eb0637dd-de92","inlineCssStyles":null,"flexbox":{"type":"grid","enable":false,"gridcolumns":[2,null,null,1],"columngap":[20],"rowgap":[20]},"spacing":{"margin":{"values":{"bottom":[30]},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}}} -->
<div class="wp-block-greenshift-blocks-container gspb_container gspb_container-gsbp-eb0637dd-de92" id="gspb_container-id-gsbp-eb0637dd-de92"><!-- wp:greenshift-blocks/container {"id":"gsbp-4e937d87-9dc2","inlineCssStyles":null,"rowspan":[],"columnspan":[],"columnStart":[],"columnEnd":[],"rowStart":[],"rowEnd":[],"alignSelf":[],"flexGrow":[],"flexShrink":[],"flexBasis":[],"flexBasisCustom":[],"flexGrowHover":[],"flexShrinkHover":[],"flexBasisHover":[],"flexBasisCustomHover":[],"flexGrowFocus":[],"flexShrinkFocus":[],"flexBasisFocus":[],"flexBasisCustomFocus":[],"order":[],"flexbox":{},"animation":{"duration":700,"easing":"ease","type":""},"background":{},"overlay":{},"border":{"borderRadius":{"values":{},"unit":"px","locked":true}},"spacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"shadow":{},"typography":{},"position":{"positionType":["","","",""],"positions":{"values":{}}},"shapeDivider":{"topShape":{},"bottomShape":{}},"responsive":{},"csstransform":{},"carousel":{"arrowPos":[null,null,null,null],"arrowSize":[null,null,null,null],"arrowPosV":[null,null,null,null]},"imageBorder":{"borderRadius":{"values":{},"unit":"px","locked":true}},"imageShadow":{},"blockWidth":{"customWidth":{"value":[],"unit":["px","px","px","px"]},"customHeight":{"value":[],"unit":["px","px","px","px"]}},"minHeightUnit":["px","px","px","px"],"width":[],"widthUnit":["%"],"minHeight":[]} -->
<div class="wp-block-greenshift-blocks-container gspb_container gspb_container-gsbp-4e937d87-9dc2" id="gspb_container-id-gsbp-4e937d87-9dc2"><!-- wp:greenshift-blocks/button {"id":"gsbp-6768dd77-30a0","inlineCssStyles":null,"buttonContent":"Test Greenshift Loader on Google","align":"center","background":{"backgroundState":"Gradient","gradient":"linear-gradient(to top right,var(\u002d\u002dwp\u002d\u002dpreset\u002d\u002dcolor\u002d\u002dsecondary) 0%,var(\u002d\u002dwp\u002d\u002dpreset\u002d\u002dcolor\u002d\u002dprimary) 100%)"},"backgroundCook":{},"panelBackground":{},"overlay":{},"spacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"panelSpacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"panelSpacingInner":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"iconSpacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"border":{"borderRadius":{"values":{},"unit":"px","locked":true}},"borderCook":{"borderRadius":{"values":{},"unit":"px","locked":true}},"panelBorder":{"borderRadius":{"values":{},"unit":"px","locked":true}},"blockWidth":{"customWidth":{"value":["100%"],"unit":["px","px","px","px"]},"customHeight":{"value":[],"unit":["px","px","px","px"]},"widthType":"custom"},"shadow":{},"panelShadow":{},"typography":{"textShadow":{},"alignment":["center"]},"typographyCook":{},"animation":{"duration":700,"easing":"ease","type":""},"responsive":{},"position":{"positionType":["","","",""],"positions":{"values":{}}},"csstransform":{},"buttonLink":"https://pagespeed.web.dev/analysis/https-greenshiftwp-com-spline3d-viewer/8ws83k25kr?form_factor=mobile","linkNewWindow":true,"iconBox_icon":{"icon":{"font":"rhicon rhi-paper-plane","svg":"","image":""},"fill":"#2184f9","fillhover":"#2184f9","type":"font"},"typographyLabel":{}} -->
<div class="wp-block-greenshift-blocks-button gspb_button_wrapper gspb_button-id-gsbp-6768dd77-30a0" id="gspb_button-id-gsbp-6768dd77-30a0"><a class="gspb-buttonbox" href="https://pagespeed.web.dev/analysis/https-greenshiftwp-com-spline3d-viewer/8ws83k25kr?form_factor=mobile" target="_blank" rel="noopener"><span class="gspb-buttonbox-textwrap"><span class="gspb-buttonbox-text"><span class="gspb-buttonbox-title">Test Greenshift Loader on Google</span></span></span></a></div>
<!-- /wp:greenshift-blocks/button --></div>
<!-- /wp:greenshift-blocks/container -->

<!-- wp:greenshift-blocks/container {"id":"gsbp-04e1715a-a04e","inlineCssStyles":null,"rowspan":[],"columnspan":[],"columnStart":[],"columnEnd":[],"rowStart":[],"rowEnd":[],"alignSelf":[],"flexGrow":[],"flexShrink":[],"flexBasis":[],"flexBasisCustom":[],"flexGrowHover":[],"flexShrinkHover":[],"flexBasisHover":[],"flexBasisCustomHover":[],"flexGrowFocus":[],"flexShrinkFocus":[],"flexBasisFocus":[],"flexBasisCustomFocus":[],"order":[],"flexbox":{},"animation":{"duration":700,"easing":"ease","type":""},"background":{},"overlay":{},"border":{"borderRadius":{"values":{},"unit":"px","locked":true}},"spacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"shadow":{},"typography":{},"position":{"positionType":["","","",""],"positions":{"values":{}}},"shapeDivider":{"topShape":{},"bottomShape":{}},"responsive":{},"csstransform":{},"carousel":{"arrowPos":[null,null,null,null],"arrowSize":[null,null,null,null],"arrowPosV":[null,null,null,null]},"imageBorder":{"borderRadius":{"values":{},"unit":"px","locked":true}},"imageShadow":{},"blockWidth":{"customWidth":{"value":[],"unit":["px","px","px","px"]},"customHeight":{"value":[],"unit":["px","px","px","px"]}},"minHeightUnit":["px","px","px","px"],"width":[],"widthUnit":["%"],"minHeight":[]} -->
<div class="wp-block-greenshift-blocks-container gspb_container gspb_container-gsbp-04e1715a-a04e" id="gspb_container-id-gsbp-04e1715a-a04e"><!-- wp:greenshift-blocks/button {"id":"gsbp-23599b10-9179","inlineCssStyles":null,"buttonContent":"Test core Spline3d Loader on Google","align":"center","background":{"backgroundState":"Gradient","gradient":"linear-gradient(119deg, #84a1ff 0%, #3057ff 39%, #ff4242 100%)"},"backgroundCook":{},"panelBackground":{},"overlay":{},"spacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"panelSpacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"panelSpacingInner":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"iconSpacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"border":{"borderRadius":{"values":{},"unit":"px","locked":true}},"borderCook":{"borderRadius":{"values":{},"unit":"px","locked":true}},"panelBorder":{"borderRadius":{"values":{},"unit":"px","locked":true}},"blockWidth":{"customWidth":{"value":["100%"],"unit":["px","px","px","px"]},"customHeight":{"value":[],"unit":["px","px","px","px"]},"widthType":"custom"},"shadow":{},"panelShadow":{},"typography":{"textShadow":{},"alignment":["center"]},"typographyCook":{},"animation":{"duration":700,"easing":"ease","type":""},"responsive":{},"position":{"positionType":["","","",""],"positions":{"values":{}}},"csstransform":{},"buttonLink":"https://pagespeed.web.dev/analysis/https-viewer-spline-design/6p9at0vlwr?form_factor=mobile","linkNewWindow":true,"iconBox_icon":{"icon":{"font":"rhicon rhi-paper-plane","svg":"","image":""},"fill":"#2184f9","fillhover":"#2184f9","type":"font"},"typographyLabel":{}} -->
<div class="wp-block-greenshift-blocks-button gspb_button_wrapper gspb_button-id-gsbp-23599b10-9179" id="gspb_button-id-gsbp-23599b10-9179"><a class="gspb-buttonbox" href="https://pagespeed.web.dev/analysis/https-viewer-spline-design/6p9at0vlwr?form_factor=mobile" target="_blank" rel="noopener"><span class="gspb-buttonbox-textwrap"><span class="gspb-buttonbox-text"><span class="gspb-buttonbox-title">Test core Spline3d Loader on Google</span></span></span></a></div>
<!-- /wp:greenshift-blocks/button --></div>
<!-- /wp:greenshift-blocks/container --></div>
<!-- /wp:greenshift-blocks/container -->

<!-- wp:paragraph -->
<p>In the same time, Greenshift supports all kind of Spline3d features + it has few additional features on top of Spline viewer (responsive sizes, self hosting for splinecode files, custom preloader image, custom backgrounds and gradients, absolute positions, pining while scroll, etc)</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Here are some examples.</p>
<!-- /wp:paragraph -->

<!-- wp:greenshift-blocks/spline3d {"source":"https://greenshiftwp.com/wp-content/uploads/2023/03/caramel.splinecode","loadnow":false,"disablelazy":true,"background":{"color":"#d1daf0"},"width":["100vw"],"height":["100vh",null,null,"30vh"],"id":"gsbp-3692e634-2247","inlineCssStyles":null,"sceneloading":true,"reinit":true,"enableSmartLoading":true,"align":"full"} -->
<div class="wp-block-greenshift-blocks-spline3d alignfull gs-splineloader gspb_id-gsbp-3692e634-2247"><spline-viewer url="https://greenshiftwp.com/wp-content/uploads/2023/03/caramel.splinecode" loading-anim="true"></spline-viewer><img src="https://greenshiftwp.com/wp-content/plugins/greenshift-animation-and-page-builder-blocks/libs/spline3d/loading.svg" alt="" width="100vw" height="100vh" style="pointer-events:none" loading="eager"/></div>
<!-- /wp:greenshift-blocks/spline3d -->

<!-- wp:greenshift-blocks/row {"id":"gsbp-6c7ae05d-8192","inlineCssStyles":null,"width":[800,null,null,null],"displayStyles":false} -->
<div class="wp-block-greenshift-blocks-row gspb_row gspb_row-id-gsbp-6c7ae05d-8192" id="gspb_row-id-gsbp-6c7ae05d-8192"><div class="gspb_row__content"> <!-- wp:greenshift-blocks/row-column {"id":"gsbp-4ece8a27-ff57","inlineCssStyles":null} -->
<div class="wp-block-greenshift-blocks-row-column gspb_row__col--12 gspb_col-id-gsbp-4ece8a27-ff57" id="gspb_col-id-gsbp-4ece8a27-ff57"><!-- wp:heading -->
<h2 class="wp-block-heading" id="embedding">Embedding</h2>
<!-- /wp:heading -->

<!-- wp:greenshift-blocks/spline3d {"source":"https://prod.spline.design/UWoeqiir20o49Dah/scene.splinecode","loadnow":false,"width":["400px"],"height":["400px"],"id":"gsbp-c7c1a27c-351a","inlineCssStyles":null,"sceneloading":true,"reinit":true,"enableSmartLoading":true} -->
<div class="wp-block-greenshift-blocks-spline3d gs-splineloader gspb_id-gsbp-c7c1a27c-351a"><spline-viewer url="https://prod.spline.design/UWoeqiir20o49Dah/scene.splinecode" loading-anim="true"></spline-viewer><img src="https://greenshiftwp.com/wp-content/plugins/greenshift-animation-and-page-builder-blocks/libs/spline3d/loading.svg" alt="" width="400px" height="400px" style="pointer-events:none"/></div>
<!-- /wp:greenshift-blocks/spline3d -->

<!-- wp:heading -->
<h2 class="wp-block-heading" id="following">Following</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>In this example, we enabled Target as Global for both 3d blocks. This means that mouse and scroll related effects will detect position of mouse on whole page. Local target means that effects will be limited only area of 3d block</p>
<!-- /wp:paragraph -->

<!-- wp:greenshift-blocks/container {"id":"gsbp-30eb81da-2937","inlineCssStyles":null,"flexbox":{"type":"flexbox","flexDirection":["row"],"columngap":[30,null,null,10],"justifyContent":["flex-start"],"alignItems":["center"]},"spacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false},"overflow":[null,null,null,"hidden"]}} -->
<div class="wp-block-greenshift-blocks-container gspb_container gspb_container-gsbp-30eb81da-2937" id="gspb_container-id-gsbp-30eb81da-2937"><!-- wp:greenshift-blocks/spline3d {"source":"https://prod.spline.design/PBQQBw8bfXDhBo7w/scene.splinecode","loadnow":false,"width":["300px",null,null,"150px"],"height":["300px",null,null,"150px"],"id":"gsbp-226c7e66-11ca","inlineCssStyles":null,"sceneloading":true,"reinit":true,"enableSmartLoading":true} -->
<div class="wp-block-greenshift-blocks-spline3d gs-splineloader gspb_id-gsbp-226c7e66-11ca"><spline-viewer url="https://prod.spline.design/PBQQBw8bfXDhBo7w/scene.splinecode" loading-anim="true"></spline-viewer><img src="https://greenshiftwp.com/wp-content/plugins/greenshift-animation-and-page-builder-blocks/libs/spline3d/loading.svg" alt="" width="300px" height="300px" style="pointer-events:none"/></div>
<!-- /wp:greenshift-blocks/spline3d -->

<!-- wp:greenshift-blocks/text {"id":"gsbp-e966fb4a-8242","inlineCssStyles":null,"textContent":"MOVE MOUSE","typography":{"textShadow":{},"writingMode":["vertical-lr"],"alignment":["center"],"textOrientation":["initial"],"customweight":"bold","size":["28px"]}} -->
<div id="gspb_text-id-gsbp-e966fb4a-8242" class="gspb_text gspb_text-id-gsbp-e966fb4a-8242 ">MOVE MOUSE</div>
<!-- /wp:greenshift-blocks/text -->

<!-- wp:greenshift-blocks/spline3d {"source":"https://prod.spline.design/PBQQBw8bfXDhBo7w/scene.splinecode","loadnow":false,"background":{"color":"#fafafa"},"border":{"borderRadius":{"values":{"topLeft":["15"],"topRight":["15"],"bottomRight":["15"],"bottomLeft":["15"]},"unit":"px","locked":true},"style":{"all":["solid"]},"size":{"all":[1]},"color":{"all":["#e7e7e7"]},"styleHover":{},"sizeHover":{},"colorHover":{}},"width":["300px",null,null,"150px"],"height":["300px",null,null,"150px"],"id":"gsbp-9ef016c1-58b6","inlineCssStyles":null,"sceneloading":true,"reinit":true,"enableSmartLoading":true} -->
<div class="wp-block-greenshift-blocks-spline3d gs-splineloader gspb_id-gsbp-9ef016c1-58b6"><spline-viewer url="https://prod.spline.design/PBQQBw8bfXDhBo7w/scene.splinecode" loading-anim="true"></spline-viewer><img src="https://greenshiftwp.com/wp-content/plugins/greenshift-animation-and-page-builder-blocks/libs/spline3d/loading.svg" alt="" width="300px" height="300px" style="pointer-events:none"/></div>
<!-- /wp:greenshift-blocks/spline3d --></div>
<!-- /wp:greenshift-blocks/container -->

<!-- wp:heading -->
<h2 class="wp-block-heading" id="look-at">Look at</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>You can enable Look at effect in 3d layer to detect cursor position and animate accordingly</p>
<!-- /wp:paragraph -->

<!-- wp:greenshift-blocks/container {"id":"gsbp-03a98b61-a484","inlineCssStyles":null,"flexbox":{"type":"grid","enable":false,"gridcolumns":[2,null,null,2],"columngap":[20],"rowgap":[20]},"spacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false},"overflow":["hidden"]}} -->
<div class="wp-block-greenshift-blocks-container gspb_container gspb_container-gsbp-03a98b61-a484" id="gspb_container-id-gsbp-03a98b61-a484"><!-- wp:greenshift-blocks/container {"id":"gsbp-3420a055-51cb","inlineCssStyles":null,"rowspan":[],"columnspan":[],"columnStart":[],"columnEnd":[],"rowStart":[],"rowEnd":[],"alignSelf":[],"flexGrow":[],"flexShrink":[],"flexBasis":[],"flexBasisCustom":[],"flexGrowHover":[],"flexShrinkHover":[],"flexBasisHover":[],"flexBasisCustomHover":[],"flexGrowFocus":[],"flexShrinkFocus":[],"flexBasisFocus":[],"flexBasisCustomFocus":[],"order":[],"flexbox":{},"animation":{"duration":700,"easing":"ease","type":""},"background":{},"overlay":{},"border":{"borderRadius":{"values":{},"unit":"px","locked":true}},"spacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"shadow":{},"typography":{},"position":{"positionType":["","","",""],"positions":{"values":{}}},"shapeDivider":{"topShape":{},"bottomShape":{}},"responsive":{},"csstransform":{},"carousel":{"arrowPos":[null,null,null,null],"arrowSize":[null,null,null,null],"arrowPosV":[null,null,null,null]},"imageBorder":{"borderRadius":{"values":{},"unit":"px","locked":true}},"imageShadow":{},"blockWidth":{"customWidth":{"value":[],"unit":["px","px","px","px"]},"customHeight":{"value":[],"unit":["px","px","px","px"]}},"minHeightUnit":["px","px","px","px"],"width":[],"widthUnit":["%"],"minHeight":[]} -->
<div class="wp-block-greenshift-blocks-container gspb_container gspb_container-gsbp-3420a055-51cb" id="gspb_container-id-gsbp-3420a055-51cb"><!-- wp:greenshift-blocks/spline3d {"source":"https://prod.spline.design/OS922s36poAxrTXE/scene.splinecode","loadnow":false,"background":{"color":"#ffeaf4"},"border":{"borderRadius":{"values":{"topLeft":["20"],"topRight":["20"],"bottomRight":["20"],"bottomLeft":["20"]},"unit":"px","locked":true},"style":{},"size":{},"color":{},"styleHover":{},"sizeHover":{},"colorHover":{}},"width":["300px",null,null,"150px"],"height":["300px",null,null,"150px"],"id":"gsbp-d864d2b8-75e8","inlineCssStyles":null,"spacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"animation":{"duration":700,"easing":"ease","type":""},"responsive":{},"position":{"positionType":["","","",""],"positions":{"values":{}}},"csstransform":{},"sceneloading":true,"reinit":true,"enableSmartLoading":true} -->
<div class="wp-block-greenshift-blocks-spline3d gs-splineloader gspb_id-gsbp-d864d2b8-75e8"><spline-viewer url="https://prod.spline.design/OS922s36poAxrTXE/scene.splinecode" loading-anim="true"></spline-viewer><img src="https://greenshiftwp.com/wp-content/plugins/greenshift-animation-and-page-builder-blocks/libs/spline3d/loading.svg" alt="" width="300px" height="300px" style="pointer-events:none"/></div>
<!-- /wp:greenshift-blocks/spline3d --></div>
<!-- /wp:greenshift-blocks/container -->

<!-- wp:greenshift-blocks/container {"id":"gsbp-4cd373ba-726f","inlineCssStyles":null,"rowspan":[],"columnspan":[],"columnStart":[],"columnEnd":[],"rowStart":[],"rowEnd":[],"alignSelf":[],"flexGrow":[],"flexShrink":[],"flexBasis":[],"flexBasisCustom":[],"flexGrowHover":[],"flexShrinkHover":[],"flexBasisHover":[],"flexBasisCustomHover":[],"flexGrowFocus":[],"flexShrinkFocus":[],"flexBasisFocus":[],"flexBasisCustomFocus":[],"order":[],"flexbox":{},"animation":{"duration":700,"easing":"ease","type":""},"background":{},"overlay":{},"border":{"borderRadius":{"values":{},"unit":"px","locked":true}},"spacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"shadow":{},"typography":{},"position":{"positionType":["","","",""],"positions":{"values":{}}},"shapeDivider":{"topShape":{},"bottomShape":{}},"responsive":{},"csstransform":{},"carousel":{"arrowPos":[null,null,null,null],"arrowSize":[null,null,null,null],"arrowPosV":[null,null,null,null]},"imageBorder":{"borderRadius":{"values":{},"unit":"px","locked":true}},"imageShadow":{},"blockWidth":{"customWidth":{"value":[],"unit":["px","px","px","px"]},"customHeight":{"value":[],"unit":["px","px","px","px"]}},"minHeightUnit":["px","px","px","px"],"width":[],"widthUnit":["%"],"minHeight":[]} -->
<div class="wp-block-greenshift-blocks-container gspb_container gspb_container-gsbp-4cd373ba-726f" id="gspb_container-id-gsbp-4cd373ba-726f"><!-- wp:greenshift-blocks/spline3d {"source":"https://prod.spline.design/OS922s36poAxrTXE/scene.splinecode","loadnow":false,"background":{"color":"#f4ffe8"},"border":{"borderRadius":{"values":{"topLeft":["15"],"topRight":["15"],"bottomRight":["15"],"bottomLeft":["15"]},"unit":"px","locked":true},"style":{},"size":{},"color":{},"styleHover":{},"sizeHover":{},"colorHover":{}},"width":["300px",null,null,"150px"],"height":["300px",null,null,"150px"],"id":"gsbp-45b2fb4e-7957","inlineCssStyles":null,"spacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"animation":{"duration":700,"easing":"ease","type":""},"responsive":{},"position":{"positionType":["","","",""],"positions":{"values":{}}},"csstransform":{},"sceneloading":true,"reinit":false,"enableSmartLoading":true} -->
<div class="wp-block-greenshift-blocks-spline3d gs-splineloader gspb_id-gsbp-45b2fb4e-7957"><spline-viewer url="https://prod.spline.design/OS922s36poAxrTXE/scene.splinecode" loading-anim="true"></spline-viewer><img src="https://greenshiftwp.com/wp-content/plugins/greenshift-animation-and-page-builder-blocks/libs/spline3d/loading.svg" alt="" width="300px" height="300px" style="pointer-events:none"/></div>
<!-- /wp:greenshift-blocks/spline3d --></div>
<!-- /wp:greenshift-blocks/container -->

<!-- wp:greenshift-blocks/container {"id":"gsbp-cbde7299-0ed4","inlineCssStyles":null,"rowspan":[],"columnspan":[],"columnStart":[],"columnEnd":[],"rowStart":[],"rowEnd":[],"alignSelf":[],"flexGrow":[],"flexShrink":[],"flexBasis":[],"flexBasisCustom":[],"flexGrowHover":[],"flexShrinkHover":[],"flexBasisHover":[],"flexBasisCustomHover":[],"flexGrowFocus":[],"flexShrinkFocus":[],"flexBasisFocus":[],"flexBasisCustomFocus":[],"order":[],"flexbox":{},"animation":{"duration":700,"easing":"ease","type":""},"background":{},"overlay":{},"border":{"borderRadius":{"values":{},"unit":"px","locked":true}},"spacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"shadow":{},"typography":{},"position":{"positionType":["","","",""],"positions":{"values":{}}},"shapeDivider":{"topShape":{},"bottomShape":{}},"responsive":{},"csstransform":{},"carousel":{"arrowPos":[null,null,null,null],"arrowSize":[null,null,null,null],"arrowPosV":[null,null,null,null]},"imageBorder":{"borderRadius":{"values":{},"unit":"px","locked":true}},"imageShadow":{},"blockWidth":{"customWidth":{"value":[],"unit":["px","px","px","px"]},"customHeight":{"value":[],"unit":["px","px","px","px"]}},"minHeightUnit":["px","px","px","px"],"width":[],"widthUnit":["%"],"minHeight":[]} -->
<div class="wp-block-greenshift-blocks-container gspb_container gspb_container-gsbp-cbde7299-0ed4" id="gspb_container-id-gsbp-cbde7299-0ed4"><!-- wp:greenshift-blocks/spline3d {"source":"https://prod.spline.design/OS922s36poAxrTXE/scene.splinecode","loadnow":false,"background":{"color":"#defff2"},"border":{"borderRadius":{"values":{"topLeft":["15"],"topRight":["15"],"bottomRight":["15"],"bottomLeft":["15"]},"unit":"px","locked":true},"style":{},"size":{},"color":{},"styleHover":{},"sizeHover":{},"colorHover":{}},"width":["300px",null,null,"150px"],"height":["300px",null,null,"150px"],"id":"gsbp-1dd9789a-09d4","inlineCssStyles":null,"sceneloading":true,"reinit":false,"enableSmartLoading":true} -->
<div class="wp-block-greenshift-blocks-spline3d gs-splineloader gspb_id-gsbp-1dd9789a-09d4"><spline-viewer url="https://prod.spline.design/OS922s36poAxrTXE/scene.splinecode" loading-anim="true"></spline-viewer><img src="https://greenshiftwp.com/wp-content/plugins/greenshift-animation-and-page-builder-blocks/libs/spline3d/loading.svg" alt="" width="300px" height="300px" style="pointer-events:none"/></div>
<!-- /wp:greenshift-blocks/spline3d --></div>
<!-- /wp:greenshift-blocks/container -->

<!-- wp:greenshift-blocks/container {"id":"gsbp-d78c2371-daa8","inlineCssStyles":null,"rowspan":[],"columnspan":[],"columnStart":[],"columnEnd":[],"rowStart":[],"rowEnd":[],"alignSelf":[],"flexGrow":[],"flexShrink":[],"flexBasis":[],"flexBasisCustom":[],"flexGrowHover":[],"flexShrinkHover":[],"flexBasisHover":[],"flexBasisCustomHover":[],"flexGrowFocus":[],"flexShrinkFocus":[],"flexBasisFocus":[],"flexBasisCustomFocus":[],"order":[],"flexbox":{},"animation":{"duration":700,"easing":"ease","type":""},"background":{},"overlay":{},"border":{"borderRadius":{"values":{},"unit":"px","locked":true}},"spacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"shadow":{},"typography":{},"position":{"positionType":["","","",""],"positions":{"values":{}}},"shapeDivider":{"topShape":{},"bottomShape":{}},"responsive":{},"csstransform":{},"carousel":{"arrowPos":[null,null,null,null],"arrowSize":[null,null,null,null],"arrowPosV":[null,null,null,null]},"imageBorder":{"borderRadius":{"values":{},"unit":"px","locked":true}},"imageShadow":{},"blockWidth":{"customWidth":{"value":[],"unit":["px","px","px","px"]},"customHeight":{"value":[],"unit":["px","px","px","px"]}},"minHeightUnit":["px","px","px","px"],"width":[],"widthUnit":["%"],"minHeight":[]} -->
<div class="wp-block-greenshift-blocks-container gspb_container gspb_container-gsbp-d78c2371-daa8" id="gspb_container-id-gsbp-d78c2371-daa8"><!-- wp:greenshift-blocks/spline3d {"source":"https://prod.spline.design/OS922s36poAxrTXE/scene.splinecode","loadnow":false,"background":{"color":"#ffeeed"},"border":{"borderRadius":{"values":{"topLeft":["15"],"topRight":["15"],"bottomRight":["15"],"bottomLeft":["15"]},"unit":"px","locked":true},"style":{},"size":{},"color":{},"styleHover":{},"sizeHover":{},"colorHover":{}},"width":["300px",null,null,"150px"],"height":["300px",null,null,"150px"],"id":"gsbp-f9b48269-af57","inlineCssStyles":null,"sceneloading":true,"reinit":false,"enableSmartLoading":true} -->
<div class="wp-block-greenshift-blocks-spline3d gs-splineloader gspb_id-gsbp-f9b48269-af57"><spline-viewer url="https://prod.spline.design/OS922s36poAxrTXE/scene.splinecode" loading-anim="true"></spline-viewer><img src="https://greenshiftwp.com/wp-content/plugins/greenshift-animation-and-page-builder-blocks/libs/spline3d/loading.svg" alt="" width="300px" height="300px" style="pointer-events:none"/></div>
<!-- /wp:greenshift-blocks/spline3d --></div>
<!-- /wp:greenshift-blocks/container --></div>
<!-- /wp:greenshift-blocks/container -->

<!-- wp:paragraph -->
<p></p>
<!-- /wp:paragraph -->

<!-- wp:heading -->
<h2 class="wp-block-heading" id="on-scroll-animation">On Scroll animation</h2>
<!-- /wp:heading -->

<!-- wp:greenshift-blocks/container {"id":"gsbp-ed5666af-6af5","inlineCssStyles":null,"blockWidth":{"customWidth":{"value":[],"unit":["px","px","px","px"]},"customHeight":{"value":["1200px"],"unit":["px","px","px","px"]},"heightType":"custom","heightVariableType":["auto"],"heightVariableCustom":[0]}} -->
<div class="wp-block-greenshift-blocks-container gspb_container gspb_container-gsbp-ed5666af-6af5" id="gspb_container-id-gsbp-ed5666af-6af5"><!-- wp:greenshift-blocks/spline3d {"source":"https://prod.spline.design/VLs6IkpxGaY8nODO/scene.splinecode","loadnow":false,"width":["500px",null,null,"500px"],"height":["500px",null,null,"500px"],"id":"gsbp-7d1ae33b-eb80","inlineCssStyles":null,"position":{"positionType":["sticky","","",""],"positions":{"values":{"top":["200px"]}}},"reinit":false,"enableSmartLoading":true} -->
<div class="wp-block-greenshift-blocks-spline3d gs-splineloader gspb_id-gsbp-7d1ae33b-eb80"><spline-viewer url="https://prod.spline.design/VLs6IkpxGaY8nODO/scene.splinecode"></spline-viewer><img src="https://greenshiftwp.com/wp-content/plugins/greenshift-animation-and-page-builder-blocks/libs/spline3d/loading.svg" alt="" width="500px" height="500px" style="pointer-events:none"/></div>
<!-- /wp:greenshift-blocks/spline3d --></div>
<!-- /wp:greenshift-blocks/container -->

<!-- wp:spacer {"height":"248px"} -->
<div style="height:248px" aria-hidden="true" class="wp-block-spacer"></div>
<!-- /wp:spacer -->

<!-- wp:paragraph {"align":"center"} -->
<p class="has-text-align-center">That's all for scroll</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Check how to use block. It's really easy, just copy Spline3d Viewer script. Also yo can upload splinecode files</p>
<!-- /wp:paragraph -->

<!-- wp:greenshift-blocks/video {"id":"gsbp-b68bbd54-11f1","inlineCssStyles":null,"src":"https://youtu.be/EGmsJ2_ucKU","provider":"youtube","poster":"https://i.ytimg.com/vi/EGmsJ2_ucKU/maxresdefault.jpg","isOverlay":true,"overlayIcon":true,"overlayLightbox":true,"postDate":"2023-03-19T01:22:13","bgColor":"#e5daf1"} -->
<div class="wp-block-greenshift-blocks-video gs-video youtube gspb_video-id-gsbp-b68bbd54-11f1" id="gs-video-gsbp-b68bbd54-11f1"><div class="gs-video-wrapper" itemscope><iframe class="gs-video-element" data-src="https://youtu.be/EGmsJ2_ucKU" data-provider="youtube" data-autoplay="true" data-playsinline="false" data-controls="true" data-loop="false" data-mute="false" data-overlay="true" data-lightbox="true" data-modestbranding="false" data-suggested="true" frameborder="0" allowfullscreen></iframe><div class="gs-video-overlay" style="background-image:url(https://i.ytimg.com/vi/EGmsJ2_ucKU/maxresdefault.jpg)" data-type="youtube" data-lightbox="true"><div class="gs-play-icon" style="background-color:#cc0000"><div style="content:"";display:block;position:absolute;border-radius:50%;border:1px solid #cc0000;left:-20px;right:-20px;bottom:-20px;top:-20px;animation:pulsevideobutton 1.5s linear infinite;opacity:0"></div><span></span><div style="content:"";display:block;position:absolute;border-radius:50%;border:1px solid #cc0000;left:-20px;right:-20px;bottom:-20px;top:-20px;animation:pulsevideobutton 1.5s linear infinite;opacity:0;animation-delay:0.5s"></div></div><div class="gs-overlay-color" style="background-color:#e5daf1;background-image:;opacity:0.5"></div></div></div></div>
<!-- /wp:greenshift-blocks/video --></div>
<!-- /wp:greenshift-blocks/row-column --> </div></div>
<!-- /wp:greenshift-blocks/row -->