diff --git a/.github/workflows/ci_release.yml b/.github/workflows/ci_release.yml
index b014bf64..5eee942c 100644
--- a/.github/workflows/ci_release.yml
+++ b/.github/workflows/ci_release.yml
@@ -11,6 +11,7 @@ on:
         options:
           - -- all --
           - core
+          - date-picker
           - layout
           - list-loader
           - message-box
diff --git a/.github/workflows/ci_test_date-picker.yml b/.github/workflows/ci_test_date-picker.yml
new file mode 100644
index 00000000..0dd29217
--- /dev/null
+++ b/.github/workflows/ci_test_date-picker.yml
@@ -0,0 +1,25 @@
+name: Test date-picker
+
+on:
+  workflow_dispatch:
+  workflow_call:
+  push:
+    branches:
+      - '**'
+    tags-ignore:
+      - '**'
+    paths:
+      - '.github/workflows/ci_test_date-picker.yml'
+      - 'projects/date-picker/**'
+
+concurrency:
+  group: ci-test-date-picker-group-${{ github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  ci_test_date-picker:
+    uses: dsi-hug/action/.github/workflows/action.yml@v1
+    with:
+      working-directory: projects/date-picker
+      runs-on: '["ubuntu-latest", "macos-latest", "windows-latest"]'
+      node-versions: '[18, 20]'
diff --git a/README.md b/README.md
index df390003..6e9b3bbc 100644
--- a/README.md
+++ b/README.md
@@ -37,6 +37,7 @@ Package | Version | Downloads | Tests
 [@hug/ngx-tooltip](/projects/tooltip) | [![npm version][npm-logo-tooltip]][npm-tooltip] | [![npm downloads][npm-dl-logo-tooltip]][npm-dl-tooltip] | [![build status][tests-logo-tooltip]][tests-tooltip]
 [@hug/ngx-user-card](/projects/user-card) | [![npm version][npm-logo-user-card]][npm-user-card] | [![npm downloads][npm-dl-logo-user-card]][npm-dl-user-card] | [![build status][tests-logo-user-card]][tests-user-card]
 [@hug/ngx-user-tooltip](/projects/user-tooltip) | [![npm version][npm-logo-user-tooltip]][npm-user-tooltip] | [![npm downloads][npm-dl-logo-user-tooltip]][npm-dl-user-tooltip] | [![build status][tests-logo-user-tooltip]][tests-user-tooltip]
+[@hug/ngx-date-picker](/projects/date-picker) | [![npm version][npm-logo-date-picker]][npm-date-picker] | [![npm downloads][npm-dl-logo-date-picker]][npm-dl-date-picker] | [![build status][tests-logo-date-picker]][tests-date-picker]
 
 </div>
 
@@ -191,3 +192,10 @@ Copyright (C) 2024 [HUG - Hôpitaux Universitaires Genève][dsi-hug]
 [npm-dl-logo-user-tooltip]: https://img.shields.io/npm/dw/@hug/ngx-user-tooltip.svg?color=7986CB&logo=npm&label=npm
 [tests-user-tooltip]: https://github.com/dsi-hug/ngx-components/actions/workflows/ci_test_user-tooltip.yml
 [tests-logo-user-tooltip]: https://github.com/dsi-hug/ngx-components/actions/workflows/ci_test_user-tooltip.yml/badge.svg
+
+[npm-date-picker]: https://www.npmjs.com/package/@hug/ngx-date-picker
+[npm-logo-date-picker]: https://img.shields.io/npm/v/@hug/ngx-date-picker.svg?color=blue&logo=npm
+[npm-dl-date-picker]: https://npmcharts.com/compare/@hug/ngx-date-picker?minimal=true
+[npm-dl-logo-date-picker]: https://img.shields.io/npm/dw/@hug/ngx-date-picker.svg?color=7986CB&logo=npm&label=npm
+[tests-date-picker]: https://github.com/dsi-hug/ngx-components/actions/workflows/ci_test_date-picker.yml
+[tests-logo-date-picker]: https://github.com/dsi-hug/ngx-components/actions/workflows/ci_test_date-picker.yml/badge.svg
diff --git a/angular.json b/angular.json
index 0ea0d8bf..a70e1aa4 100644
--- a/angular.json
+++ b/angular.json
@@ -600,6 +600,37 @@
                     }
                 }
             }
