diff --git a/CHANGELOG.md b/CHANGELOG.md
index d6e2d2c..1bff00c 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,60 +1,20 @@
 # Changelog
 
-## v0.1.20
+## v0.2.0
 
-### Added focus interaction on focusable elements
-  - `/src/scss/animation.scss`
+### Added the universal prop `nostyle` and added the functions `cn()` and `opt()` that make it work.
+  - Removed `/deps.ts`
+  - `/src/types.ts`
+  - `/src/utils.ts`
+  - `/components/**/setup.ts`
+
+### Minor updates
+  - `/import_map.json`
   - `/src/scss/components.scss`
-  - `/src/scss/index.scss`
+  - `/static/style.css`
 
 ## Roadmap
 
-### v0.1
-
-  - [x] Update all components to GarliCSS and display on index route.
-  - [x] Document all needed fixes and upgrades possible using this structure:
-    - Add a comment where the fix should be added using the `@todo`.
-    - Grade the fix using one to three `!`s.
-      - `!!!`: Urgent
-      - `!!`: Before next version.
-      - `!`: After next version.
-      - ` `: Whenever
-      - `?`: Possible fix, question it later.
-    - Substitue the `Features` section of this document to a list of every feature with its pending.
-  - [x] Fix `!!`s and `!!!`s.
-  - [x] Reorganize project structure
-    - [x] Every component has its own directory.
-    - [x] Every component directory contains a setup file.
-    - [x] Every setup file contains the prop type (`iComponent`).
-    - [x] Every value inside a prop type (`iComponent`) must not be optional
-      - Use a default value of null instead of undefined, in types where undefined is a useful option.
-  - [x] Fix the fwd ref problem.
-    - [x] Card
-    - [x] Code
-    - [x] Footer
-    - [x] Header
-    - [x] Input
-    - [x] Layout
-    - [x] Linkmap
-    - [x] Main
-    - [x] Navigation
-    - [x] Select
-    - [x] Textarea
-  - [x] Do a documentation cleanup.
-    - [x] Readme.md
-      - [x] Features
-        - [x] List of components.
-        - [x] Component configuration example.
-        - [x] Utilities
-      - [x] Installation guide
-      - [x] Usage guide
-  - [x] Minor Fixes
-    - [x] Rename elements.ts to types.ts
-    - [x] Move system scss modules to its own directory
-    - [x] Removed the components scss directory
-    - [x] Take back enums structure and change it to string union types.
-    - [ ] Globalize the prop 'nostyle' on all components.
-
 ### v0.2
 
   - [ ] Update components to GarliCSS animations.
diff --git a/components/Button/setup.ts b/components/Button/setup.ts
index daaf62b..d90238b 100644
--- a/components/Button/setup.ts
+++ b/components/Button/setup.ts
@@ -1,5 +1,4 @@
-import { cn } from '../../deps.ts';
-import { applyDefaults, partializeClasses } from '../../src/utils.ts';
+import { cn, opt, applyDefaults, partializeClasses } from '../../src/utils.ts';
 import { BUTTON_TYPES } from '../../src/enums.ts';
 import { iExtendedElement } from '../../src/types.ts';
 
