diff --git a/Cargo.lock b/Cargo.lock
index fc8d1657..5392ae9e 100644
--- a/Cargo.lock
+++ b/Cargo.lock
@@ -1743,6 +1743,12 @@ dependencies = [
  "rand_core",
 ]
 
+[[package]]
+name = "similar"
+version = "2.4.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "32fea41aca09ee824cc9724996433064c89f7777e60762749a4170a14abbfa21"
+
 [[package]]
 name = "slab"
 version = "0.4.9"
@@ -2077,6 +2083,7 @@ dependencies = [
  "serde_json",
  "serde_qs",
  "sha1",
+ "similar",
  "time",
  "wasm-bindgen",
  "wasm-logger",
diff --git a/Cargo.toml b/Cargo.toml
index af003c83..069c8313 100644
--- a/Cargo.toml
+++ b/Cargo.toml
@@ -32,8 +32,6 @@ log = "0.4.17"
 # utils
 hex = "0.4.3"
 gloo-timers = "0.2.4"
-rand = { version = "0.8.5", default-features = false, features = ["small_rng"] }
-rand_chacha = "0.3.1"
 serde = { version = "1.0.162", features = ["derive"] }
 serde_qs = "0.12.0"
 serde_json = "1.0.89"
@@ -50,8 +48,13 @@ hmac-sha512 = { version = "1.1.2", features = ["sha384"] }
 rsa = "0.7.2"
 bcrypt = "0.14.0"
 flate2 = { version = "1.0.26", features = ["zlib"] }
+rand = { version = "0.8.5", default-features = false, features = ["small_rng"] }
+rand_chacha = "0.3.1"
 
 # asn1
 asn1-parser = { path = "./crates/asn1-parser", features = ["std"] }
 oid = { version = "0.2.1", default-features = false }
 paste = "1.0.14"
+
+# diff
+similar = "2.4.0"
\ No newline at end of file
diff --git a/index.html b/index.html
index 7cdf592a..878295b5 100644
--- a/index.html
+++ b/index.html
@@ -29,5 +29,8 @@
     <link data-trunk rel="sass" href="public/styles/asn1/page.scss" />
     <link data-trunk rel="sass" href="public/styles/asn1/node.scss" />
     <link data-trunk rel="sass" href="public/styles/asn1/hex_viewer.scss" />
+
+    <!-- diff styles -->
+    <link data-trunk rel="sass" href="public/styles/diff/styles.scss" />
   </head>
 </html>
\ No newline at end of file
diff --git a/public/styles/diff/styles.scss b/public/styles/diff/styles.scss
new file mode 100644
index 00000000..ef2c1e73
--- /dev/null
+++ b/public/styles/diff/styles.scss
@@ -0,0 +1,36 @@
+
+.diff-changes-container {
+    display: flex;
+    flex-direction: row;
+    gap: 0;
+    justify-content: flex-start;
+    align-items: center;
+    width: 100%;
+    flex-wrap: wrap;
+    //background-color: #edd5ce;
+    //border-radius: 0.2em;
+    //padding: 0.5em;
+}
+
+.diff-insert {
+    white-space: pre-wrap;
+    background-color: #97e0bd;
+    color: #016939;
+}
+
+.diff-remove {
+    white-space: pre-wrap;
+    background-color: #d38693;
+    color: #9d0620;
+}
+
+.diff-new-line {
+    height: 0;
+    flex-basis: 100%;
+}
+
+.diff-line-number {
+    background-color: #edd5ce;
+    padding-right: 0.3em;
+    padding-left: 0.3em;
+}
\ No newline at end of file
diff --git a/src/about.rs b/src/about.rs
index 86a0e576..8ac328ba 100644
--- a/src/about.rs
+++ b/src/about.rs
@@ -26,6 +26,8 @@ pub fn about() -> Html {
                     <li>{"ES384"}</li>
                     <li>{"ES512"}</li>
                 </ul>
+                <li>{"ASN1 decoder"}</li>
+                <li>{"Diff checker"}</li>
                 <li>{"Ability to share the sample by url"}</li>
             </ul>
             <span>{"All computations are performed on the client side."}</span>
diff --git a/src/asn1.rs b/src/asn1.rs
index 0db67ab6..84993c23 100644
--- a/src/asn1.rs
+++ b/src/asn1.rs
@@ -83,10 +83,7 @@ pub fn asn1_parser_page() -> Html {
     let asn1_setter = parsed_asn1.setter();
     let raw_data = (*raw_asn1).clone();
     let parse_asn1 = Callback::from(move |_| match Asn1::decode_buff(&raw_data) {
-        Ok(asn1) => {
-            debug!("parsed!");
-            asn1_setter.set(asn1.to_owned_with_asn1(asn1.inner_asn1().to_owned()));
-        }
+        Ok(asn1) => asn1_setter.set(asn1.to_owned_with_asn1(asn1.inner_asn1().to_owned())),
         Err(error) => notifications.spawn(Notification::new(
             NotificationType::Error,
             "Invalid asn1 data",
@@ -197,7 +194,7 @@ pub fn asn1_parser_page() -> Html {
             </span>
             <ByteInput bytes={(*raw_asn1).clone()} setter={Callback::from(move |data| raw_asn1_setter.set(data))} placeholder={"asn1 data".to_owned()} rows={10} />
             <div class="horizontal">
-                <button class="action-button" {onclick}>{"Process"}</button>
+                <button class="action-button" {onclick}>{"Decode"}</button>
                 <span class="total">{"(ctrl+enter)"}</span>
                 <button class="button-with-icon" onclick={share_by_link}>
                     <img src="/public/img/icons/share_by_link.png" />
diff --git a/src/diff.rs b/src/diff.rs
new file mode 100644
index 00000000..96b33581
--- /dev/null
+++ b/src/diff.rs
@@ -0,0 +1,216 @@
+mod diff_algo;
+mod diff_viewer;
+
+use similar::{capture_diff_slices, Algorithm, DiffOp, TextDiff};
+use web_sys::{HtmlInputElement, KeyboardEvent};
+use yew::html::onchange::Event;
+use yew::virtual_dom::VNode;
+use yew::{classes, function_component, html, use_effect_with_deps, use_state, Callback, Html, TargetCast};
+use yew_hooks::use_local_storage;
+
+use self::diff_algo::DiffAlgo;
+use self::diff_viewer::DiffViewer;
+
+const DEFAULT_ORIGINAL: &str = "TheBestTvarynka
+TheBestTvarynka
+TheBestTvarynka";
+const DEFAULT_CHANGED: &str = "thebesttravynka
+thebesttravynka
+thebesttravynka
+";
+const DEFAULT_ALGORITHM: DiffAlgo = DiffAlgo(Algorithm::Myers);
+
+const LOCAL_STORAGE_ORIGINAL: &str = "ORIGINAL_DATA";
+const LOCAL_STORAGE_ALGORITHM: &str = "ALGORITHM";
+const LOCAL_STORAGE_CHANGED: &str = "CHANGED_DATA";
+
+const ALL_ALGORITHMS: &[DiffAlgo] = &[
+    DiffAlgo(Algorithm::Myers),
+    DiffAlgo(Algorithm::Lcs),
+    DiffAlgo(Algorithm::Patience),
+];
+
+#[derive(Debug, Clone, PartialEq)]
+struct DiffData {
+    pub original: Vec<char>,
+    pub changed: Vec<char>,
+    pub changes: Vec<DiffOp>,
+}
+
+impl DiffData {
+    pub fn empty() -> Self {
+        Self {
+            original: Vec::new(),
+            changed: Vec::new(),
+            changes: Vec::new(),
+        }
+    }
+}
+
+fn render_algorithm_options(current_algorithm: DiffAlgo) -> Vec<VNode> {
+    ALL_ALGORITHMS
+        .iter()
+        .map(|algo| {
+            html! {
+                <option selected={current_algorithm == *algo} value={algo.to_string()}>{algo}</option>
+            }
+        })
+        .collect()
+}
+
+#[function_component(DiffPage)]
+pub fn diff_page() -> Html {
+    let original = use_state(|| DEFAULT_ORIGINAL.to_owned());
+    let changed = use_state(|| DEFAULT_CHANGED.to_owned());
+    let algorithm = use_state(|| DEFAULT_ALGORITHM);
+    let diffs = use_state(|| {
+        let original = DEFAULT_ORIGINAL.chars().collect::<Vec<_>>();
+        let changed = DEFAULT_CHANGED.chars().collect::<Vec<_>>();
+        let changes = TextDiff::configure()
+            .algorithm(DEFAULT_ALGORITHM.into())
+            .newline_terminated(true)
+            .diff_chars(DEFAULT_ORIGINAL, DEFAULT_CHANGED);
+
+        DiffData {
+            original,
+            changed,
+            changes: changes.ops().to_owned(),
+        }
+    });
+
+    let original_data = original.chars().collect::<Vec<_>>();
+    let changed_data = changed.chars().collect::<Vec<_>>();
+    let diffs_setter = diffs.setter();
+    let algo = *algorithm;
+    let compute_diff = Callback::from(move |_: ()| {
+        let changes = capture_diff_slices(algo.into(), &original_data, &changed_data);
+
+        diffs_setter.set(DiffData {
+            original: original_data.clone(),
+            changed: changed_data.clone(),
+            changes,
+        });
+    });
+
+    let original_local_storage = use_local_storage::<String>(LOCAL_STORAGE_ORIGINAL.to_owned());
+    let original_setter = original.setter();
+    let changed_local_storage = use_local_storage::<String>(LOCAL_STORAGE_CHANGED.to_owned());
+    let changed_setter = changed.setter();
+    let algorithm_local_storage = use_local_storage::<String>(LOCAL_STORAGE_ALGORITHM.to_owned());
+    let algorithm_setter = algorithm.setter();
+    let diffs_setter = diffs.setter();
+    use_effect_with_deps(
+        move |_: &[(); 0]| {
+            let mut flag = false;
+
+            if let Some(original) = (*original_local_storage).as_ref() {
+                original_setter.set(original.to_string());
+                flag = true;
+            }
+            if let Some(changed) = (*changed_local_storage).as_ref() {
+                changed_setter.set(changed.to_string());
+                flag = true;
+            }
+            if let Some(raw_algorithm) = (*algorithm_local_storage).as_ref() {
+                if let Ok(algorithm) = raw_algorithm.as_str().try_into() {
+                    algorithm_setter.set(algorithm);
+                    flag = true;
+                }
+            }
+
+            if flag {
+                diffs_setter.set(DiffData::empty());
+            }
+        },
+        [],
+    );
+
+    let local_storage = use_local_storage::<String>(LOCAL_STORAGE_ORIGINAL.to_owned());
+    use_effect_with_deps(
+        move |[original]| {
+            local_storage.set((*original).to_string());
+        },
+        [original.clone()],
+    );
+
+    let local_storage = use_local_storage::<String>(LOCAL_STORAGE_CHANGED.to_owned());
+    use_effect_with_deps(
+        move |[changed]| {
+            local_storage.set((*changed).to_string());
+        },
+        [changed.clone()],
+    );
+
+    let local_storage = use_local_storage::<String>(LOCAL_STORAGE_ALGORITHM.to_owned());
+    use_effect_with_deps(
+        move |[algorithm]| {
+            local_storage.set((*algorithm).to_string());
+        },
+        [algorithm.clone()],
+    );
+
+    let original_setter = original.setter();
+    let on_original_input = Callback::from(move |event: html::oninput::Event| {
+        let input: HtmlInputElement = event.target_unchecked_into();
+        original_setter.set(input.value());
+    });
+
+    let changed_setter = changed.setter();
+    let on_changed_input = Callback::from(move |event: html::oninput::Event| {
+        let input: HtmlInputElement = event.target_unchecked_into();
+        changed_setter.set(input.value());
+    });
+
+    let diff = compute_diff.clone();
+    let onclick = Callback::from(move |_| {
+        diff.emit(());
+    });
+
+    let algorithm_setter = algorithm.setter();
+    let on_algorithm_change = Callback::from(move |event: Event| {
+        let input: HtmlInputElement = event.target_unchecked_into();
+        if let Ok(algorithm) = input.value().as_str().try_into() {
+            algorithm_setter.set(algorithm);
+        }
+    });
+
+    let onkeydown = Callback::from(move |event: KeyboardEvent| {
+        if event.ctrl_key() && event.code() == "Enter" {
+            compute_diff.emit(());
+        }
+    });
+
+    html! {
+        <div class={classes!("vertical", "asn1-page")} {onkeydown}>
+            <div class="horizontal">
+                <span>{"Diff algorithm:"}</span>
+                <div>
+                    <select class="base-input" onchange={on_algorithm_change}>
+                        {render_algorithm_options(*algorithm)}
+                    </select>
+                </div>
+            </div>
+            <div class="horizontal">
+                <textarea
+                    rows="8"
+                    placeholder={"original"}
+                    class="base-input"
+                    value={(*original).clone()}
+                    oninput={on_original_input}
+                />
+                <textarea
+                    rows="8"
+                    placeholder={"changed"}
+                    class="base-input"
+                    value={(*changed).clone()}
+                    oninput={on_changed_input}
+                />
+            </div>
+            <div class="horizontal">
+                <button class="action-button" onclick={onclick}>{"Diff"}</button>
+                <span class="total">{"(ctrl+enter)"}</span>
+            </div>
+            <DiffViewer diff={(*diffs).clone()} />
+        </div>
+    }
+}
diff --git a/src/diff/diff_algo.rs b/src/diff/diff_algo.rs
new file mode 100644
index 00000000..cad92419
--- /dev/null
+++ b/src/diff/diff_algo.rs
@@ -0,0 +1,54 @@
+use std::fmt::{Display, Formatter};
+use std::ops::Deref;
+
+use similar::Algorithm;
+
+const MYERS: &str = "Myers";
+const PATIENCE: &str = "Patience";
+const LCS: &str = "Lcs";
+
+#[derive(Clone, Copy, Eq, PartialEq)]
+pub struct DiffAlgo(pub Algorithm);
+
+impl From<DiffAlgo> for Algorithm {
+    fn from(value: DiffAlgo) -> Self {
+        value.0
+    }
+}
+
+impl From<Algorithm> for DiffAlgo {
+    fn from(value: Algorithm) -> Self {
+        Self(value)
+    }
+}
+
+impl Display for DiffAlgo {
+    fn fmt(&self, f: &mut Formatter<'_>) -> std::fmt::Result {
+        f.write_str(match self.0 {
+            Algorithm::Myers => MYERS,
+            Algorithm::Patience => PATIENCE,
+            Algorithm::Lcs => LCS,
+        })
+    }
+}
+
+impl Deref for DiffAlgo {
+    type Target = Algorithm;
+
+    fn deref(&self) -> &Self::Target {
+        &self.0
+    }
+}
+
+impl TryFrom<&str> for DiffAlgo {
+    type Error = String;
+
+    fn try_from(value: &str) -> Result<Self, Self::Error> {
+        Ok(match value {
+            MYERS => Algorithm::Myers.into(),
+            PATIENCE => Algorithm::Patience.into(),
+            LCS => Algorithm::Lcs.into(),
+            _ => return Err(format!("Unsupported diff algorithm: {}.", value)),
+        })
+    }
+}
diff --git a/src/diff/diff_viewer.rs b/src/diff/diff_viewer.rs
new file mode 100644
index 00000000..597807ff
--- /dev/null
+++ b/src/diff/diff_viewer.rs
@@ -0,0 +1,95 @@
+use similar::DiffOp;
+use yew::virtual_dom::VNode;
+use yew::{function_component, html, Html, Properties};
+
+use super::DiffData;
+
+#[derive(PartialEq, Properties, Clone)]
+pub struct DiffViewerProps {
+    pub diff: DiffData,
+}
+
+fn text_spans(chars: &[char], class: &'static str, line_number: &mut usize) -> Vec<VNode> {
+    chars
+        .iter()
+        .flat_map(|c| {
+            if *c == '\n' {
+                vec![
+                    html! {
+                        <span class="diff-new-line" />
+                    },
+                    html! {
+                        <span class="diff-line-number">{{
+                            *line_number += 1;
+                            *line_number - 1
+                        }}</span>
+                    },
+                ]
+            } else {
+                vec![html! {
+                    <span class={class}>{c}</span>
+                }]
+            }
+        })
+        .collect()
+}
+
+fn render_changes(diff: &DiffData) -> Vec<VNode> {
+    let mut line_number = 2;
+
+    let old = diff.original.as_slice();
+    let new = diff.changed.as_slice();
+
+    let mut changes = diff
+        .changes
+        .iter()
+        .flat_map(|op| match op {
+            DiffOp::Equal {
+                old_index,
+                len,
+                new_index: _,
+            } => text_spans(&old[*old_index..*old_index + *len], "", &mut line_number),
+            DiffOp::Delete {
+                old_index,
+                old_len,
+                new_index: _,
+            } => text_spans(&old[*old_index..*old_index + *old_len], "diff-remove", &mut line_number),
+            DiffOp::Insert {
+                old_index: _,
+                new_index,
+                new_len,
+            } => text_spans(&new[*new_index..*new_index + *new_len], "diff-insert", &mut line_number),
+            DiffOp::Replace {
+                old_index,
+                old_len,
+                new_index,
+                new_len,
+            } => {
+                let mut spans = text_spans(&old[*old_index..*old_index + *old_len], "diff-remove", &mut line_number);
+                spans.extend_from_slice(&text_spans(
+                    &new[*new_index..*new_index + *new_len],
+                    "diff-insert",
+                    &mut line_number,
+                ));
+                spans
+            }
+        })
+        .collect::<Vec<_>>();
+    changes.insert(
+        0,
+        html! {
+            <span class="diff-line-number">{"1"}</span>
+        },
+    );
+    changes.remove(changes.len() - 1);
+    changes
+}
+
+#[function_component(DiffViewer)]
+pub fn diff_viewer(props: &DiffViewerProps) -> Html {
+    html! {
+        <div class="diff-changes-container">
+            {render_changes(&props.diff)}
+        </div>
+    }
+}
diff --git a/src/header.rs b/src/header.rs
index e3febcb5..25b2e6b7 100644
--- a/src/header.rs
+++ b/src/header.rs
@@ -10,6 +10,7 @@ pub fn header() -> Html {
             <Link<Route> to={Route::CryptoHelper}>{"Crypto helper"}</Link<Route>>
             <Link<Route> to={Route::Jwt}>{"JWT debugger"}</Link<Route>>
             <Link<Route> to={Route::Asn1Parser}>{"Asn1 debugger (beta)"}</Link<Route>>
+            <Link<Route> to={Route::Diff}>{"Diff"}</Link<Route>>
             <Link<Route> to={Route::About}>{"About"}</Link<Route>>
         </header>
     }
diff --git a/src/main.rs b/src/main.rs
index 27c20128..506df233 100644
--- a/src/main.rs
+++ b/src/main.rs
@@ -5,6 +5,7 @@ mod about;
 mod asn1;
 mod common;
 mod crypto_helper;
+mod diff;
 mod footer;
 mod header;
 mod jwt;
@@ -16,6 +17,7 @@ mod utils;
 use about::About;
 use asn1::Asn1ParserPage;
 use crypto_helper::CryptoHelper;
+use diff::DiffPage;
 use footer::footer;
 use header::Header;
 use jwt::Jwt;
@@ -34,6 +36,8 @@ enum Route {
     CryptoHelper,
     #[at("/jwt")]
     Jwt,
+    #[at("/diff")]
+    Diff,
     #[at("/about")]
     About,
     #[not_found]
@@ -47,6 +51,7 @@ fn switch(routes: Route) -> Html {
         Route::Asn1Parser => html! { <Asn1ParserPage /> },
         Route::CryptoHelper => html! { <CryptoHelper /> },
         Route::Jwt => html! { <Jwt /> },
+        Route::Diff => html! { <DiffPage /> },
         Route::About => html! { <About /> },
         Route::NotFound => not_found(),
     }