+        },
+        "date-picker": {
+            "projectType": "library",
+            "root": "projects/date-picker",
+            "sourceRoot": "projects/date-picker/src",
+            "prefix": "lib",
+            "architect": {
+                "build": {
+                    "builder": "@angular-devkit/build-angular:ng-packagr",
+                    "options": {
+                        "project": "projects/date-picker/ng-package.json"
+                    },
+                    "configurations": {
+                        "production": {
+                            "tsConfig": "projects/date-picker/tsconfig.lib.prod.json"
+                        },
+                        "development": {
+                            "tsConfig": "projects/date-picker/tsconfig.lib.json"
+                        }
+                    },
+                    "defaultConfiguration": "production"
+                },
+                "test": {
+                    "builder": "@angular-devkit/build-angular:karma",
+                    "options": {
+                        "main": "projects/date-picker/src/test.ts",
+                        "tsConfig": "projects/date-picker/tsconfig.spec.json",
+                        "karmaConfig": "projects/date-picker/karma.conf.js"
+                    }
+                }
+            }
         }
     },
     "cli": {
diff --git a/package-lock.json b/package-lock.json
index 9bc60f96..dc6c87d5 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -7,6 +7,7 @@
             "hasInstallScript": true,
             "workspaces": [
                 "projects/core",
+                "projects/date-picker",
                 "projects/layout",
                 "projects/list-loader",
                 "projects/message-box",
@@ -4434,6 +4435,10 @@
             "resolved": "projects/core",
             "link": true
         },
+        "node_modules/@hug/ngx-date-picker": {
+            "resolved": "projects/date-picker",
+            "link": true
+        },
         "node_modules/@hug/ngx-layout": {
             "resolved": "projects/layout",
             "link": true
@@ -22805,6 +22810,17 @@
                 "rxjs": ">= 7.0.0"
             }
         },