@@ -17,20 +16,23 @@ export default (props: Partial<iButton>) => {
   const p = applyDefaults<iButton>(defaults, props);
 
   const classes = partializeClasses({
-    button: cn(
-      'comp-button',
-      props.type === 'disabled'
-        ? 'clr-bg-disabled'
-        : props.type === 'error'
-        ? 'clr-bg-error'
-        : props.type === 'invisible'
-        ? 'comp-button_invisible'
-        : props.type === 'panel'
-        ? 'comp-button_panel'
-        : props.type === 'contrast'
-        ? 'clr-bg-input'
-        : 'clr-bg-input',
-      props.class
+    button: opt(
+      cn(
+        'comp-button',
+        props.type === 'disabled'
+          ? 'clr-bg-disabled'
+          : props.type === 'error'
+          ? 'clr-bg-error'
+          : props.type === 'invisible'
+          ? 'comp-button_invisible'
+          : props.type === 'panel'
+          ? 'comp-button_panel'
+          : props.type === 'contrast'
+          ? 'clr-bg-input'
+          : 'clr-bg-input'
+      ),
+      p.class,
+      p.nostyle
     ),
   });
 
diff --git a/components/Card/setup.ts b/components/Card/setup.ts
index 1e0b93f..e15a902 100644
--- a/components/Card/setup.ts
+++ b/components/Card/setup.ts
@@ -1,5 +1,4 @@
-import { cn } from '../../deps.ts';
-import { applyDefaults, partializeClasses } from '../../src/utils.ts';
+import { cn, opt, applyDefaults, partializeClasses } from '../../src/utils.ts';
 import { iExtendedElement, iFwd } from '../../src/types.ts';
 
 export type iCard = iExtendedElement<HTMLDivElement> & {
@@ -15,9 +14,11 @@ const defaults: iCard = {
 export default (props: Partial<iCard>) => {
   const p = applyDefaults<iCard>(defaults, props);
 
+  const { panel } = p.fwd;
+
   const classes = partializeClasses({
-    card: cn('comp-card clr-bg-panel', p.class),
-    panel: cn(p.fwd.panel?.class),
+    card: opt(cn('comp-card clr-bg-panel'), p.class, p.nostyle),
+    panel: cn(panel?.class),
   });
 
   delete p.class;
diff --git a/components/Code/setup.ts b/components/Code/setup.ts
index d0c62bc..0e66cf9 100644
--- a/components/Code/setup.ts
+++ b/components/Code/setup.ts
@@ -1,5 +1,4 @@
-import { cn } from '../../deps.ts';
-import { applyDefaults, partializeClasses } from '../../src/utils.ts';
+import { cn, opt, applyDefaults, partializeClasses } from '../../src/utils.ts';
 import { iExtendedElement, iFwd } from '../../src/types.ts';
 
 export type iCode = iExtendedElement & {
@@ -15,9 +14,11 @@ const defaults: iCode = {
 export default (props: Partial<iCode>) => {
   const p = applyDefaults<iCode>(defaults, props);
 
+  const { wrapper } = p.fwd;
+
   const classes = partializeClasses({
-    code: cn('comp-code clr-txt-personality', p.class),
-    wrapper: cn('comp-code_wrapper clr-bg-panel', p.fwd.wrapper?.class),
+    code: opt(cn('comp-code clr-txt-personality', p.class), p.nostyle),
+    wrapper: opt(cn('comp-code_wrapper clr-bg-panel', wrapper?.class), wrapper?.nostyle),
   });
 
   delete p.class;
diff --git a/components/Footer/setup.ts b/components/Footer/setup.ts
index 59733ff..e1840a0 100644
--- a/components/Footer/setup.ts
+++ b/components/Footer/setup.ts
@@ -1,5 +1,4 @@
-import { cn } from '../../deps.ts';
-import { applyDefaults, partializeClasses } from '../../src/utils.ts';
+import { cn, opt, applyDefaults, partializeClasses } from '../../src/utils.ts';
 import { iExtendedElement, iFwd } from '../../src/types.ts';
 import { LAYOUT_TYPES } from '../../src/enums.ts';
 
@@ -30,13 +29,15 @@ export default (props: Partial<iFooter>) => {
 
   const p = applyDefaults<iFooter>(defaults, props);
 
+  const { layout, panel, badge_link, badge_dark, badge_light } = p.fwd;
+
   const classes = partializeClasses({
-    footer: cn('comp-footer', p.class),
-    layout: cn(p.fwd.layout?.class),
-    panel: cn(p.fwd.panel?.class),
-    badge_link: cn('made-with-fresh', p.fwd.badge_link?.class),
-    badge_light: cn('fresh-badge light', p.fwd.badge_light?.class),
-    badge_dark: cn('fresh-badge dark', p.fwd.badge_dark?.class),
+    footer: opt(cn('comp-footer'), p.class, p.nostyle),
+    layout: cn(layout?.class),
+    panel: cn(panel?.class),
+    badge_link: opt(cn('made-with-fresh'), badge_link?.class, badge_link?.nostyle),
+    badge_light: opt(cn('fresh-badge light'), badge_light?.class, badge_light?.nostyle),
+    badge_dark: opt(cn('fresh-badge dark'), badge_dark?.class, badge_dark?.nostyle),
   });
 
   delete p.class;
diff --git a/components/Header/setup.ts b/components/Header/setup.ts
index 5dc804b..04605e7 100644
--- a/components/Header/setup.ts
+++ b/components/Header/setup.ts
@@ -1,5 +1,4 @@
-import { cn } from '../../deps.ts';
-import { applyDefaults, partializeClasses } from '../../src/utils.ts';
+import { cn, opt, applyDefaults, partializeClasses } from '../../src/utils.ts';
 import { iExtendedElement, iFwd } from '../../src/types.ts';
 import { LAYOUT_TYPES } from '../../src/enums.ts';
 
@@ -21,10 +20,12 @@ const defaults: iHeader = {
 export default (props: Partial<iHeader>) => {
   const p = applyDefaults<iHeader>(defaults, props);
 
+  const { layout, panel } = p.fwd;
+
   const classes = partializeClasses({
-    header: cn('comp-header', p.class),
-    layout: cn(p.fwd.layout?.class),
-    panel: cn(p.banner ? 'comp-header_banner' : null, p.fwd.panel?.class),
+    header: opt(cn('comp-header'), p.class, p.nostyle),
+    layout: cn(layout?.class),
+    panel: opt(cn(p.banner ? 'comp-header_banner' : null), panel?.class, panel?.nostyle),
   });
 
   delete p.class;
diff --git a/components/Input/setup.ts b/components/Input/setup.ts
index b368f09..9f847b8 100644
--- a/components/Input/setup.ts
+++ b/components/Input/setup.ts
@@ -1,5 +1,4 @@
-import { cn } from '../../deps.ts';
-import { applyDefaults, partializeClasses } from '../../src/utils.ts';
+import { cn, opt, applyDefaults, partializeClasses } from '../../src/utils.ts';
 import { iExtendedElement, iFwd } from '../../src/types.ts';
 
 export type iInput = iExtendedElement<HTMLInputElement> & {
@@ -26,27 +25,32 @@ const defaults: iInput = {
 export default (props: Partial<iInput>) => {
   const p = applyDefaults<iInput>(defaults, props);
 
+  const { text, label, error, required, container } = p.fwd;
+
   const classes = partializeClasses({
-    input: cn(
-      'comp-input',
-      p.error ? 'clr-bg-error' : p.disabled ? 'clr-bg-disabled' : 'clr-bg-input',
-      p.class
+    input: opt(
+      cn('comp-input', p.error ? 'clr-bg-error' : p.disabled ? 'clr-bg-disabled' : 'clr-bg-input'),
+      p.class,
+      p.nostyle
     ),
-    text: cn('select-none', p.fwd.text?.class),
-    label: cn('comp-input_label', p.fwd.label?.class),
-    error: cn('comp-input_error clr-txt-error', p.fwd.error?.class),
-    required: cn('comp-input_required clr-txt-error', p.fwd.text?.class),
-    container: cn(
-      'comp-input_container',
-      p.type && ['button', 'image', 'reset', 'submit'].includes(p.type)
-        ? 'comp-input_button'
-        : p.type && ['radio', 'checkbox'].includes(p.type)
-        ? 'comp-input_bool'
-        : p.type && ['datetime-local', 'date', 'month', 'time', 'week'].includes(p.type)
-        ? 'comp-input_date'
-        : 'comp-input_box',
-      p.maxWidth ? 'comp-input_maxwidth' : null,
-      p.fwd.container?.class
+    text: opt(cn('select-none'), text?.class, text?.nostyle),
+    label: opt(cn('comp-input_label'), label?.class, label?.nostyle),
+    error: opt(cn('comp-input_error clr-txt-error'), error?.class, error?.nostyle),
+    required: opt(cn('comp-input_required clr-txt-error'), required?.class, required?.nostyle),
+    container: opt(
+      cn(
+        'comp-input_container',
+        p.type && ['button', 'image', 'reset', 'submit'].includes(p.type)
+          ? 'comp-input_button'
+          : p.type && ['radio', 'checkbox'].includes(p.type)
+          ? 'comp-input_bool'
+          : p.type && ['datetime-local', 'date', 'month', 'time', 'week'].includes(p.type)
+          ? 'comp-input_date'
+          : 'comp-input_box',
+        p.maxWidth ? 'comp-input_maxwidth' : null
+      ),
+      container?.class,
+      container?.nostyle
     ),
   });
 
diff --git a/components/Layout/setup.ts b/components/Layout/setup.ts
index 72f4d69..7bf00ba 100644
--- a/components/Layout/setup.ts
+++ b/components/Layout/setup.ts
@@ -1,5 +1,4 @@
-import { cn } from '../../deps.ts';
-import { applyDefaults, partializeClasses } from '../../src/utils.ts';
+import { cn, opt, applyDefaults, partializeClasses } from '../../src/utils.ts';
 import { iExtendedElement, iFwd } from '../../src/types.ts';
 import { LAYOUT_TYPES } from '../../src/enums.ts';
 
@@ -18,9 +17,11 @@ const defaults: iLayout = {
 export default (props: Partial<iLayout>) => {
   const p = applyDefaults<iLayout>(defaults, props);
 
+  const { module } = p.fwd;
+
   const classes = partializeClasses({
-    layout: cn(`comp-grid comp-layout-${p.type}`, p.class),
-    module: cn('comp-layout-module', p.fwd.module?.class),
+    layout: opt(cn(`comp-grid comp-layout-${p.type}`), p.class, p.nostyle),
+    module: opt(cn('comp-layout-module'), module?.class, module?.nostyle),
   });
 
   delete p.class;
diff --git a/components/Link/setup.ts b/components/Link/setup.ts
index 295d7d2..a6851e0 100644
--- a/components/Link/setup.ts
+++ b/components/Link/setup.ts
@@ -1,20 +1,13 @@
-import { cn } from '../../deps.ts';
-import { applyDefaults, partializeClasses } from '../../src/utils.ts';
+import { cn, opt, partializeClasses } from '../../src/utils.ts';
 import { iExtendedElement } from '../../src/types.ts';
 
-export type iLink = iExtendedElement<HTMLAnchorElement> & {
-  nostyle: boolean;
-};
-
-const defaults: iLink = {
-  nostyle: false,
-};
+export type iLink = iExtendedElement<HTMLAnchorElement>;
 
 export default (props: Partial<iLink>) => {
-  const p = applyDefaults<iLink>(defaults, props);
+  const p = props;
 
   const classes = partializeClasses({
-    link: cn(p.nostyle ? null : 'comp-link clr-txt-personality', p.class),
+    link: opt(cn('comp-link clr-txt-personality'), p.class, p.nostyle),
   });
 
   delete p.class;
diff --git a/components/Linkmap/setup.ts b/components/Linkmap/setup.ts
index 39874a1..ad14075 100644
--- a/components/Linkmap/setup.ts
+++ b/components/Linkmap/setup.ts
@@ -1,5 +1,4 @@
-import { cn } from '../../deps.ts';
-import { applyDefaults, partializeClasses } from '../../src/utils.ts';
+import { cn, opt, applyDefaults, partializeClasses } from '../../src/utils.ts';
 import { iExtendedElement, iFwd } from '../../src/types.ts';
 
 export type iLinkmapitem = {
@@ -26,9 +25,11 @@ const defaults: iLinkmap = {
 export default (props: Partial<iLinkmap>) => {
   const p = applyDefaults<iLinkmap>(defaults, props);
 
+  const { list } = p.fwd;
+
   const classes = partializeClasses({
-    linkmap: cn('comp-linkmap', p.class),
-    list: cn('comp-linkmap_list', p.fwd.list?.class),
+    linkmap: opt(cn('comp-linkmap'), p.class, p.nostyle),
+    list: opt(cn('comp-linkmap_list'), list?.class, list?.nostyle),
     item: cn(p.fwd.item?.class),
     link: cn(p.fwd.link?.class),
     text: cn(p.fwd.text?.class),
diff --git a/components/Main/setup.ts b/components/Main/setup.ts
index e199e21..d807947 100644
--- a/components/Main/setup.ts
+++ b/components/Main/setup.ts
@@ -1,5 +1,4 @@
-import { cn } from '../../deps.ts';
-import { applyDefaults, partializeClasses } from '../../src/utils.ts';
+import { cn, opt, applyDefaults, partializeClasses } from '../../src/utils.ts';
 import { iExtendedElement, iFwd } from '../../src/types.ts';
 import { LAYOUT_TYPES } from '../../src/enums.ts';
 
@@ -18,9 +17,11 @@ const defaults: iMain = {
 export default (props: Partial<iMain>) => {
   const p = applyDefaults<iMain>(defaults, props);
 
+  const { layout } = p.fwd;
+
   const classes = partializeClasses({
-    main: cn('comp-main clr-bg-page', p.class),
-    layout: cn(p.fwd.layout?.class),
+    main: opt(cn('comp-main clr-bg-page'), p.class, p.nostyle),
+    layout: cn(layout?.class),
   });
 
   delete p.class;
diff --git a/components/Navigation/setup.ts b/components/Navigation/setup.ts
index 0d0294c..a32a6aa 100644
--- a/components/Navigation/setup.ts
+++ b/components/Navigation/setup.ts
@@ -1,5 +1,4 @@
-import { cn } from '../../deps.ts';
-import { applyDefaults, partializeClasses } from '../../src/utils.ts';
+import { cn, opt, applyDefaults, partializeClasses } from '../../src/utils.ts';
 import { iExtendedElement, iFwd } from '../../src/types.ts';
 
 export type iNavigation = iExtendedElement & {
@@ -19,11 +18,13 @@ const defaults: iNavigation = {
 export default (props: Partial<iNavigation>) => {
   const p = applyDefaults<iNavigation>(defaults, props);
 
+  const { wrapper, panel, layout } = p.fwd;
+
   const classes = partializeClasses({
-    nav: cn('comp-navigation', p.class),
-    wrapper: cn('comp-navigation_wrapper', p.fwd.wrapper?.class),
-    panel: cn(p.fwd.panel?.class),
-    layout: cn(p.fwd.layout?.class),
+    nav: opt(cn('comp-navigation'), p.class, p.nostyle),
+    wrapper: opt(cn('comp-navigation_wrapper'), wrapper?.class, wrapper?.nostyle),
+    panel: cn(panel?.class),
+    layout: cn(layout?.class),
   });
 
   delete p.class;
diff --git a/components/Panel/setup.ts b/components/Panel/setup.ts
index f928798..3a815a1 100644
--- a/components/Panel/setup.ts
+++ b/components/Panel/setup.ts
@@ -1,17 +1,13 @@
-import { cn } from '../../deps.ts';
-import { partializeClasses } from '../../src/utils.ts';
+import { cn, opt, partializeClasses } from '../../src/utils.ts';
 import { iExtendedElement } from '../../src/types.ts';
 
 export type iPanel = iExtendedElement<HTMLDivElement>;
 
-// const defaults: iPanel = {};
-
 export default (props: Partial<iPanel>) => {
   const p = props;
-  // const p = applyDefaults<iSeparator>(defaults, props);
 
   const classes = partializeClasses({
-    panel: cn('comp-panel clr-bg-panel', p.class),
+    panel: opt(cn('comp-panel clr-bg-panel'), p.class, p.nostyle),
   });
 
   delete p.class;
diff --git a/components/Select/setup.ts b/components/Select/setup.ts
index 75b4cf4..6219ba7 100644
--- a/components/Select/setup.ts
+++ b/components/Select/setup.ts
@@ -1,5 +1,4 @@
-import { cn } from '../../deps.ts';
-import { applyDefaults, partializeClasses } from '../../src/utils.ts';
+import { cn, opt, applyDefaults, partializeClasses } from '../../src/utils.ts';
 import { iExtendedElement, iFwd } from '../../src/types.ts';
 
 export type iOption =
@@ -39,21 +38,23 @@ const defaults: iSelect = {
 export default (props: Partial<iSelect>) => {
   const p = applyDefaults<iSelect>(defaults, props);
 
+  const { text, label, option, error, required, container } = p.fwd;
+
   const classes = partializeClasses({
-    input: cn(
-      'comp-select',
-      p.error ? 'clr-bg-error' : p.disabled ? 'clr-bg-disabled' : 'clr-bg-input',
-      p.class
+    input: opt(
+      cn('comp-select', p.error ? 'clr-bg-error' : p.disabled ? 'clr-bg-disabled' : 'clr-bg-input'),
+      p.class,
+      p.nostyle
     ),
-    text: cn(p.fwd.text?.class),
-    option: cn(p.fwd.option?.class),
-    label: cn('comp-select_label', p.fwd.label?.class),
-    error: cn('comp-select_error clr-txt-error', p.fwd.error?.class),
-    required: cn('comp-select_required', p.fwd.required?.class),
-    container: cn(
-      'comp-select_container comp-input_box',
-      p.maxWidth ? 'w-full' : null,
-      p.fwd.container?.class
+    text: cn(text?.class),
+    option: cn(option?.class),
+    label: opt(cn('comp-select_label'), label?.class, label?.nostyle),
+    error: opt(cn('comp-select_error clr-txt-error'), error?.class, error?.nostyle),
+    required: opt(cn('comp-select_required'), required?.class, required?.nostyle),
+    container: opt(
+      cn('comp-select_container comp-input_box', p.maxWidth ? 'w-full' : null),
+      container?.class,
+      container?.nostyle
     ),
   });
 
diff --git a/components/Separator/setup.ts b/components/Separator/setup.ts
index a3e19f8..913fe70 100644
--- a/components/Separator/setup.ts
+++ b/components/Separator/setup.ts
@@ -1,17 +1,13 @@
-import { cn } from '../../deps.ts';
-import { partializeClasses } from '../../src/utils.ts';
+import { cn, opt, partializeClasses } from '../../src/utils.ts';
 import { iExtendedElement } from '../../src/types.ts';
 
 export type iSeparator = iExtendedElement<HTMLHRElement>;
 
-// const defaults: iSeparator = {};
-
 export default (props: Partial<iSeparator>) => {
   const p = props;
-  // const p = applyDefaults<iSeparator>(defaults, props);
 
   const classes = partializeClasses({
-    separator: cn('comp-separator'),
+    separator: opt(cn('comp-separator'), p.class, p.nostyle),
   });
 
   delete p.class;
diff --git a/components/Text/setup.ts b/components/Text/setup.ts
index 85778c7..15d4a24 100644
--- a/components/Text/setup.ts
+++ b/components/Text/setup.ts
@@ -1,5 +1,4 @@
-import { cn } from '../../deps.ts';
-import { applyDefaults, partializeClasses } from '../../src/utils.ts';
+import { cn, opt, applyDefaults, partializeClasses } from '../../src/utils.ts';
 import { TEXT_TYPES } from '../../src/enums.ts';
 import { iExtendedElement } from '../../src/types.ts';
 
@@ -25,16 +24,19 @@ export default (props: Partial<iText>) => {
   const p = applyDefaults<iText>(defaults, props);
 
   const classes = partializeClasses({
-    span: cn(
-      'comp-text',
-      `txt-${p.type}`,
-      ['display', 'title', 'heading'].includes(p.type) ? 'clr-txt-personality' : null,
-      p.compact ? 'compact' : null,
-      p.single ? 'single' : null,
-      p.noMargins ? 'no-margins' : null,
-      p.indent ? 'indent' : null,
-      p.inheritColor ? 'inherit-color' : null,
-      p.class
+    span: opt(
+      cn(
+        'comp-text',
+        `txt-${p.type}`,
+        ['display', 'title', 'heading'].includes(p.type) ? 'clr-txt-personality' : null,
+        p.compact ? 'compact' : null,
+        p.single ? 'single' : null,
+        p.noMargins ? 'no-margins' : null,
+        p.indent ? 'indent' : null,
+        p.inheritColor ? 'inherit-color' : null
+      ),
+      p.class,
+      p.nostyle
     ),
   });
 
diff --git a/components/TextArea/setup.ts b/components/TextArea/setup.ts
index 15b5ca4..d6d50f8 100644
--- a/components/TextArea/setup.ts
+++ b/components/TextArea/setup.ts
@@ -1,5 +1,4 @@
-import { cn } from '../../deps.ts';
-import { applyDefaults, partializeClasses } from '../../src/utils.ts';
+import { cn, opt, applyDefaults, partializeClasses } from '../../src/utils.ts';
 import { iExtendedElement, iFwd } from '../../src/types.ts';
 
 export type iTextArea = iExtendedElement<HTMLTextAreaElement> & {
@@ -28,20 +27,26 @@ const defaults: iTextArea = {
 export default (props: Partial<iTextArea>) => {
   const p = applyDefaults<iTextArea>(defaults, props);
 
+  const { text, label, error, required, container } = p.fwd;
+
   const classes = partializeClasses({
-    input: cn(
-      'comp-textarea',
-      p.noResize ? 'resize-none' : null,
-      p.error ? 'clr-bg-error' : p.disabled ? 'clr-bg-disabled' : 'clr-bg-input'
+    input: opt(
+      cn(
+        'comp-textarea',
+        p.noResize ? 'resize-none' : null,
+        p.error ? 'clr-bg-error' : p.disabled ? 'clr-bg-disabled' : 'clr-bg-input'
+      ),
+      p.class,
+      p.nostyle
     ),
-    text: cn(p.fwd.text?.class),
-    label: cn('comp-textarea_label', p.fwd.label?.class),
-    error: cn('comp-textarea_error clr-txt-error', p.fwd.error?.class),
-    required: cn('comp-textarea_required clr-txt-error', p.fwd.required?.class),
-    container: cn(
-      'comp-textarea_container comp-input_box',
-      p.maxWidth ? 'w-full' : null,
-      p.fwd.container?.class
+    text: cn(text?.class),
+    label: opt(cn('comp-textarea_label'), label?.class, label?.nostyle),
+    error: opt(cn('comp-textarea_error clr-txt-error'), error?.class, error?.nostyle),
+    required: opt(cn('comp-textarea_required clr-txt-error'), required?.class, required?.nostyle),
+    container: opt(
+      cn('comp-textarea_container comp-input_box', p.maxWidth ? 'w-full' : null),
+      container?.class,
+      container?.nostyle
     ),
   });
 
diff --git a/deps.ts b/deps.ts
deleted file mode 100644
index abb6f02..0000000
--- a/deps.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-// Classnames
-import * as classNames from 'https://deno.land/x/classnames@0.1.1/index.ts';
-/** Shortner for `classNames.default` */
-export const cn = classNames.default;
diff --git a/import_map.json b/import_map.json
index 0a6675b..8eaa242 100644
--- a/import_map.json
+++ b/import_map.json
@@ -7,6 +7,7 @@
     "@preact/signals": "https://esm.sh/*@preact/signals@1.0.3",
     "@preact/signals-core": "https://esm.sh/*@preact/signals-core@1.0.1",
     "twind": "https://esm.sh/twind@0.16.17",
-    "twind/": "https://esm.sh/twind@0.16.17/"
+    "twind/": "https://esm.sh/twind@0.16.17/",
+    "classnames": "https://deno.land/x/classnames@0.1.1/index.ts"
   }
 }
diff --git a/src/scss/components.scss b/src/scss/components.scss
index e0a8231..edf4df9 100644
--- a/src/scss/components.scss
+++ b/src/scss/components.scss
@@ -170,7 +170,6 @@
 
 // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
 // Input
-/// @todo [!!!] `<Select />` innert text is slightly lower than it should be.
 .comp-input,
 .comp-textarea,
 .comp-select {
@@ -212,7 +211,7 @@
   }
 
   .comp-select {
-    padding: var(--s-eighth) var(--s-half);
+    padding: 0 var(--s-half);
     height: var(--s-one-and-half);
     @include appearance-none;
 
diff --git a/src/types.ts b/src/types.ts
index 5ebc3b9..6752c44 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -17,17 +17,18 @@ import { JSX, Ref } from 'preact';
 export type iExtendedElement<T extends EventTarget = HTMLElement> = JSX.HTMLAttributes<T> &
   Partial<ARIAMixin> &
   Partial<GlobalEventHandlers> & {
+    nostyle?: boolean;
     fref?: Ref<T>;
   };
 
 /**
- *  @todo [!!] Complete documentation
+ *  This type is a shorthand that helps in forwarding props and references to a component's part.
  */
 export type iFwd<T extends EventTarget = HTMLElement> = iExtendedElement<T> & {
   ref?: Ref<T>;
 };
 
 /**
- *  @todo [!!] Complete documentation
+ * This type is a shorthand of `Record<string | number | symbol, never>` that `deno-lint(ban-types) recommends as the correct way to express the type of an empty object.`.
  */
 export type EmptyObject = Record<string | number | symbol, never>;
diff --git a/src/utils.ts b/src/utils.ts
index 80e7609..2862587 100644
--- a/src/utils.ts
+++ b/src/utils.ts
@@ -9,11 +9,40 @@
  * @module
  */
 
+import * as classNames from 'classnames';
 import { EmptyObject } from './types.ts';
 
 // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
 /**
- * @todo [!!] Complete documentation
+ * This function is a shorthand for `classNames.default(...classNames: any[]): string`
+ * @param {any[]} classNames
+ * @returns {string}
+ */
+export const cn = classNames.default;
+
+// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
+/**
+ * This function makes final `classNames` (the result of the `cn()` function) optional and allows a
+ * custom class to be appended or to override it altogether.
+ *
+ * @param {string} className
+ *  The library's assigned final `className` string, created using the `cn()` function.
+ *
+ * @param {string | undefined} customClassName
+ *  It is to be appended to or replace the library's `className`.
+ *
+ * @param {boolean | undefined} nostyle
+ *  True if the `className` string should be ignored.
+ *
+ * @returns {string}
+ *  `"${nostyle ? '' : className} ${customClassName}"`
+ */
+export const opt = (className: string, customClassName?: string, nostyle?: boolean) =>
+  `${nostyle ? '' : className} ${customClassName}`;
+
+// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
+/**
+ * @todo [!] Complete documentation
  */
 export function getDocumentation(relativeUrl: string, fileNames: string[]) {
   const doc: { [key: string]: string } = {};
@@ -53,42 +82,32 @@ export function applyDefaults<T extends {}>(d: T, i: Partial<T>): T {
 
 // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
 /**
- * @todo [!!] Complete documentation
- */
-export const partializeClasses = (classes: Record<string, string>) =>
-  dMap<string | undefined>(classes, (entry) => (entry === '' ? undefined : entry));
-
-// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
-/**
- * @todo [!!] Complete documentation
+ * When adding class to an element, say: `<div class={x} />` and `x`'s value ends up being an empty string (`''`), the element will render `<div class />` and end up with tons of empty `class` attributes. This function simplifies the code that replaces parts that end up having an empty string and makes them have `undefined` value.
+ *
+ * @param {Record<string, string>}
+ *  The record of parts that might contain empty string values.
+ *
+ * @returns {Record<string, string | undefined>}
+ *  A new record of the same parts but an `undefined` value replaced empty string values.
  */
-export const bring = async <ResponseObject>(
-  url: string,
-  method?: 'GET' | 'POST',
-  body?: BodyInit | null
-): Promise<ResponseObject> =>
-  (await fetch(url, {
-    method: method,
-    body: body,
-  }).then(async (res) => {
-    return await res.json();
-  })) as ResponseObject;
+export const partializeClasses = (classes: Record<string, string>): Record<string, string | undefined> =>
+  rMap<string | undefined>(classes, (entry) => (entry === '' ? undefined : entry));
 
 // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
 /**
  * This function emulates the behavior of `Array.prototype.map()` in Records. It calls a function
  * passing each entry of the record as an argument.
  *
- * @param {Dictionary<T>} record
+ * @param {Record<T>} record
  *  The record to be mapped.
  *
  * @param {function} callback
- *  The function that will map the entries of the dictionary.
+ *  The function that will map the entries of the record.
  *
- * @returns {Dictionary<T>}
- *  A new dictionary with each entry mapped to the function.
+ * @returns {Record<T>}
+ *  A new cord with each entry mapped to the function.
  */
-export function dMap<T>(
+export function rMap<T>(
   record: Record<string, T>,
   callback: (entry: T, key?: string) => T
 ): Record<string, T> {
diff --git a/static/style.css b/static/style.css
index 085afa2..021e7d6 100644
--- a/static/style.css
+++ b/static/style.css
@@ -468,7 +468,7 @@ button {
   opacity: 0.75;
 }
 .comp-input_box .comp-select {
-  padding: var(--s-eighth) var(--s-half);
+  padding: 0 var(--s-half);
   height: var(--s-one-and-half);
   appearance: none;
   -moz-appearance: none;