diff --git a/styles/css3-github-ribbon.css b/styles/css3-github-ribbon.css
index 83e6a2e..72302f9 100644
--- a/styles/css3-github-ribbon.css
+++ b/styles/css3-github-ribbon.css
@@ -1,2 +1,54 @@
-body{background-color:#fff}
-.github-ribbon{background-color:#121621;top:3.2em;right:-3.7em;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);transform:rotate(45deg);-webkit-box-shadow:0 0 0 1px #1d212e inset,0 0 2px 1px #fff inset,0 0 1em #888;-moz-box-shadow:0 0 0 1px #1d212e inset,0 0 2px 1px #fff inset,0 0 1em #888;box-shadow:0 0 0 1px #1d212e inset,0 0 2px 1px #fff inset,0 0 1em #888;color:rgba(255,255,255,0.90)!important;display:block;padding:.6em 3.5em;position:absolute;font:bold .82em sans-serif;text-align:center;text-decoration:none;text-shadow:1px -1px 8px rgba(0,0,0,0.60);-webkit-user-select:none;-moz-user-select:none;user-select:none}
\ No newline at end of file
+:root {
+    --background-color-light: #ffffff; 
+    --background-color-dark: #1a202c; 
+    --text-color-light: #1e293b; 
+    --text-color-dark: #ffffff; 
+  }
+  
+  
+  body {
+    background-color: var(--background-color-light);
+    font-family: 'Inter', sans-serif; 
+    margin: 0; 
+  }
+  
+  .github-ribbon {
+    background-color: #121621;
+    top: 3.2em;
+    right: -1em;
+    -webkit-transform: rotate(45deg);
+    -moz-transform: rotate(45deg);
+    transform: rotate(45deg);
+    -webkit-box-shadow: 0 0 0 1px #1d212e inset, 0 0 2px 1px #fff inset, 0 0 1em #888;
+    -moz-box-shadow: 0 0 0 1px #1d212e inset, 0 0 2px 1px #fff inset, 0 0 1em #888;
+    box-shadow: 0 0 0 1px #1d212e inset, 0 0 2px 1px #fff inset, 0 0 1em #888;
+    color: rgba(255, 255, 255, 0.90)!important;
+    display: block;
+    padding: 10px 30px; 
+    position: absolute;
+    font-weight: bold;
+    font-size: 0.82em; 
+    text-align: center;
+    text-decoration: none;
+    text-shadow: 1px -1px 8px rgba(0, 0, 0, 0.60);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    user-select: none;
+    z-index: 9999; 
+  }
+  
+  dd {
+    margin: 0; 
+  }
+  
+  pre {
+    margin: 0; 
+  }
+  
+  
+  @media (prefers-color-scheme: dark) {
+    body {
+      background-color: var(--background-color-dark);
+    }
+  }
+  
\ No newline at end of file
diff --git a/styles/hljs-tomorrow.css b/styles/hljs-tomorrow.css
index 58123fa..ea4eac8 100644
--- a/styles/hljs-tomorrow.css
+++ b/styles/hljs-tomorrow.css
@@ -1,12 +1,9 @@
 /*
   Copyright 2022 the JSDoc Authors.
-
   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.
   You may obtain a copy of the License at
-
       https://www.apache.org/licenses/LICENSE-2.0
-
   Unless required by applicable law or agreed to in writing, software
   distributed under the License is distributed on an "AS IS" BASIS,
   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
@@ -17,25 +14,29 @@
 /* Tomorrow theme for Highlight.js */
 /* Based on https://github.com/chriskempson/tomorrow-theme */
 
+
+
 :root {
-  --text-color: #3d3d3c;
-  --tomorrow-blue: #4271ae;
-  --tomorrow-gray: #8e908c;
-  --tomorrow-green: #718c00;
-  --tomorrow-orange: #f5871f;
-  --tomorrow-purple: #8959a8;
-  --tomorrow-red: #c82829;
-  --tomorrow-yellow: #c99e00;
+  --text-color-light: #1e293b; 
+  --text-color-dark: #ffffff; 
+  --tomorrow-blue: #6366f1; 
+  --tomorrow-gray: #6b7280; 
+  --tomorrow-green: #48bb78; 
+  --tomorrow-orange: #f59e0b; 
+  --tomorrow-purple: #9f7aea; 
+  --tomorrow-red: #ef4444; 
+  --tomorrow-yellow: #f9ca24; 
 }
 
 .hljs,
 .no-hljs {
-  color: var(--text-color);
+  color: var(--text-color-light);
+  font-family: 'Inter', sans-serif; 
 }
 
 .hljs-code,
 .hljs-formula {
-  color: var(--text-color);
+  color: var(--text-color-light);
 }
 
 .hljs-comment,
@@ -110,3 +111,109 @@
 .hljs-strong {
   font-weight: bold;
 }
+
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --text-color-light: #ffffff; 
+    --background-color-light: #1e293b; 
+  }
+
+  body {
+    background-color: var(--background-color-light);
+  }
+
+  .github-ribbon {
+    background-color: #1d212e; 
+  }
+
+  pre {
+    background-color: #1d212e; 
+  }
+  .hljs,
+  .no-hljs {
+    color: var(--text-color-dark); 
+    font-family: 'Inter', sans-serif; 
+  }
+  
+  .hljs-code,
+  .hljs-formula {
+    color: var(--text-color-dark); 
+  }
+  
+  .hljs-comment,
+  .hljs-quote {
+    color: var(--tomorrow-gray);
+  }
+  
+  .hljs-deletion,
+  .hljs-meta .hljs-keyword,
+  .hljs-name,
+  .hljs-property,
+  .hljs-regexp,
+  .hljs-selector-attr,
+  .hljs-selector-class,
+  .hljs-selector-id,
+  .hljs-selector-pseudo,
+  .hljs-substr,
+  .hljs-tag,
+  .hljs-template-tag,
+  .hljs-template-variable,
+  .hljs-variable,
+  .hljs-variable.language_ {
+    color: var(--tomorrow-red);
+  }
+  
+  .hljs-built_in,
+  .hljs-char.escape_,
+  .hljs-link,
+  .hljs-literal,
+  .hljs-meta,
+  .hljs-number,
+  .hljs-operator,
+  .hljs-params,
+  .hljs-type {
+    color: var(--tomorrow-orange);
+  }
+  
+  .hljs-attribute {
+    color: var(--tomorrow-yellow);
+  }
+  
+  .hljs-addition,
+  .hljs-attr,
+  .hljs-bullet,
+  .hljs-meta .hljs-string,
+  .hljs-string,
+  .hljs-subst,
+  .hljs-symbol,
+  .hljs-title.class_.inherited__,
+  .hljs-title.function_ {
+    color: var(--tomorrow-green);
+  }
+  
+  .hljs-punctuation,
+  .hljs-section,
+  .hljs-title {
+    color: var(--tomorrow-blue);
+  }
+  
+  .hljs-keyword,
+  .hljs-meta.hljs-keyword,
+  .hljs-selector-tag,
+  .hljs-title.class_ {
+    color: var(--tomorrow-purple);
+  }
+  
+  .hljs-emphasis {
+    font-style: italic;
+  }
+  
+  .hljs-doctag,
+  .hljs-strong {
+    font-weight: bold;
+  }
+  
+
+}
+
diff --git a/styles/usejsdoc.css b/styles/usejsdoc.css
index 6c285fa..03ad02f 100644
--- a/styles/usejsdoc.css
+++ b/styles/usejsdoc.css
@@ -1,80 +1,112 @@
-body {
-    font: 1em 'Helvetica Neue', Helvetica, Arial, sans-serif;
+:root {
+    --background-color-light: #ffffff; 
+    --background-color-dark: #1a202c; 
+    --text-color-light: #1e293b; 
+    --text-color-dark: #ffffff; 
+    --tomorrow-blue: #6366f1; 
+    --tomorrow-gray: #6b7280; 
+    --tomorrow-green: #48bb78; 
+    --tomorrow-orange: #f59e0b; 
+    --tomorrow-purple: #9f7aea; 
+    --tomorrow-red: #ef4444; 
+    --tomorrow-yellow: #f9ca24; 
+  }
+  
+  
+  /* Modo Claro */
+  body {
+    font-family: 'Inter', sans-serif;
     padding: 0;
     margin: 0;
-}
-
-a, a:visited, a:active {
-    color: #605C89;
-}
-
-header {
-    background-color: #EBEBEB;
-    color: #006FBB;
+    background-color: var(--background-color-light);
+    color: var(--text-color-light);
+    line-height: 1.6;
+    box-sizing: border-box;
+    width: 100%;
+  }
+  
+  a, a:visited, a:active {
+    color: var(--tomorrow-blue);
+    text-decoration: none;
+  }
+  
+  a:hover {
+    color: #4338ca;
+  }
+  
+  header {
+    background-color: #fff;
+    color: #111827;
     margin: 0;
     margin-bottom: 32px;
-    padding: 18px;
+    padding: 18px 20px;
     font-size: 2.4em;
     font-weight: bold;
-    border-bottom: 1px #C6C6C6 solid;
-}
-
-header a, header a:visited {
-    color: #006FBB;
-    text-decoration: none;
-}
-
-article {
-    margin: 18px;
-}
-
-footer {
+    border-bottom: 1px solid #e5e7eb;
+    text-align: center;
+  }
+  
+  article {
+    max-width: 1040px;
+    margin: 0 auto;
+    padding: 20px;
+    background-color: #fff;
+    border-radius: 5px;
+  }
+  
+  footer {
     margin: 16px;
     margin-top: 32px;
     font-style: italic;
     font-size: 0.8em;
-}
-
-h1, h2, h3, h4, h5, h6 {
-    color: #B93A38;
-}
-
-h1 {
-    font-size: 1.428em;
-    text-indent: 0;
-}
-
-h2 {
-    font-size: 1.285em;
-    text-indent: 1%;
-}
-
-h3 {
-    font-size: 1.142em;
-    text-indent: 2%;
-}
-
-h4 {
-    font-size: 1em;
-    text-indent: 3%;
-}
-
-h5 {
-    font-size: 0.857em;
-    text-indent: 4%;
-}
-
-h6 {
-    font-size: 0.714em;
-    text-indent: 5%;
-}
-
-p {
-    text-indent: 2%;
-}
-
-figure pre code {
-    font-size: 0.857em;
+    text-align: center;
+    color: #6b7280;
+  }
+  
+  h1, h2, h3, h4, h5, h6 {
+    color: #111827;
+    margin: 0;
+    margin-top: 24px;
+  }
+  
+  p {
+    margin: 0 0 16px;
+  }
+  
+  code {
+    font-family: 'Fira Code', monospace;
+    background-color: #f9fafb;
+    padding: 2px 4px;
+    border-radius: 3px;
+  }
+  
+  pre {
+    display: block;
+    border: 1px solid #e5e7eb;
+    margin: 8px auto 5px;
+    padding: 10px;
+    white-space: pre-wrap;
+    background-color: #f9fafb;
+    overflow-x: auto;
+    border-radius: 5px;
+  }
+  
+  table {
+    width: 100%;
+    border-collapse: collapse;
+  }
+  
+  th, td {
+    border: 1px solid #e5e7eb;
+    padding: 8px;
+  }
+  
+  th {
+    background-color: #f3f4f6;
+    color: #1a202c;
+  }
+  figure {
+    margin: 0;
 }
 
 figcaption {
@@ -82,61 +114,66 @@ figcaption {
 }
 
 dl {
-    margin-left: 2%;
-    padding-left: 0;
+    margin: 0;
+    padding: 0;
 }
 
 dt {
-    margin-left: 16px;
-    padding-left: 4px;
-    margin-top: 8px;
-}
-
-dt a, dt a:visited {
-    color: #3E00B6;
+    font-weight: bold;
 }
 
 dd {
-    margin-left: 16px;
-    padding-left: 4px;
-}
-
-ol, ul {
-    margin-left: 2%;
-}
-
-code {
-    font: 0.9em Consolas, "Lucida Console", Monaco, monospace;
-    background-color: #DEDEDE;
-}
-
-pre {
-    display: block;
-    border: 1px solid #999;
-    margin: 12px;
-    padding: 8px;
-    white-space: pre-wrap;
-    background-color: #DEDEDE;
-}
-
-table {
-    border-collapse: collapse;
-}
-
-th, td {
-    border: 1px solid #999;
-}
-
-th {
-    background-color: #DEDEDE;
-    color: #B93A38;
+    margin: 0;
+    padding: 0;
 }
-
-.example dt {
+  
+  .example dt {
     font-weight: bold;
-}
-
-.license-badge {
+  }
+  
+  .license-badge {
     border-width: 0;
     text-decoration: none;
-}
+    color: #6366f1;
+  }
+  
+  /* Modo Escuro */
+  @media (prefers-color-scheme: dark) {
+    body, article, header, footer, a, a:visited, a:active, h1, h2, h3, h4, h5, h6, p, code, table, th, td, .example dt, .license-badge {
+      background-color: var(--background-color-dark);
+      color: var(--text-color-dark);
+    }
+    pre code {
+        background-color: var(--background-color-dark);
+        color: #ffffff;
+      }
+  
+    a, a:visited, a:active {
+      color: var(--tomorrow-purple);
+    }
+  
+    header {
+      border-bottom-color: #4a5568;
+    }
+  
+    th, td {
+      border-color: #4a5568;
+    }
+    .hljs .language-js {
+        color: #48bb78;
+    }
+    pre {
+        background-color: var(--background-color-dark);
+      color: #ffffff;
+      border-color: #4a5568;
+    }
+  
+    .example dt {
+      color: #ffffff;
+    }
+  
+    .license-badge {
+      color: var(--tomorrow-purple);
+    }
+  }
+  
\ No newline at end of file