+        "projects/date-picker": {
+            "version": "1.0.0",
+            "license": "GPL-3.0-only",
+            "dependencies": {
+                "tslib": "^2.6.3"
+            },
+            "peerDependencies": {
+                "@angular/common": ">= 14",
+                "@angular/core": ">= 14"
+            }
+        },
         "projects/layout": {
             "name": "@hug/ngx-layout",
             "version": "1.1.3",
diff --git a/package.json b/package.json
index f0f04b1a..4d94b793 100644
--- a/package.json
+++ b/package.json
@@ -13,6 +13,7 @@
     },
     "workspaces": [
         "projects/core",
+        "projects/date-picker",
         "projects/layout",
         "projects/list-loader",
         "projects/message-box",
diff --git a/projects/date-picker/README.md b/projects/date-picker/README.md
new file mode 100644
index 00000000..5711be9a
--- /dev/null
+++ b/projects/date-picker/README.md
@@ -0,0 +1,6 @@
+@hug/date-picker
+=======
+
+The sources for this package are in the main [DSI-HUG/ngx-components](https://github.com/dsi-hug/ngx-components) repo. Please file issues and pull requests against that repo.
+
+License: GPL-3.0-only
diff --git a/projects/date-picker/karma.conf.js b/projects/date-picker/karma.conf.js
new file mode 100644
index 00000000..d849de20
--- /dev/null
+++ b/projects/date-picker/karma.conf.js
@@ -0,0 +1,45 @@
+// Karma configuration file, see link for more information
+// https://karma-runner.github.io/1.0/config/configuration-file.html
+
+module.exports = config => {
+    config.set({
+        basePath: '',
+        frameworks: ['jasmine', '@angular-devkit/build-angular'],
+        plugins: [
+            require('karma-jasmine'),
+            require('karma-chrome-launcher'),
+            require('karma-jasmine-html-reporter'),
+            require('karma-coverage'),
+            require('@angular-devkit/build-angular/plugins/karma')
+        ],
+        client: {
+            jasmine: {
+                // you can add configuration options for Jasmine here
+                // the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html
+                // for example, you can disable the random execution with `random: false`
+                // or set a specific seed with `seed: 4321`
+            },
+            clearContext: false // leave Jasmine Spec Runner output visible in browser
+        },
+        jasmineHtmlReporter: {
+            suppressAll: true // removes the duplicated traces
+        },
+        coverageReporter: {
+            dir: require('path').join(__dirname, '../../coverage/date-picker'),
+            subdir: '.',
+            reporters: [
+                { type: 'html' },
+                { type: 'text-summary' }
+            ]
+        },
+        reporters: ['progress', 'kjhtml'],
+        port: 9876,
+        colors: true,
+        logLevel: config.LOG_INFO,
+        autoWatch: true,
+        browsers: ['Chrome'],
+        singleRun: false,
+        failOnEmptyTestSuite: false,
+        restartOnFileChange: true
+    });
+};
diff --git a/projects/date-picker/ng-package.json b/projects/date-picker/ng-package.json
new file mode 100644
index 00000000..82c296fe
--- /dev/null
+++ b/projects/date-picker/ng-package.json
@@ -0,0 +1,10 @@
+{
+    "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
+    "dest": "../../dist/date-picker",
+    "assets": [
+        "CHANGELOG.md"
+    ],
+    "lib": {
+        "entryFile": "src/index.ts"
+    }
+}
diff --git a/projects/date-picker/package.json b/projects/date-picker/package.json
new file mode 100644
index 00000000..560e31eb
--- /dev/null
+++ b/projects/date-picker/package.json
@@ -0,0 +1,42 @@
+{
+    "name": "@hug/ngx-date-picker",
+    "version": "1.0.0",
+    "description": "HUG Angular - date-picker component",
+    "homepage": "https://github.com/dsi-hug/ngx-components",
+    "license": "GPL-3.0-only",
+    "author": "HUG - Hôpitaux Universitaires Genève",
+    "contributors": [
+        "badisi (https://github.com/badisi)",
+        "vapkse (https://github.com/vapkse)"
+    ],
+    "repository": {
+        "type": "git",
+        "url": "git+https://github.com/dsi-hug/ngx-components.git"
+    },
+    "keywords": [
+        "angular",
+        "material",
+        "material design",
+        "components"
+    ],
+    "sideEffects": false,
+    "scripts": {
+        "lint": "eslint . --fix",
+        "test": "ng test date-picker",
+        "test:ci": "ng test date-picker --watch=false --browsers=ChromeHeadless",
+        "build:ng": "ng build date-picker -c=production",
+        "build": "nx build:ng @hug/ngx-date-picker --verbose",
+        "release": "nx release -p=@hug/ngx-date-picker --yes --verbose",
+        "release:dry-run": "nx release -p=@hug/ngx-date-picker --verbose --dry-run"
+    },
+    "peerDependencies": {
+        "@angular/common": ">= 14",
+        "@angular/core": ">= 14"
+    },
+    "dependencies": {
+        "tslib": "^2.6.3"
+    },
+    "publishConfig": {
+        "access": "public"
+    }
+}
diff --git a/projects/date-picker/src/index.ts b/projects/date-picker/src/index.ts
new file mode 100644
index 00000000..e69de29b
diff --git a/projects/date-picker/src/test.ts b/projects/date-picker/src/test.ts
new file mode 100644
index 00000000..390c9374
--- /dev/null
+++ b/projects/date-picker/src/test.ts
@@ -0,0 +1,28 @@
+// This file is required by karma.conf.js and loads recursively all the .spec and framework files
+
+import 'zone.js';
+import 'zone.js/testing';
+
+import { getTestBed } from '@angular/core/testing';
+import {
+    BrowserDynamicTestingModule,
+    platformBrowserDynamicTesting
+} from '@angular/platform-browser-dynamic/testing';
+
+declare const require: {
+    context: (path: string, deep?: boolean, filter?: RegExp) => {
+        <T>(id: string): T;
+        keys: () => string[];
+    };
+};
+
+// First, initialize the Angular testing environment.
+getTestBed().initTestEnvironment(
+    BrowserDynamicTestingModule,
+    platformBrowserDynamicTesting()
+);
+
+// Then we find all the tests.
+const context = require.context('./', true, /\.spec\.ts$/);
+// And load the modules.
+context.keys().forEach(context);
diff --git a/projects/date-picker/tsconfig.lib.json b/projects/date-picker/tsconfig.lib.json
new file mode 100644
index 00000000..77ee6a24
--- /dev/null
+++ b/projects/date-picker/tsconfig.lib.json
@@ -0,0 +1,15 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/lib",
+    "declaration": true,
+    "declarationMap": true,
+    "inlineSources": true,
+    "types": []
+  },
+  "exclude": [
+    "src/test.ts",
+    "**/*.spec.ts"
+  ]
+}
diff --git a/projects/date-picker/tsconfig.lib.prod.json b/projects/date-picker/tsconfig.lib.prod.json
new file mode 100644
index 00000000..06de549e
--- /dev/null
+++ b/projects/date-picker/tsconfig.lib.prod.json
@@ -0,0 +1,10 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "extends": "./tsconfig.lib.json",
+  "compilerOptions": {
+    "declarationMap": false
+  },
+  "angularCompilerOptions": {
+    "compilationMode": "partial"
+  }
+}
diff --git a/projects/date-picker/tsconfig.spec.json b/projects/date-picker/tsconfig.spec.json
new file mode 100644
index 00000000..715dd0a5
--- /dev/null
+++ b/projects/date-picker/tsconfig.spec.json
@@ -0,0 +1,17 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/spec",
+    "types": [
+      "jasmine"
+    ]
+  },
+  "files": [
+    "src/test.ts"
+  ],
+  "include": [
+    "**/*.spec.ts",
+    "**/*.d.ts"
+  ]
+}
diff --git a/tsconfig.base.json b/tsconfig.base.json
index 76e1abd9..e0f0ceb5 100644
--- a/tsconfig.base.json
+++ b/tsconfig.base.json
@@ -25,6 +25,9 @@
             "@hug/ngx-core": [
                 "dist/core"
             ],
+            "@hug/ngx-date-picker": [
+                "dist/date-picker"
+            ],
             "@hug/ngx-layout": [
                 "dist/layout"
             ],
diff --git a/tsconfig.json b/tsconfig.json
index 7cdf4b7d..196db68b 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -5,6 +5,9 @@
             "@hug/ngx-core": [
                 "projects/core/src"
             ],
+            "@hug/ngx-date-picker": [
+                "projects/date-picker/src"
+            ],
             "@hug/ngx-layout": [
                 "projects/layout/src"
             ],