diff --git a/src/agenda_culturel/admin.py b/src/agenda_culturel/admin.py
index 1fd3116..76d8b04 100644
--- a/src/agenda_culturel/admin.py
+++ b/src/agenda_culturel/admin.py
@@ -1,5 +1,6 @@
 from django.contrib import admin
-from .models import Event, EventSubmissionForm
+from .models import Event, EventSubmissionForm, Category
 
 admin.site.register(Event)
 admin.site.register(EventSubmissionForm)
+admin.site.register(Category)
diff --git a/src/agenda_culturel/migrations/0003_category.py b/src/agenda_culturel/migrations/0003_category.py
new file mode 100644
index 0000000..1764d3f
--- /dev/null
+++ b/src/agenda_culturel/migrations/0003_category.py
@@ -0,0 +1,23 @@
+# Generated by Django 4.2.1 on 2023-10-21 14:59
+
+import colorfield.fields
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('agenda_culturel', '0002_eventsubmissionform_alter_event_reference_urls'),
+    ]
+
+    operations = [
+        migrations.CreateModel(
+            name='Category',
+            fields=[
+                ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('name', models.CharField(help_text='Category name', max_length=512, verbose_name='Name')),
+                ('codename', models.CharField(help_text='Short name of the category', max_length=3, verbose_name='Short name')),
+                ('color', colorfield.fields.ColorField(default='#CCCCCCC', help_text='Color used as background for the category', image_field=None, max_length=25, samples=None, verbose_name='Color')),
+            ],
+        ),
+    ]
diff --git a/src/agenda_culturel/migrations/0004_alter_category_color.py b/src/agenda_culturel/migrations/0004_alter_category_color.py
new file mode 100644
index 0000000..ce8afc6
--- /dev/null
+++ b/src/agenda_culturel/migrations/0004_alter_category_color.py
@@ -0,0 +1,19 @@
+# Generated by Django 4.2.1 on 2023-10-21 19:18
+
+import colorfield.fields
+from django.db import migrations
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('agenda_culturel', '0003_category'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='category',
+            name='color',
+            field=colorfield.fields.ColorField(default='#FFFFFF', help_text='Color used as background for the category', image_field=None, max_length=25, samples=None, verbose_name='Color'),
+        ),
+    ]
diff --git a/src/agenda_culturel/migrations/0005_alter_category_options.py b/src/agenda_culturel/migrations/0005_alter_category_options.py
new file mode 100644
index 0000000..bc0c5b1
--- /dev/null
+++ b/src/agenda_culturel/migrations/0005_alter_category_options.py
@@ -0,0 +1,17 @@
+# Generated by Django 4.2.1 on 2023-10-21 19:30
+
+from django.db import migrations
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('agenda_culturel', '0004_alter_category_color'),
+    ]
+
+    operations = [
+        migrations.AlterModelOptions(
+            name='category',
+            options={'verbose_name': 'Category', 'verbose_name_plural': 'Categories'},
+        ),
+    ]
diff --git a/src/agenda_culturel/models.py b/src/agenda_culturel/models.py
index 3951155..049c9c9 100644
--- a/src/agenda_culturel/models.py
+++ b/src/agenda_culturel/models.py
@@ -3,11 +3,52 @@ from django.contrib.postgres.fields import ArrayField
 from django.utils.translation import gettext_lazy as _
 from django.template.defaultfilters import slugify  # new
 from django.urls import reverse
+from colorfield.fields import ColorField
 
 from django.template.defaultfilters import date as _date
 from datetime import datetime
 
 
+class Category(models.Model):
+
+    COLOR_PALETTE = [
+        ("#ea5545", "color 1"),
+        ("#f46a9b", "color 2"),
+        ("#ef9b20", "color 3"),
+        ("#edbf33", "color 4"),
+        ("#ede15b", "color 5"),
+        ("#bdcf32", "color 6"),
+        ("#87bc45", "color 7"),
+        ("#27aeef", "color 8"),
+        ("#b33dc6", "color 9")]
+
+    name = models.CharField(verbose_name=_('Name'), help_text=_('Category name'), max_length=512)
+    codename = models.CharField(verbose_name=_('Short name'), help_text=_('Short name of the category'), max_length=3)
+    color = ColorField(verbose_name=_('Color'), help_text=_('Color used as background for the category'), blank=True, null=True)
+
+    def save(self, *args, **kwargs):
+        if self.color is None:
+            existing_colors = [c.color for c in Category.objects.all()]
+            if len(existing_colors) > len(Category.COLOR_PALETTE):
+                self.color = "#CCCCCC"
+            else:
+                for c, n in Category.COLOR_PALETTE:
+                    if c not in existing_colors:
+                        self.color = c
+                        break
+            if self.color is None:
+                self.color = "#CCCCCC"
+
+        super(Category, self).save(*args, **kwargs)
+
+
+    def __str__(self):
+        return self.name + " (" + self.codename + ")"
+
+    class Meta:
+        verbose_name = _('Category')
+        verbose_name_plural = _('Categories')
+
 class Event(models.Model):
 
     class STATUS(models.TextChoices): 
