diff --git a/README.md b/README.md
index 285212f..aaf0207 100644
--- a/README.md
+++ b/README.md
@@ -1,5 +1,3 @@
-[![Vote for me on ProductHunt](https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=176424&theme=light)](https://www.producthunt.com/posts/css-layout?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-css-layout)
-
 # CSS Layout
 
 A collection of popular layouts and patterns made with CSS:
@@ -89,13 +87,54 @@ Be my friend on
 
 ## Products
 
-You might be interesting in my products:
+You might be interested in my products:
 
-| Product                                           | Description                                                       |
-|---------------------------------------------------|-------------------------------------------------------------------|
-| [Blur Page](https://blur.page)                    | A browser extension to hide sensitive information on a web page   |
-| [CSS Layout](https://csslayout.io)                | A collection of popular layouts and patterns made with CSS        |
-| [Fake Numbers](https://fakenumbers.io)            | Generate fake and valid numbers                                   |
-| [Form Validation](https://formvalidation.io)      | The best validation library for JavaScript                        |
-| [HTML DOM](https://htmldom.dev)                   | How to manage HTML DOM with vanilla JavaScript                    |
-| [React PDF Viewer](https://react-pdf-viewer.dev)  | A React component to view a PDF document                          |
+<table>
+    <tbody>
+        <tr valign="top">
+            <td width="25%" align="center">
+                <h3>1 LOC (3.3k★)</h3>
+                <a href="https://1loc.dev">Favorite JavaScript utilities in single line of code</a>
+            </td>
+            <td width="25%" align="center">
+                <h3>Blur Page</h3>
+                <a href="https://blur.page">A browser extension to hide sensitive information on a web page</a>
+            </td>
+            <td width="25%" align="center">
+                <h3>Check Browsers Support</h3>
+                <a href="https://checkbrowsers.support">A browser extension to check browser compatibility without leaving your tab</a>
+            </td>
+            <td width="25%" align="center">
+                <h3>CSS Layout (2.7k★)</h3>
+                <a href="https://csslayout.io">A collection of popular layouts and patterns made with CSS</a>
+            </td>
+        </tr>
+        <tr valign="top">
+            <td width="25%" align="center">
+                <h3>Fake Numbers</h3>
+                <a href="https://fakenumbers.io">Generate fake and valid numbers</a>
+            </td>
+            <td width="25%" align="center">
+                <h3>Form Validation</h3>
+                <a href="https://formvalidation.io">The best validation library for JavaScript</a>
+            </td>
+            <td width="25%" align="center">
+                <h3>HTML DOM (3.1k★)</h3>
+                <a href="https://htmldom.dev">How to manage HTML DOM with vanilla JavaScript</a>
+            </td>
+            <td width="25%" align="center">
+                <h3>React PDF Viewer</h3>
+                <a href="https://react-pdf-viewer.dev">A React component to view a PDF document</a>
+            </td>
+        </tr>
+        <tr valign="top">
+            <td width="25%" align="center">
+                <h3>this VS that</h3>
+                <a href="https://thisthat.dev">The differences between ___ and ___ in the front-end development</a>
+            </td>
+            <td width="25%" align="center"></td>
+            <td width="25%" align="center"></td>
+            <td width="25%" align="center"></td>
+        </tr>
+    </tbody>
+</table>
diff --git a/client/layouts/Footer.tsx b/client/layouts/Footer.tsx
index a8c9fe5..aceaf01 100644
--- a/client/layouts/Footer.tsx
+++ b/client/layouts/Footer.tsx
@@ -15,39 +15,57 @@ const Footer: React.FC<{}> = () => {
                 <div>
                     <h3 className='text-xl sm:text-2xl font-semibold mb-2'>Products</h3>
                     <ul className='flex flex-wrap -ml-1 -mr-1'>
+                        <li className='w-1/2 sm:w-1/3 px-1 mb-6'>
+                            <a
+                                href="https://1loc.dev"
+                                rel="noopener noreferrer"
+                                target="_blank"
+                                title="1 LOC - favorite JavaScript utilities in single line of code"
+                            >
+                                <div className='font-semibold flex items-center'>
+                                    1 LOC 
+                                    <span className='bg-green-600 font-normal ml-1 p-1 rounded text-sm text-white'>new</span>
+                                </div>
+                                <span className='text-gray-600'>favorite JavaScript utilities in single line of code</span>
+                            </a>
+                        </li>
                         <li className='w-1/2 sm:w-1/3 px-1 mb-6'>
                             <a
                                 href="https://blur.page"
                                 rel="noopener noreferrer"
-                                style={{ textDecoration: 'none' }}
                                 target="_blank"
                                 title="BlurPage - a browser extension to hide sensitive element on page"
                             >
                                 <div className='font-semibold'>Blur Page</div>
-                                <span className='text-gray-600'>
-                                    a browser extension to hide sensitive element on page
-                                </span>
+                                <span className='text-gray-600'>a browser extension to hide sensitive element on page</span>
+                            </a>
+                        </li>
+                        <li className='w-1/2 sm:w-1/3 px-1 mb-6'>
+                            <a
+                                href="https://checkbrowsers.support"
+                                rel="noopener noreferrer"
+                                target="_blank"
+                                title="Check Browsers Support - a browser extension to check browser compatibility without leaving your tab"
+                            >
+                                <div className='font-semibold'>Check Browsers Support</div>
+                                <span className='text-gray-600'>a browser extension to check browser compatibility without leaving your tab</span>
                             </a>
                         </li>
                         <li className='w-1/2 sm:w-1/3 px-1 mb-6'>
                             <a
                                 href="https://csslayout.io"
                                 rel="noopener noreferrer"
-                                style={{ textDecoration: 'none' }}
                                 target="_blank"
                                 title="CSS Layout - a collection of popular layouts and patterns made with CSS"
                             >
                                 <div className='font-semibold'>CSS Layout</div>
-                                <span className='text-gray-600'>
-                                    a collection of popular layouts and patterns made with CSS
-                                </span>
+                                <span className='text-gray-600'>a collection of popular layouts and patterns made with CSS</span>
                             </a>
                         </li>
                         <li className='w-1/2 sm:w-1/3 px-1 mb-6'>
                             <a
                                 href="https://fakenumbers.io"
                                 rel="noopener noreferrer"
-                                style={{ textDecoration: 'none' }}
                                 target="_blank"
                                 title="Fake Numbers - a JavaScript library to fake a number"
                             >
@@ -59,7 +77,6 @@ const Footer: React.FC<{}> = () => {
                             <a
                                 href="https://formvalidation.io"
                                 rel="noopener noreferrer"
-                                style={{ textDecoration: 'none' }}
                                 target="_blank"
                                 title="FormValidation - the best validation library for JavaScript"
                             >
@@ -71,21 +88,17 @@ const Footer: React.FC<{}> = () => {
                             <a
                                 href="https://htmldom.dev"
                                 rel="noopener noreferrer"
-                                style={{ textDecoration: 'none' }}
                                 target="_blank"
                                 title="HTML DOM - Common tasks of managing HTML DOM with native API"
                             >
                                 <div className='font-semibold'>HTML DOM</div>
-                                <span className='text-gray-600'>
-                                    common tasks of managing HTML DOM with vanilla JavaScript
-                                </span>
+                                <span className='text-gray-600'>common tasks of managing HTML DOM with vanilla JavaScript</span>
                             </a>
                         </li>
                         <li className='w-1/2 sm:w-1/3 px-1 mb-6'>
                             <a
                                 href="https://react-pdf-viewer.dev"
                                 rel="noopener noreferrer"
-                                style={{ textDecoration: 'none' }}
                                 target="_blank"
                                 title="React PDF Viewer - a PDF viewer made for React"
                             >
@@ -93,6 +106,17 @@ const Footer: React.FC<{}> = () => {
                                 <span className='text-gray-600'>a PDF viewer made for React</span>
                             </a>
                         </li>
+                        <li className='w-1/2 sm:w-1/3 px-1 mb-6'>
+                            <a
+                                href="https://thisthat.dev"
+                                rel="noopener noreferrer"
+                                target="_blank"
+                                title="this VS that - the differences between ___ and ___ in the front-end development"
+                            >
+                                <div className='font-semibold'>this VS that</div>
+                                <span className='text-gray-600'>the differences between ___ and ___ in the front-end development</span>
+                            </a>
+                        </li>
                     </ul>
                 </div>