diff --git a/.vscode/settings.json b/.vscode/settings.json
index dd8c5e7aa..85611a5b1 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -42,6 +42,7 @@
     "cmdline",
     "commandline",
     "concat",
+    "coord",
     "crossterm",
     "curr",
     "cvar",
diff --git a/src/app.rs b/src/app.rs
index 01899c002..0783b2b90 100644
--- a/src/app.rs
+++ b/src/app.rs
@@ -11,7 +11,9 @@ use layout_manager::*;
 pub use states::*;
 
 use crate::{
-    canvas, constants,
+    canvas,
+    components::ScrollDirection,
+    constants,
     options::Config,
     options::ConfigFlags,
     options::WidgetIdEnabled,
@@ -126,6 +128,7 @@ pub struct App {
     pub filters: DataFilters,
     pub config: Config,
     pub config_path: Option<PathBuf>,
+    pub config_page_settings: Vec<MainConfigState>,
 }
 
 impl App {
@@ -1236,7 +1239,7 @@ impl App {
                 }
             }
             'C' => {
-                // self.open_config(),
+                // self.open_config_screen();
             }
             'c' => {
                 if let BottomWidgetType::Proc = self.current_widget.widget_type {
@@ -2593,6 +2596,7 @@ impl App {
         }
 
         // Now handle click propagation down to widget.
+        // self.current_widget.on_click(MouseButton::Left, Coordinate {x, y});
         if let Some((_tlc_x, tlc_y)) = &self.current_widget.top_left_corner {
             match &self.current_widget.widget_type {
                 BottomWidgetType::Proc
diff --git a/src/app/process_killer.rs b/src/app/process_killer.rs
index e367d99c8..8a3646852 100644
--- a/src/app/process_killer.rs
+++ b/src/app/process_killer.rs
@@ -36,6 +36,7 @@ pub fn kill_process_given_pid(pid: Pid) -> crate::utils::error::Result<()> {
     if cfg!(target_family = "unix") {
         #[cfg(any(target_family = "unix"))]
         {
+            // FIXME: [KILL] Forbid negative PID killing in unix
             let output = unsafe { libc::kill(pid as i32, libc::SIGTERM) };
             if output != 0 {
                 // We had an error...
diff --git a/src/app/states.rs b/src/app/states.rs
index dea49b185..46de947e9 100644
--- a/src/app/states.rs
+++ b/src/app/states.rs
@@ -6,25 +6,12 @@ use tui::widgets::TableState;
 
 use crate::{
     app::{layout_manager::BottomWidgetType, query::*},
+    components::ScrollDirection,
     constants,
     data_harvester::processes::{self, ProcessSorting},
 };
 use ProcessSorting::*;
 
-#[derive(Debug)]
-pub enum ScrollDirection {
-    // UP means scrolling up --- this usually DECREMENTS
-    Up,
-    // DOWN means scrolling down --- this usually INCREMENTS
-    Down,
-}
-
-impl Default for ScrollDirection {
-    fn default() -> Self {
-        ScrollDirection::Down
-    }
-}
-
 #[derive(Debug)]
 pub enum CursorDirection {
     Left,
@@ -34,6 +21,8 @@ pub enum CursorDirection {
 /// AppScrollWidgetState deals with fields for a scrollable app's current state.
 #[derive(Default)]
 pub struct AppScrollWidgetState {
+    pub column_headers: Vec<String>,
+    pub column_contents: Vec<Vec<String>>,
     pub current_scroll_position: usize,
     pub previous_scroll_position: usize,
     pub scroll_direction: ScrollDirection,
@@ -802,6 +791,7 @@ impl BatteryState {
     }
 }
 
+// FIXME: [REFACTOR] Unify scroll state tracking implementations under one struct.
 #[derive(Default)]
 pub struct ParagraphScrollState {
     pub current_scroll_index: u16,
@@ -809,17 +799,22 @@ pub struct ParagraphScrollState {
 }
 
 #[derive(Default)]
-pub struct ConfigState {
-    pub current_category_index: usize,
-    pub category_list: Vec<ConfigCategory>,
-}
-
-#[derive(Default)]
-pub struct ConfigCategory {
+pub struct MainConfigState {
     pub category_name: &'static str,
-    pub options_list: Vec<ConfigOption>,
-}
-
-pub struct ConfigOption {
-    pub set_function: Box<dyn Fn() -> anyhow::Result<()>>,
+    pub config_sub_options: Vec<ConfigSubOptions>,
+}
+
+pub struct ConfigSubOptions {
+    /// The option's name.
+    pub option_name: &'static str,
+    /// The option's description.
+    pub description: &'static str,
+    /// How it handles drawing in an additional Block.  If this does is None,
+    /// then nothing additional will be drawn here.
+    pub draw_fn: Option<Box<dyn Fn()>>,
+    /// How it handles inputs.  For example, scroll states, mouse inputs, keyboard inputs, etc.
+    /// must be handled by the option itself.
+    pub input_fn: Box<dyn Fn()>,
+    /// How it updates the config.  Must be handled by the option itself.
+    pub update_fn: Box<dyn Fn()>,
 }
diff --git a/src/canvas/canvas_colours.rs b/src/canvas/canvas_colours.rs
index 2876e24b0..8205ba77d 100644
--- a/src/canvas/canvas_colours.rs
+++ b/src/canvas/canvas_colours.rs
@@ -25,7 +25,7 @@ pub struct CanvasColours {
     pub text_style: Style,
     pub widget_title_style: Style,
     pub graph_style: Style,
-    // Full, Medium, Low
+    // Order is full, medium, and low
     pub battery_bar_styles: Vec<Style>,
     pub invalid_query_style: Style,
     pub disabled_text_style: Style,
@@ -88,8 +88,9 @@ impl CanvasColours {
 
     pub fn set_table_header_colour(&mut self, colour: &str) -> error::Result<()> {
         self.table_header_style = get_style_from_config(colour)?;
-        // Disabled as it seems to be bugged when I go into full command mode...?  It becomes huge lol
-        // self.table_header_style = get_style_from_config(colour)?.modifier(Modifier::BOLD);
+        // TODO: Make arrows not bolded, rest of text bolded (if enabled)
+        // self.table_header_style =
+        //     get_style_from_config(colour)?.add_modifier(tui::style::Modifier::BOLD);
         Ok(())
     }
 
diff --git a/src/canvas/drawing_utils.rs b/src/canvas/drawing_utils.rs
index 99bf799fc..431472280 100644
--- a/src/canvas/drawing_utils.rs
+++ b/src/canvas/drawing_utils.rs
@@ -1,4 +1,4 @@
-use crate::app;
+use crate::{app, components::ScrollDirection};
 use std::cmp::{max, min};
 
 /// Return a (hard)-width vector for column widths.
@@ -145,7 +145,7 @@ pub fn get_search_start_position(
 }
 
 pub fn get_start_position(
-    num_rows: usize, scroll_direction: &app::ScrollDirection, scroll_position_bar: &mut usize,
+    num_rows: usize, scroll_direction: &ScrollDirection, scroll_position_bar: &mut usize,
     currently_selected_position: usize, is_force_redraw: bool,
 ) -> usize {
     if is_force_redraw {
@@ -153,7 +153,7 @@ pub fn get_start_position(
     }
 
     match scroll_direction {
-        app::ScrollDirection::Down => {
+        ScrollDirection::Down => {
             if currently_selected_position < *scroll_position_bar + num_rows {
                 // If, using previous_scrolled_position, we can see the element
                 // (so within that and + num_rows) just reuse the current previously scrolled position
@@ -168,7 +168,7 @@ pub fn get_start_position(
                 0
             }
         }
-        app::ScrollDirection::Up => {
+        ScrollDirection::Up => {
             if currently_selected_position <= *scroll_position_bar {
                 // If it's past the first element, then show from that element downwards
                 *scroll_position_bar = currently_selected_position;
diff --git a/src/canvas/screens/config_screen.rs b/src/canvas/screens/config_screen.rs
index 0bf82bb42..b962992b1 100644
--- a/src/canvas/screens/config_screen.rs
+++ b/src/canvas/screens/config_screen.rs
@@ -1,5 +1,5 @@
-#![allow(unused_variables)] //FIXME: Remove this
-#![allow(unused_imports)] //FIXME: Remove this
+#![allow(unused_variables)]
+#![allow(unused_imports)]
 use crate::{app::App, canvas::Painter, constants};
 use tui::{
     backend::Backend,
@@ -9,7 +9,8 @@ use tui::{
     layout::{Alignment, Rect},
     terminal::Frame,
     text::Span,
-    widgets::{Block, Borders, Paragraph},
+    text::Spans,
+    widgets::{Block, Borders, Paragraph, Tabs},
 };
 
 pub trait ConfigScreen {
@@ -23,36 +24,24 @@ impl ConfigScreen for Painter {
         &self, f: &mut Frame<'_, B>, app_state: &mut App, draw_loc: Rect,
     ) {
         let config_block = Block::default()
-            .title(" Config ") // FIXME: [Config] missing title styling
+            .title(Span::styled(" Config ", self.colours.widget_title_style))
             .style(self.colours.border_style)
             .borders(Borders::ALL)
             .border_style(self.colours.border_style);
 
-        f.render_widget(config_block, draw_loc);
+        let titles: Vec<Spans<'_>> = app_state
+            .config_page_settings
+            .iter()
+            .map(|category| Spans::from(category.category_name))
+            .collect();
 
-        // let margined_draw_locs = Layout::default()
-        //     .margin(2)
-        //     .direction(Direction::Horizontal)
-        //     .constraints(
-        //         [
-        //             Constraint::Percentage(33),
-        //             Constraint::Percentage(34),
-        //             Constraint::Percentage(33),
-        //         ]
-        //     )
-        //     .split(draw_loc)
-        //     .into_iter()
-        //     .map(|loc| {
-        //         // Required to properly margin in *between* the rectangles.
-        //         Layout::default()
-        //             .horizontal_margin(1)
-        //             .constraints([Constraint::Percentage(100)])
-        //             .split(loc)[0]
-        //     })
-        //     .collect::<Vec<Rect>>();
-
-        // for dl in margined_draw_locs {
-        //     f.render_widget(Block::default().borders(Borders::ALL), dl);
-        // }
+        f.render_widget(
+            Tabs::new(titles)
+                .block(config_block)
+                .divider(tui::symbols::line::VERTICAL)
+                .style(self.colours.text_style)
+                .highlight_style(self.colours.currently_selected_text_style),
+            draw_loc,
+        )
     }
 }
diff --git a/src/clap.rs b/src/clap.rs
index 2a03e9b4a..130176bd0 100644
--- a/src/clap.rs
+++ b/src/clap.rs
@@ -67,10 +67,10 @@ inspired by htop's.\n\n",
         );
     let battery = Arg::with_name("battery")
         .long("battery")
-        .help("Shows the battery widget.")
+        .help("Shows the battery widget in default/basic mode.")
         .long_help(
             "\
-Shows the battery widget in default or basic mode. No effect on
+Shows the battery widget in default/basic mode. No effect on
 custom layouts.\n\n",
         );
     let case_sensitive = Arg::with_name("case_sensitive")
diff --git a/src/components/base_traits/base_widget.rs b/src/components/base_traits/base_widget.rs
new file mode 100644
index 000000000..a3611f34f
--- /dev/null
+++ b/src/components/base_traits/base_widget.rs
@@ -0,0 +1,51 @@
+use crate::app::layout_manager::{BottomWidget, BottomWidgetType};
+
+use super::{Drawable, HandleClick, HandleKeyInputs, HandleScroll};
+
+#[derive(Default, Debug)]
+pub struct Coordinate {
+    pub x: u16,
+    pub y: u16,
+}
+
+#[derive(Default, Debug)]
+pub struct WidgetCorners {
+    pub top_left_corner: Coordinate,
+    pub bottom_right_corner: Coordinate,
+}
+
+pub trait BaseWidget: HandleClick + HandleScroll + HandleKeyInputs + Drawable {
+    /// Get the widget bounds - returns the top left corner (TLC) and the bottom
+    /// right corner (BRC).
+    fn get_widget_bounds(&self) -> Option<WidgetCorners>;
+
+    /// Get if a border is being drawn around this widget.
+    fn is_drawing_borders(&self) -> bool {
+        self.is_drawing_horizontal_borders() && self.is_drawing_vertical_borders()
+    }
+
+    /// Get if horizontal borders are being drawn around this widget.
+    fn is_drawing_horizontal_borders(&self) -> bool;
+
+    /// Get if vertical borders are being drawn around this widget.
+    fn is_drawing_vertical_borders(&self) -> bool;
+
+    /// Obtain the widget ID.
+    fn get_widget_id(&self) -> u64 {
+        self.get_bottom_widget_details().widget_id
+    }
+
+    /// Obtain the widget type.
+    fn get_widget_type(&self) -> &BottomWidgetType {
+        &self.get_bottom_widget_details().widget_type
+    }
+
+    /// Obtain the widget layout details.
+    fn get_bottom_widget_details(&self) -> &BottomWidget;
+}
+
+pub trait BaseTableWidget: BaseWidget {
+    fn get_table_gap(&self) -> u16;
+}
+
+pub trait BaseGraphWidget: BaseWidget {}
diff --git a/src/components/base_traits/drawable.rs b/src/components/base_traits/drawable.rs
new file mode 100644
index 000000000..82936f857
--- /dev/null
+++ b/src/components/base_traits/drawable.rs
@@ -0,0 +1,9 @@
+use tui::{backend::Backend, layout::Rect, Frame};
+
+use crate::app::App;
+
+pub trait Drawable {
+    fn draw<B: Backend>(
+        &mut self, f: &mut Frame<'_, B>, app_state: &mut App, draw_loc: Rect, is_force_redraw: bool,
+    );
+}
diff --git a/src/components/base_traits/events.rs b/src/components/base_traits/events.rs
new file mode 100644
index 000000000..c6490671d
--- /dev/null
+++ b/src/components/base_traits/events.rs
@@ -0,0 +1,25 @@
+use crossterm::event::KeyEvent;
+
+use super::Coordinate;
+
+pub trait HandleKeyInputs {
+    /// How to handle a key input
+    fn on_char(&mut self, key_input: KeyEvent);
+}
+
+pub trait HandleScroll {
+    fn on_scroll_up(&mut self);
+
+    fn on_scroll_down(&mut self);
+}
+
+pub enum MouseButton {
+    Left,
+    Middle,
+    Right,
+}
+
+pub trait HandleClick {
+    /// How to handle a click.
+    fn on_click(&mut self, button: MouseButton, click_coord: Coordinate);
+}
diff --git a/src/components/base_traits/mod.rs b/src/components/base_traits/mod.rs
new file mode 100644
index 000000000..d4dd01288
--- /dev/null
+++ b/src/components/base_traits/mod.rs
@@ -0,0 +1,7 @@
+pub mod base_widget;
+pub mod drawable;
+pub mod events;
+
+pub use base_widget::*;
+pub use drawable::*;
+pub use events::*;
diff --git a/src/components/mod.rs b/src/components/mod.rs
new file mode 100644
index 000000000..23ce0b4f4
--- /dev/null
+++ b/src/components/mod.rs
@@ -0,0 +1,5 @@
+pub mod base_traits;
+pub mod scrollable_table;
+
+pub use base_traits::*;
+pub use scrollable_table::*;
diff --git a/src/components/scrollable_table.rs b/src/components/scrollable_table.rs
new file mode 100644
index 000000000..b57bf5149
--- /dev/null
+++ b/src/components/scrollable_table.rs
@@ -0,0 +1,97 @@
+use tui::widgets::TableState;
+
+use super::{BaseTableWidget, Coordinate, HandleClick, HandleScroll, MouseButton};
+
+#[derive(Debug)]
+pub enum ScrollDirection {
+    /// UP means scrolling up --- this usually DECREMENTS
+    Up,
+    /// DOWN means scrolling down --- this usually INCREMENTS
+    Down,
+}
+
+impl Default for ScrollDirection {
+    fn default() -> Self {
+        ScrollDirection::Down
+    }
+}
+
+pub trait ScrollableTable: BaseTableWidget {
+    /// Gets the table state of the widget.
+    fn get_table_state(&self) -> &TableState;
+
+    /// Gets the table state of the widget.
+    fn get_mut_table_state(&mut self) -> &mut TableState;
+
+    /// Function to get the current position of the scroll cursor.
+    fn get_current_scrollable_position(&self) -> usize;
+
+    /// Function to get a mutable reference to the current position of the scroll cursor.
+    fn get_mut_current_scrollable_position(&mut self) -> &mut usize;
+
+    /// Function to get the current number of rows in a scrollable table.
+    fn get_num_rows(&self) -> usize;
+
+    /// Function to get the current scroll direction.
+    fn get_current_scroll_direction(&self) -> &ScrollDirection;
+
+    /// Function to get a mutable reference to the current scroll direction.
+    fn get_mut_current_scroll_direction(&mut self) -> &mut ScrollDirection;
+
+    /// Handles position movement.
+    fn move_position(&mut self, amount_to_move: i64) {
+        let num_rows = self.get_num_rows();
+        let current_position = self.get_mut_current_scrollable_position();
+
+        let new_position = *current_position as i64 + amount_to_move;
+        if new_position >= 0 && new_position < num_rows as i64 {
+            *current_position = new_position as usize;
+
+            let current_direction = self.get_mut_current_scroll_direction();
+            if amount_to_move.is_negative() {
+                *current_direction = ScrollDirection::Up;
+            } else {
+                *current_direction = ScrollDirection::Down;
+            }
+        }
+    }
+}
+
+impl<T> HandleScroll for T
+where
+    T: ScrollableTable,
+{
+    fn on_scroll_up(&mut self) {
+        self.move_position(-1);
+    }
+
+    fn on_scroll_down(&mut self) {
+        self.move_position(1);
+    }
+}
+
+impl<T> HandleClick for T
+where
+    T: ScrollableTable,
+{
+    fn on_click(&mut self, button: MouseButton, click_coord: Coordinate) {
+        if let MouseButton::Left = button {
+            if let Some(widget_bounds) = self.get_widget_bounds() {
+                let clicked_entry = click_coord.y - widget_bounds.top_left_corner.y;
+                let offset =
+                    1 + if self.is_drawing_vertical_borders() {
+                        1
+                    } else {
+                        0
+                    } + self.get_table_gap();
+
+                if clicked_entry >= offset {
+                    let offset_clicked_entry = clicked_entry - offset;
+                    if let Some(visual_index) = self.get_table_state().selected() {
+                        self.move_position(offset_clicked_entry as i64 - visual_index as i64);
+                    }
+                }
+            }
+        }
+    }
+}
diff --git a/src/constants.rs b/src/constants.rs
index 8bc6f11db..6576fa0f7 100644
--- a/src/constants.rs
+++ b/src/constants.rs
@@ -24,6 +24,7 @@ pub const TABLE_GAP_HEIGHT_LIMIT: u16 = 7;
 pub const TIME_LABEL_HEIGHT_LIMIT: u16 = 7;
 
 // Side borders
+// FIXME: [REFACTOR] Switch to once_cell over lazy_static.
 lazy_static! {
     pub static ref SIDE_BORDERS: tui::widgets::Borders =
         tui::widgets::Borders::from_bits_truncate(20);
diff --git a/src/lib.rs b/src/lib.rs
index bb46ae352..dd1ecc898 100644
--- a/src/lib.rs
+++ b/src/lib.rs
@@ -30,6 +30,7 @@ use app::{
     layout_manager::{UsedWidgets, WidgetDirection},
     App,
 };
+use components::*;
 use constants::*;
 use data_conversion::*;
 use options::*;
@@ -43,6 +44,7 @@ pub mod utils {
 }
 pub mod canvas;
 pub mod clap;
+pub mod components;
 pub mod constants;
 pub mod data_conversion;
 pub mod options;
@@ -423,7 +425,7 @@ fn update_final_process_list(app: &mut App, widget_id: u64) {
                 proc_widget_state.scroll_state.current_scroll_position =
                     finalized_process_data.len().saturating_sub(1);
                 proc_widget_state.scroll_state.previous_scroll_position = 0;
-                proc_widget_state.scroll_state.scroll_direction = app::ScrollDirection::Down;
+                proc_widget_state.scroll_state.scroll_direction = ScrollDirection::Down;
             }
 
             app.canvas_data.stringified_process_data_map.insert(
diff --git a/src/options.rs b/src/options.rs
index 27d722ae4..fc5e62b5f 100644
--- a/src/options.rs
+++ b/src/options.rs
@@ -413,6 +413,18 @@ pub fn build_app(
         }
     }
 
+    let config_page_settings: Vec<MainConfigState> = vec![
+        build_display_options_config(),
+        MainConfigState {
+            category_name: "Colours",
+            config_sub_options: vec![],
+        },
+        MainConfigState {
+            category_name: "Layout",
+            config_sub_options: vec![],
+        },
+    ];
+
     Ok(App::builder()
         .app_config_fields(app_config_fields)
         .cpu_state(CpuState::init(cpu_state_map))
@@ -432,6 +444,7 @@ pub fn build_app(
         })
         .config(config.clone())
         .config_path(config_path)
+        .config_page_settings(config_page_settings)
         .build())
 }
 
@@ -888,3 +901,95 @@ pub fn get_ignore_list(ignore_list: &Option<IgnoreList>) -> error::Result<Option
         Ok(None)
     }
 }
+
+fn build_display_options_config() -> MainConfigState {
+    MainConfigState {
+        category_name: "Display options",
+        config_sub_options: vec![
+            ConfigSubOptions {
+                option_name: "Automatically hide time",
+                description: "Temporarily show the time scale in graphs.",
+                draw_fn: None,
+                input_fn: Box::new(|| {}),
+                update_fn: Box::new(|| {}),
+            },
+            ConfigSubOptions {
+                option_name: "Basic mode",
+                description: "Hides graphs and uses a more basic look.",
+                draw_fn: None,
+                input_fn: Box::new(|| {}),
+                update_fn: Box::new(|| {}),
+            },
+            ConfigSubOptions {
+                option_name: "Battery widget",
+                description: "Shows the battery widget in default/basic mode.",
+                draw_fn: None,
+                input_fn: Box::new(|| {}),
+                update_fn: Box::new(|| {}),
+            },
+            ConfigSubOptions {
+                option_name: "Current usage",
+                description: "Use current CPU% as base for process CPU% usage.",
+                draw_fn: None,
+                input_fn: Box::new(|| {}),
+                update_fn: Box::new(|| {}),
+            },
+            ConfigSubOptions {
+                option_name: "Default time value",
+                description: "",
+                draw_fn: None,
+                input_fn: Box::new(|| {}),
+                update_fn: Box::new(|| {}),
+            },
+            ConfigSubOptions {
+                option_name: "Disable click",
+                description: "",
+                draw_fn: None,
+                input_fn: Box::new(|| {}),
+                update_fn: Box::new(|| {}),
+            },
+            ConfigSubOptions {
+                option_name: "Dot marker",
+                description: "",
+                draw_fn: None,
+                input_fn: Box::new(|| {}),
+                update_fn: Box::new(|| {}),
+            },
+            ConfigSubOptions {
+                option_name: "Group processes by default",
+                description: "",
+                draw_fn: None,
+                input_fn: Box::new(|| {}),
+                update_fn: Box::new(|| {}),
+            },
+            ConfigSubOptions {
+                option_name: "Average CPU",
+                description: "",
+                draw_fn: None,
+                input_fn: Box::new(|| {}),
+                update_fn: Box::new(|| {}),
+            },
+            ConfigSubOptions {
+                option_name: "Left legend",
+                description: "",
+                draw_fn: None,
+                input_fn: Box::new(|| {}),
+                update_fn: Box::new(|| {}),
+            },
+            ConfigSubOptions {
+                option_name: "Refresh rate",
+                description: "",
+                draw_fn: None,
+                input_fn: Box::new(|| {}),
+                update_fn: Box::new(|| {}),
+            },
+            ConfigSubOptions {
+                option_name: "Zoom delta",
+                description: "",
+                draw_fn: None,
+                input_fn: Box::new(|| {}),
+                update_fn: Box::new(|| {}),
+            },
+        ],
+    }
+}