diff --git a/src/agenda_culturel/settings/base.py b/src/agenda_culturel/settings/base.py
index 7435eb1..f538d4c 100644
--- a/src/agenda_culturel/settings/base.py
+++ b/src/agenda_culturel/settings/base.py
@@ -36,6 +36,8 @@ INSTALLED_APPS = [
     "django.contrib.staticfiles",
     "corsheaders",
     "agenda_culturel",
+    "colorfield",
+    'django_extensions',
 ]
 
 MIDDLEWARE = [
diff --git a/src/agenda_culturel/templates/agenda_culturel/event.html b/src/agenda_culturel/templates/agenda_culturel/event.html
index 2ecd9c1..9f955db 100644
--- a/src/agenda_culturel/templates/agenda_culturel/event.html
+++ b/src/agenda_culturel/templates/agenda_culturel/event.html
@@ -1,8 +1,8 @@
-{% extends "agenda_culturel/page.html" %}
+{% extends "agenda_culturel/page_events.html" %}
 
 {% block title %}{{ object.title }}{% endblock %}
 
-{% block content %}
+{% block events %}
 
 <h1>{{ object.title }}</h1>
 <p>Date&nbsp;: {{ object.start_day }}</p>
diff --git a/src/agenda_culturel/templates/agenda_culturel/home.html b/src/agenda_culturel/templates/agenda_culturel/home.html
index 2934e51..213d7ed 100644
--- a/src/agenda_culturel/templates/agenda_culturel/home.html
+++ b/src/agenda_culturel/templates/agenda_culturel/home.html
@@ -1,8 +1,8 @@
-{% extends "agenda_culturel/page.html" %}
+{% extends "agenda_culturel/page_event.html" %}
 
 {% block title %}Accueil{% endblock %}
 
-{% block content %}
+{% block events %}
 <h1>Événements</h1>
 <ul>
 {% for event in object_list %}
diff --git a/src/agenda_culturel/templates/agenda_culturel/page-events.html b/src/agenda_culturel/templates/agenda_culturel/page-events.html
new file mode 100644
index 0000000..7f7ab46
--- /dev/null
+++ b/src/agenda_culturel/templates/agenda_culturel/page-events.html
@@ -0,0 +1,24 @@
+{% extends "agenda_culturel/page.html" %}
+
+ {% block content %}
+    <header>
+        <div id="display-mode">
+            TODO
+        </div>
+        <div id="categories">
+            {% for cat in categories %}
+                {% if category == cat %}
+                <span style="background: {{ cat.color }}">{{ cat }}</span>
+                {% else %}
+                    <a href="{% url 'view_mode_cat' selected_mode cat.pk %}" style="background: {{ cat.color }}">{{ cat }}</a>
+                {% endif %}
+            {% endfor %}
+        </div>
+    </header>
+    <section>
+        {% block events %}{% endblock %}
+    </section>
+    <footer id="tags">
+        TODO
+    </footer>    
+ {% endblock %}
diff --git a/src/agenda_culturel/templates/agenda_culturel/page.html b/src/agenda_culturel/templates/agenda_culturel/page.html
index d9a5350..83da5b4 100644
--- a/src/agenda_culturel/templates/agenda_culturel/page.html
+++ b/src/agenda_culturel/templates/agenda_culturel/page.html
@@ -16,7 +16,19 @@
     {% endblock %}
 </head>
 <body>
-    <div id="full_content" class="{% block classe_principale %}{% endblock %}">
-    {% block content %}{% endblock %}
+    <div id="full_content" class="{% block main_class %}{% endblock %}">
+        <header>
+
+        </header>
+        <aside>
+            <!-- -->
+        </aside>
+        <section>
+            {% block content %}{% endblock %}
+        </section>
+        <footer>
+
+        </footer>
+        
     </div>
 </body>
\ No newline at end of file
diff --git a/src/agenda_culturel/urls.py b/src/agenda_culturel/urls.py
index 383eb6a..9caad4f 100644
--- a/src/agenda_culturel/urls.py
+++ b/src/agenda_culturel/urls.py
@@ -7,9 +7,12 @@ from django.urls import path, include, re_path
 
 from .views import *
 
+modes = '|'.join([dm.name for dm in DisplayMode]) + ")"
+
 urlpatterns = [
-    path("", EventListView.as_view(), name="home"),
-    re_path(r'^(?P<mode>' + '|'.join([dm.value for dm in DisplayModes]) + ')/$', view_interval, name='view_interval'),
+    path("", home, name="home"),
+    re_path(r'^(?P<mode>' + modes + '/$', view_mode, name='view_mode'),
+    re_path(r'^(?P<mode>' + modes + '/(?P<cat_id>\d+)/$', view_mode_cat, name='view_mode_cat'),
     path("event/<int:pk>-<extra>", EventDetailView.as_view(), name="view_event"),
     path("proposer", EventSubmissionFormView.as_view(), name="event_submission_form"),
     path("admin/", admin.site.urls),
diff --git a/src/agenda_culturel/views.py b/src/agenda_culturel/views.py
index f71f0d9..807a8c2 100644
--- a/src/agenda_culturel/views.py
+++ b/src/agenda_culturel/views.py
@@ -1,32 +1,44 @@
-from django.shortcuts import render
+from django.shortcuts import render, get_object_or_404
 from django.views.generic import ListView, DetailView, FormView
 
 from .forms import EventSubmissionModelForm
 from .celery import create_event_from_submission
 
-from .models import Event
+from .models import Event, Category
 from django.utils import timezone
 from enum import StrEnum
 
 from django.utils.translation import gettext as _
 
 
-class DisplayModes(StrEnum):
-    this_week = _("this_week")
-    this_weekend = _("this_weekend")
-    next_week = _("next_week")
-    this_month = _("this_month")
-    next_month = _("next_month")
-
-def view_interval(request, mode):
-    
-    context = {}
-    return render(request, 'agenda_culturel/list.html', context)
+class DisplayMode(StrEnum):
+    this_week = _("this week")
+    this_weekend = _("this weekend")
+    next_week = _("next week")
+    this_month = _("this month")
+    next_month = _("next month")
 
 
-class EventListView(ListView):
-    model = Event
-    template_name = "agenda_culturel/home.html"
+def home(request):
+    # TODO: si on est au début de la semaine, on affiche la semaine en entier
+    # sinon, on affiche le week-end
+    # sauf si on est dimanche après 23h, on affiche la semaine prochaine
+    return view_mode(request, DisplayMode.this_week)
+
+
+def view_mode(request, mode):
+    categories = Category.objects.all()
+    context = {"modes": list(DisplayMode), "selected_mode": mode, "categories": categories}
+    # TODO: select matching events
+    return render(request, 'agenda_culturel/page-events.html', context)
+
+
+def view_mode_cat(request, mode, cat_id):
+    category = get_object_or_404(Category, pk=cat_id)
+    categories = Category.objects.all()
+    # TODO: select matching events
+    context = {"modes": list(DisplayMode), "selected_mode": mode, "category": category, "categories": categories}
+    return render(request, 'agenda_culturel/page-events.html', context)
 
 
 
diff --git a/src/requirements.txt b/src/requirements.txt
index 1657d88..82214a1 100644
--- a/src/requirements.txt
+++ b/src/requirements.txt
@@ -23,3 +23,6 @@ whitenoise==6.4.0
 selenium==4.14.0
 BeautifulSoup4==4.12.2
 watchdog==3.0.0
+django-colorfield==0.10.1
+cffi==1.16.0
+django-extensions==3.2.3
diff --git a/src/scripts/__init__.py b/src/scripts/__init__.py
new file mode 100644
index 0000000..e69de29
diff --git a/src/scripts/create_categories.py b/src/scripts/create_categories.py
new file mode 100644
index 0000000..1ba4711
--- /dev/null
+++ b/src/scripts/create_categories.py
@@ -0,0 +1,25 @@
+from agenda_culturel.models import Category
+
+def run():
+    # concert, théâtre, jeune public, danse, arts du spectacle, exposition
+    # conférence, nature, 
+    # divers
+
+    categories = [
+        ("Théâtre", "THÉ"),
+        ("Concert", "CCR"),
+        ("Danse", "DSE"),
+        ("Arts du spectacle", "SPE"),
+        ("Jeune public", "JEP"),
+        ("Exposition", "EXP"),
+        ("Conférence", "CNF"),
+        ("Nature", "NTR"),
+        ("Divers", "DIV")
+    ]
+
+    if len(Category.objects.all()) == 0:
+        print("On créée des catégories")
+        for c in categories:
+            cat = Category(name=c[0], codename=c[1])
+            cat.save()
+