{"id":135,"date":"2026-10-29T23:35:11","date_gmt":"2026-10-29T23:35:11","guid":{"rendered":"https:\/\/demo.creanexo.com\/interruptor-dia-noche\/"},"modified":"2026-10-30T00:11:38","modified_gmt":"2026-10-30T00:11:38","slug":"interruptor-dia-noche","status":"publish","type":"page","link":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/interruptor-dia-noche\/","title":{"rendered":"Interruptor D\u00eda\/Noche \u2014 Demo"},"content":{"rendered":"\n<style id=\"idn-demo-page-css\">body.page-id-135 .wp-site-blocks>header.wp-block-template-part,body.page-id-135 .wp-site-blocks>footer.wp-block-template-part{display:none}body.page-id-135{background:#07080d}body.page-id-135:has(.idn-demo-page[data-idn-theme=\"day\"]){background:#f4f3f7}body.page-id-135 .wp-site-blocks,body.page-id-135 .wp-site-blocks>main{padding:0!important;margin:0!important}body.page-id-135 .wp-site-blocks>main>.entry-content{padding:0!important}.idn-demo-page{--page:#07080d;--surface:rgba(255,255,255,.035);--surface-strong:rgba(255,255,255,.06);--line:rgba(255,255,255,.09);--line-strong:rgba(255,255,255,.16);--text:#f4f5fb;--muted:#a6abbf;--accent:#b6f25a;--accent-ink:#152008;--glow-a:rgba(72,216,255,.16);--glow-b:rgba(118,92,255,.20);--stage-dot:rgba(255,255,255,.06);--shadow:0 30px 80px rgba(0,0,0,.45)}.idn-demo-page[data-idn-theme=\"day\"]{color-scheme:light;--page:#f4f3f7;--surface:rgba(255,255,255,.72);--surface-strong:#ffffff;--line:rgba(23,24,42,.08);--line-strong:rgba(23,24,42,.14);--text:#16172a;--muted:#5a5c70;--accent:#b6f25a;--accent-ink:#152008;--glow-a:rgba(255,181,44,.22);--glow-b:rgba(255,120,170,.12);--stage-dot:rgba(23,24,42,.07);--shadow:0 30px 70px rgba(60,58,100,.14)}.idn-demo-page,.idn-demo-page *,.idn-demo-page *::before,.idn-demo-page *::after{box-sizing:border-box}.idn-demo-page{position:relative;isolation:isolate;overflow:hidden;min-height:100vh;min-height:100svh;margin:0!important;max-width:none!important;display:grid;grid-template-rows:auto 1fr auto;gap:0;padding:28px clamp(18px,4vw,48px) 28px;background:var(--page);color:var(--text);font-family:Manrope,Inter,ui-sans-serif,system-ui,-apple-system,\"Segoe UI\",sans-serif;-webkit-font-smoothing:antialiased;transition:background-color .6s ease,color .6s ease}.idn-demo-page::before,.idn-demo-page::after{content:\"\";position:absolute;inset:-20% -10% auto;height:120%;z-index:-1;pointer-events:none;transition:opacity .9s ease}.idn-demo-page::before{background:radial-gradient(60% 45% at 50% 18%,var(--glow-b),transparent 70%),radial-gradient(40% 35% at 50% 62%,var(--glow-a),transparent 72%)}.idn-demo-page::after{opacity:0;background:radial-gradient(55% 40% at 50% 10%,rgba(255,210,120,.35),transparent 70%)}.idn-demo-page[data-idn-theme=\"day\"]::after{opacity:1}.idn-demo-page .idn-demo-nav{width:min(100%,1120px);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 10px 10px 16px;border:1px solid var(--line);border-radius:18px;background:var(--surface);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);transition:background-color .6s ease,border-color .6s ease}.idn-demo-page .idn-demo-brand{display:inline-flex;align-items:center;gap:11px;color:var(--text);font-size:17px;font-weight:700;letter-spacing:-.02em;text-decoration:none;border-radius:10px}.idn-demo-page .idn-demo-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--accent);color:var(--accent-ink);font-size:12px;font-weight:800;letter-spacing:.02em;box-shadow:0 6px 18px rgba(182,242,90,.28)}.idn-demo-page .idn-demo-navlinks{display:flex;align-items:center;gap:8px}.idn-demo-page .idn-demo-navlinks a{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 18px;border:1px solid var(--line-strong);border-radius:12px;background:transparent;color:var(--text);font-size:14px;font-weight:600;text-align:center;white-space:nowrap;text-decoration:none;transition:background-color .2s ease,border-color .2s ease,transform .2s ease}.idn-demo-page .idn-demo-navlinks a:hover{background:var(--surface-strong);transform:translateY(-1px)}.idn-demo-page .idn-demo-navlinks a:last-child{border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}.idn-demo-page .idn-demo-navlinks a:last-child:hover{filter:brightness(1.05)}.idn-demo-page a:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.idn-demo-page[data-idn-theme=\"day\"] a:focus-visible{outline-color:#0a66c2}.idn-demo-page .idn-demo-content{width:min(100%,820px);margin:clamp(48px,9vh,96px) auto 0;text-align:center}.idn-demo-page .idn-demo-kicker{display:inline-flex;align-items:center;gap:10px;margin:0 0 22px;padding:7px 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--muted);font:700 11px\/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.16em;text-transform:uppercase}.idn-demo-page .idn-demo-kicker::before{content:\"\";width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(182,242,90,.18)}.idn-demo-page .idn-demo-content h1{margin:0;font-size:clamp(40px,7.2vw,80px);font-weight:700;line-height:1;letter-spacing:-.05em;color:var(--text)}.idn-demo-page .idn-demo-lead{max-width:600px;margin:22px auto 0;color:var(--muted);font-size:clamp(16px,1.6vw,18px);line-height:1.7}.idn-demo-page .idn-demo-center{width:min(100%,880px);margin:clamp(40px,7vh,72px) auto 0;padding:0;min-height:0;display:grid;justify-items:center;gap:20px}.idn-demo-page .idn-demo-center>.idn-widget{position:relative;width:100%;max-width:none;display:grid;place-items:center;min-height:clamp(220px,32vw,320px);padding:40px 24px;border:1px solid var(--line);border-radius:28px;background:radial-gradient(circle at 50% 50%,var(--glow-a),transparent 60%),radial-gradient(var(--stage-dot) 1px,transparent 1.4px) 0 0\/22px 22px,var(--surface);box-shadow:var(--shadow),inset 0 1px 0 rgba(255,255,255,.06);transition:background-color .6s ease,border-color .6s ease,box-shadow .6s ease;--idn-person-size:.47}.idn-demo-page .idn-demo-center>.idn-widget .idn-switch{width:min(100%,200px)}.idn-demo-page .idn-orb:focus:not(:focus-visible){outline:none}.idn-demo-page .idn-demo-instructions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;width:100%;margin:0;text-align:left}.idn-demo-page .idn-demo-instructions article{padding:24px 26px;border:1px solid var(--line);border-radius:20px;background:var(--surface);transition:background-color .6s ease,border-color .6s ease}.idn-demo-page .idn-demo-instructions strong{display:block;margin:0 0 8px;color:var(--text);font-size:17px;font-weight:700;letter-spacing:-.01em}.idn-demo-page .idn-demo-instructions p{margin:0;color:var(--muted);font-size:15px;line-height:1.65}.idn-demo-page .idn-demo-footer{width:min(100%,1120px);margin:clamp(48px,8vh,80px) auto 0;padding-top:22px;border-top:1px solid var(--line);display:flex;justify-content:center;color:var(--muted);font-size:14px;text-align:center}.idn-demo-page .idn-demo-footer p{margin:0}.idn-demo-page .idn-demo-footer a{color:var(--text);font-weight:600;text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:4px}@media (max-width:640px){.idn-demo-page{padding:16px 16px 22px}.idn-demo-page .idn-demo-nav{flex-wrap:wrap;padding:12px;gap:12px}.idn-demo-page .idn-demo-navlinks{width:100%}.idn-demo-page .idn-demo-navlinks a{flex:1 1 auto;min-height:44px;padding:0 12px;font-size:13px}.idn-demo-page .idn-demo-navlinks a:first-child{flex:0 1 34%}.idn-demo-page .idn-demo-content{margin-top:40px}.idn-demo-page .idn-demo-kicker{font-size:10px;letter-spacing:.12em;margin-bottom:18px}.idn-demo-page .idn-demo-lead{font-size:16px}.idn-demo-page .idn-demo-center{margin-top:32px;gap:14px}.idn-demo-page .idn-demo-center>.idn-widget{min-height:200px;border-radius:22px;--idn-person-size:.4}.idn-demo-page .idn-demo-center>.idn-widget .idn-switch{width:min(100%,170px)}.idn-demo-page .idn-demo-instructions{grid-template-columns:1fr;gap:14px}.idn-demo-page .idn-demo-instructions article{padding:20px}.idn-demo-page .idn-demo-footer{margin-top:40px}}@media (prefers-reduced-motion:reduce){.idn-demo-page,.idn-demo-page::before,.idn-demo-page::after,.idn-demo-page *{transition:none!important}}<\/style>\n<div class=\"idn-demo-page alignfull\" data-idn-theme=\"night\">\n    <nav class=\"idn-demo-nav\" aria-label=\"Navegaci\u00f3n principal\">\n      <a class=\"idn-demo-brand\" href=\"https:\/\/plugins.creanexo.com\/\" aria-label=\"CreaNexo, volver a la tienda\">\n        <span class=\"idn-demo-mark\" aria-hidden=\"true\">CN<\/span><span>CreaNexo<\/span>\n      <\/a>\n      <div class=\"idn-demo-navlinks\">\n        <a href=\"https:\/\/plugins.creanexo.com\/\">Tienda<\/a>\n        <a class=\"idn-demo-buy\" href=\"https:\/\/plugins.creanexo.com\/product\/interruptor-dia-noche-animado-web-wordpress\/\">Comprar ahora \u2014 US$5<\/a>\n      <\/div>\n    <\/nav>\n    <header class=\"idn-demo-content\">\n      <p class=\"idn-demo-kicker\">Demostraci\u00f3n interactiva \u00b7 WordPress<\/p>\n      <h1>Interruptor d\u00eda y noche<\/h1>\n      <p class=\"idn-demo-lead\">Prueba el control compacto tal como se integra en una p\u00e1gina web. Toca la luna para encender el d\u00eda y mira al personaje caminar hasta ella; toca el sol para que regrese al hueco y vuelva la noche.<\/p>\n    <\/header>\n    <section class=\"idn-demo-center\" aria-label=\"Demostraci\u00f3n del interruptor d\u00eda y noche\">\n              <div class=\"idn-widget\" data-theme=\"night\" data-idn-scope=\"component\">\n            <div class=\"idn-switch\">\n                <button class=\"idn-orb\" type=\"button\" role=\"switch\" aria-checked=\"false\" aria-label=\"Modo d\u00eda\" aria-describedby=\"idn-note-1\">\n                    <svg class=\"idn-icon idn-icon-moon\" viewBox=\"0 0 48 48\" aria-hidden=\"true\" focusable=\"false\"><path d=\"M31.8 34.6A17.7 17.7 0 0 1 14.1 10a18.7 18.7 0 1 0 23.9 22.7c-2 .9-4.1 1.7-6.2 1.9Z\"\/><\/svg>\n                    <svg class=\"idn-icon idn-icon-sun\" viewBox=\"0 0 48 48\" aria-hidden=\"true\" focusable=\"false\"><circle cx=\"24\" cy=\"24\" r=\"8.5\"\/><g stroke=\"currentColor\" stroke-width=\"4\" stroke-linecap=\"round\"><path d=\"M24 4v5M24 39v5M4 24h5M39 24h5M9.9 9.9l3.6 3.6m21 21 3.6 3.6m0-28.2-3.6 3.6m-21 21-3.6 3.6\"\/><\/g><\/svg>\n                    <span class=\"idn-switch-note\" id=\"idn-note-1\">Cambia entre apariencia nocturna y diurna.<\/span>\n                <\/button>\n                <span class=\"idn-person\" aria-hidden=\"true\"><i class=\"idn-person-head\"><\/i><i class=\"idn-person-body\"><\/i><i class=\"idn-person-legs\"><i class=\"idn-person-leg idn-person-leg-a\"><\/i><i class=\"idn-person-leg idn-person-leg-b\"><\/i><\/i><\/span>\n            <\/div>\n        <\/div>\n        \n      <div class=\"idn-demo-instructions\" aria-label=\"C\u00f3mo probarlo\">\n        <article><strong>1. Activa el d\u00eda<\/strong><p>Pulsa la luna y mira c\u00f3mo el personaje sale del hueco y llega hasta ella.<\/p><\/article>\n        <article><strong>2. Vuelve a la noche<\/strong><p>Pulsa el sol para que el personaje regrese y se oculte dentro del hueco.<\/p><\/article>\n      <\/div>\n    <\/section>\n    <footer class=\"idn-demo-footer\"><p>\u00bfQuieres conocer m\u00e1s herramientas? <a href=\"https:\/\/plugins.creanexo.com\/\">Visita la tienda CreaNexo<\/a>.<\/p><\/footer>\n  <\/div>\n","protected":false},"excerpt":{"rendered":"<p>CNCreaNexo Tienda Comprar ahora \u2014 US$5 Demostraci\u00f3n interactiva \u00b7 WordPress Interruptor d\u00eda y noche Prueba el control compacto tal como se integra en una p\u00e1gina web. Toca la luna para encender el d\u00eda y mira al personaje caminar hasta ella; toca el sol para que regrese al hueco y vuelva la noche. 1. Activa el [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-no-title","meta":{"footnotes":""},"class_list":["post-135","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.8 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Interruptor D\u00eda\/Noche \u2014 Demo - CreaNexo Demo<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/interruptor-dia-noche\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Interruptor D\u00eda\/Noche \u2014 Demo - CreaNexo Demo\" \/>\n<meta property=\"og:description\" content=\"CNCreaNexo Tienda Comprar ahora \u2014 US$5 Demostraci\u00f3n interactiva \u00b7 WordPress Interruptor d\u00eda y noche Prueba el control compacto tal como se integra en una p\u00e1gina web. Toca la luna para encender el d\u00eda y mira al personaje caminar hasta ella; toca el sol para que regrese al hueco y vuelva la noche. 1. Activa el [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/interruptor-dia-noche\/\" \/>\n<meta property=\"og:site_name\" content=\"CreaNexo Demo\" \/>\n<meta property=\"article:modified_time\" content=\"2026-10-30T00:11:38+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minuto\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/creanexostudio.com\\\/demos\\\/creanexo-demo\\\/interruptor-dia-noche\\\/\",\"url\":\"https:\\\/\\\/creanexostudio.com\\\/demos\\\/creanexo-demo\\\/interruptor-dia-noche\\\/\",\"name\":\"Interruptor D\u00eda\\\/Noche \u2014 Demo - CreaNexo Demo\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/creanexostudio.com\\\/demos\\\/creanexo-demo\\\/#website\"},\"datePublished\":\"2026-10-29T23:35:11+00:00\",\"dateModified\":\"2026-10-30T00:11:38+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/creanexostudio.com\\\/demos\\\/creanexo-demo\\\/interruptor-dia-noche\\\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/creanexostudio.com\\\/demos\\\/creanexo-demo\\\/interruptor-dia-noche\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/creanexostudio.com\\\/demos\\\/creanexo-demo\\\/interruptor-dia-noche\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/creanexostudio.com\\\/demos\\\/creanexo-demo\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Interruptor D\u00eda\\\/Noche \u2014 Demo\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/creanexostudio.com\\\/demos\\\/creanexo-demo\\\/#website\",\"url\":\"https:\\\/\\\/creanexostudio.com\\\/demos\\\/creanexo-demo\\\/\",\"name\":\"CreaNexo Demo\",\"description\":\"Soluciones web, WordPress y reproductores de audio\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/creanexostudio.com\\\/demos\\\/creanexo-demo\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Interruptor D\u00eda\/Noche \u2014 Demo - CreaNexo Demo","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/interruptor-dia-noche\/","og_locale":"es_ES","og_type":"article","og_title":"Interruptor D\u00eda\/Noche \u2014 Demo - CreaNexo Demo","og_description":"CNCreaNexo Tienda Comprar ahora \u2014 US$5 Demostraci\u00f3n interactiva \u00b7 WordPress Interruptor d\u00eda y noche Prueba el control compacto tal como se integra en una p\u00e1gina web. Toca la luna para encender el d\u00eda y mira al personaje caminar hasta ella; toca el sol para que regrese al hueco y vuelva la noche. 1. Activa el [&hellip;]","og_url":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/interruptor-dia-noche\/","og_site_name":"CreaNexo Demo","article_modified_time":"2026-10-30T00:11:38+00:00","twitter_card":"summary_large_image","twitter_misc":{"Tiempo de lectura":"1 minuto"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/interruptor-dia-noche\/","url":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/interruptor-dia-noche\/","name":"Interruptor D\u00eda\/Noche \u2014 Demo - CreaNexo Demo","isPartOf":{"@id":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/#website"},"datePublished":"2026-10-29T23:35:11+00:00","dateModified":"2026-10-30T00:11:38+00:00","breadcrumb":{"@id":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/interruptor-dia-noche\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/creanexostudio.com\/demos\/creanexo-demo\/interruptor-dia-noche\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/interruptor-dia-noche\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/"},{"@type":"ListItem","position":2,"name":"Interruptor D\u00eda\/Noche \u2014 Demo"}]},{"@type":"WebSite","@id":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/#website","url":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/","name":"CreaNexo Demo","description":"Soluciones web, WordPress y reproductores de audio","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"}]}},"_links":{"self":[{"href":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/wp-json\/wp\/v2\/pages\/135","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/wp-json\/wp\/v2\/comments?post=135"}],"version-history":[{"count":4,"href":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/wp-json\/wp\/v2\/pages\/135\/revisions"}],"predecessor-version":[{"id":139,"href":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/wp-json\/wp\/v2\/pages\/135\/revisions\/139"}],"wp:attachment":[{"href":"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/wp-json\/wp\/v2\/media?parent=135"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}