diff --git a/packages/twenty-docs/docs/user-guide/basics/custom objects.mdx b/packages/twenty-docs/docs/user-guide/basics/custom objects.mdx
index e364a36a14..a8554f89b5 100644
--- a/packages/twenty-docs/docs/user-guide/basics/custom objects.mdx
+++ b/packages/twenty-docs/docs/user-guide/basics/custom objects.mdx
@@ -5,6 +5,8 @@ sidebar_custom_props:
icon: TbAugmentedReality
---
+import ThemedImage from '@theme/ThemedImage';
+
Objects are structures that allow you to store data (records, attributes, and values) specific to an organization. Twenty provides both standard and custom objects.
Standard objects are in-built objects with a set of attributes available for all users. All workspaces come with three standard objects by default: People, Companies, and Opportunities. Standard objects have standard fields that are also available for all Twenty users, like Account Owner and URL.
@@ -19,13 +21,12 @@ To create a new custom object:
2. Under Workspace, go to Data model. Here you'll be able to see an overview of all your existing Standard and Custom objects (both active and disabled).
-
-
-
+
+
-3. Click on `+ New object` at the top, then choose Custom as the object type. Enter the name (both singular and plural) and description for your custom object and hit Save (at the top right). Using Listing as an example of custom object, the singular would be "listing" and the plural would be "listings" along with a description like "Listings that hosts created to showcase their property."
+3. Click on `+ New object` at the top, then choose Custom as the object type. Enter the name (both singular and plural), choose an icon, and add a description for your custom object and hit Save (at the top right). Using Listing as an example of custom object, the singular would be "listing" and the plural would be "listings" along with a description like "Listings that hosts created to showcase their property."
@@ -35,7 +36,7 @@ To create a new custom object:
-4. Once you create your custom object, you'll be able to manage it. You can edit the name and description, view the different fields, and add more fields.
+4. Once you create your custom object, you'll be able to manage it. You can edit the name, icon and description, view the different fields, and add more fields.
diff --git a/packages/twenty-docs/docs/user-guide/basics/notes.mdx b/packages/twenty-docs/docs/user-guide/basics/notes.mdx
new file mode 100644
index 0000000000..3e71b64f7e
--- /dev/null
+++ b/packages/twenty-docs/docs/user-guide/basics/notes.mdx
@@ -0,0 +1,30 @@
+---
+title: Notes
+sidebar_position: 1
+sidebar_custom_props:
+ icon: TbNote
+---
+
+import ThemedImage from '@theme/ThemedImage';
+
+Easily create a note to keep track of important information.
+
+## Create Notes
+
+To attach a note to the record, go to the Notes tab of a record page and click on `+ New Note`. You can also format, comment, and upload images to your notes.
+
+
+
+## Format Notes
+
+You can format your notes right from the editor. Use markdown syntax, press the `/` key or click on the `+` icon on the editor to see the different block options, such as headings, tables, and lists. You can also attach images to your note.
+
+Highlight the text to see more formatting options like bold, italics, and alignment options.
+
+You can also change the background color and text color of each block to highlight important things in your note. To do so, hover over the block you want to format and click on the `⋮⋮` icon besides the `+` icon. Click on Colors to open up all color options for both the text and the background.
+
+## Delete Notes
+
+To delete a note, open it and click on the trashcan icon on the upper right of the screen. This will permanently delete your note.
+
+
diff --git a/packages/twenty-docs/docs/user-guide/basics/opportunities.mdx b/packages/twenty-docs/docs/user-guide/basics/opportunities.mdx
new file mode 100644
index 0000000000..8949b33bb9
--- /dev/null
+++ b/packages/twenty-docs/docs/user-guide/basics/opportunities.mdx
@@ -0,0 +1,50 @@
+---
+title: Opportunities
+sidebar_position: 1
+sidebar_custom_props:
+ icon: TbTargetArrow
+---
+
+import ThemedImage from '@theme/ThemedImage';
+
+All opportunities are presented in a Kanban board, where each column represents the stage of your workflow and each card represents a record. For each card, you can list the amount, close date, probability, and the point of contact. You can also move each card between stages as it goes through your workflow.
+
+
+
+## Add and delete stages
+
+You can add as many stages as you'd like to perfectly capture your entire workflow. To add a new stage, click on Options on the top right, choose Stages, and then click on `+ Add stage`. Name your stage and hit `Enter` to create it. Click on the name of the stage and then on on edit to change the stage's name and color.
+
+To delete a stage, click on the stage name or on the `⋮` icon that appears when you hover over a stage. Click on edit to open the menu and click on Delete at the bottom to permanently delete a stage.
+
+## Filter, update, and sort views
+
+It's easy to add filters and update your view to focus on only the most important things. To add a filter:
+- Click Filter on the top right of the opportunities board and select the field you want to filter by (Amount, Close date, Company, Creation Date, Person, Pipeline Step, and Point of Contact).
+- Select the filter's condition (is/is not, greater than/lesser than) and then choose the value of the field you want to filter by.
+- You can either create a new view or update your current view with the filter in place.
+- You can also add another filter by following the same steps or clicking on the `+ Add filter` button on top of the columns.
+- To remove a filter condition, simply click on the X next to the attribute you used to filter the records.
+
+
+
+
+
+You can also sort your records by Close date, Creation date, and Probability. To do so:
+- Click on Sort on the top right.
+- Choose Ascending or Descending, and then the field you want to sort the records by.
+- You can then update your view or create a new one with the sort filter in place.
+
+## Display fields
+
+You can configure your kanban board to display some fields and hide others. By default, the Amount, Close date, Probability, and Point of Contact are all visible. To hide a field, click on Options on the top right, then on Fields to bring up the list of options. Hover over the field you want to hide to bring up the `-` button. Click on it to hide the field.
+
+You can also rearrange the order of fields by holding down the field name and dragging it to where you want it.
+
+
+
+
+
+You can also hide all the fields, and get an overview of all the opportunities at a glance. To do so, click on Options on the top right and turn on the toggle in front of the Compact view option.
+
+
\ No newline at end of file
diff --git a/packages/twenty-docs/docs/user-guide/basics/tasks.mdx b/packages/twenty-docs/docs/user-guide/basics/tasks.mdx
new file mode 100644
index 0000000000..786da1e75f
--- /dev/null
+++ b/packages/twenty-docs/docs/user-guide/basics/tasks.mdx
@@ -0,0 +1,18 @@
+---
+title: Tasks
+sidebar_position: 1
+sidebar_custom_props:
+ icon: TbChecklist
+---
+
+import ThemedImage from '@theme/ThemedImage';
+
+You can find all the tasks from across your workspace in the Tasks window in your sidebar. You can also find a dedicated tab for Tasks on each record so you can add and edit tasks directly from each record. Alternatively, you can click on the `+` button on the top right of each record page and then click on Task to create a new task.
+
+
+
+## Tasks page
+
+Switch between upcoming and completed tasks to get an overview of what's pending and what's already been done.
+
+You can also see the tasks assigned to others by changing the assignee from the top right of the Tasks page, and edit each task to update the content, due dates, and assignee. You can also comment on each task.
\ No newline at end of file
diff --git a/packages/twenty-docs/docs/user-guide/others/glossary.mdx b/packages/twenty-docs/docs/user-guide/others/glossary.mdx
index cb5814ac32..56351dbff3 100644
--- a/packages/twenty-docs/docs/user-guide/others/glossary.mdx
+++ b/packages/twenty-docs/docs/user-guide/others/glossary.mdx
@@ -15,6 +15,9 @@ A `Pipeline` is a way to track a business process. Pipelines are present within
- A **module** contains the logic for a certain business process (for example: sales, recruiting).
- **Stages** map the steps in your process (for example: new, ongoing, won, lost).
+### Views
+With views, you can customize how your records are displayed. You can have different filters and sort settings for each view.
+
### Workspace
-A `Workspace` typically represents a company using Twenty.
-It has a single domain name, which is typically the domain name your company uses for employee email addresses.
+A `Workspace` typically represents a company using Twenty. It holds all the records and data that you and your team members add to Twenty.
+It has a single domain name, which is typically the domain name your company uses for employee email addresses.
\ No newline at end of file
diff --git a/packages/twenty-docs/docs/user-guide/others/tips.mdx b/packages/twenty-docs/docs/user-guide/others/tips.mdx
new file mode 100644
index 0000000000..9a00a4aa81
--- /dev/null
+++ b/packages/twenty-docs/docs/user-guide/others/tips.mdx
@@ -0,0 +1,39 @@
+---
+title: Tips
+sidebar_position: 1
+sidebar_custom_props:
+ icon: TbInfoCircle
+---
+
+## Update workspace name & logo
+
+Workspace admins can edit its name and logo in settings.
+
+- From the sidebar, go to Settings.
+- Under Workspace, go to General.
+- Edit the name and logo. Your changes will be saved automatically.
+
+## Enable dark mode
+
+Not a fan of light mode? Easily switch to dark mode with these steps:
+
+- From the sidebar, go to Settings.
+- Under User, go to Appearance.
+- Select Dark. Your changes will be saved automatically.
+
+## Account settings
+
+Configure your user account and set your preferences.
+
+- From the sidebar, go to Settings.
+- Under User, go to Profile to edit your name and profile picture. You can upload PNGs, GIFs, and JPEGs.
+- Manage your accounts and configure your email and calendar settings in Accounts.
+- Your changes will be saved automatically.
+
+## Invite & manage members
+
+Admins can easily invite new members any time.
+
+- From the sidebar, go to Settings.
+- Under Workspace, go to Members.
+- Use the invite link to add more members to your workspace or simply delete existing ones.
\ No newline at end of file
diff --git a/packages/twenty-docs/docs/user-guide/user-guide.mdx b/packages/twenty-docs/docs/user-guide/user-guide.mdx
index fe62c061ce..8fba99db52 100644
--- a/packages/twenty-docs/docs/user-guide/user-guide.mdx
+++ b/packages/twenty-docs/docs/user-guide/user-guide.mdx
@@ -8,12 +8,12 @@ sidebar_custom_props:
isSidebarRoot: true
---
+import ThemedImage from '@theme/ThemedImage';
+
# Welcome to Twenty's User Guide
The purpose of this user guide is to help you learn how you can use Twenty to build the CRM you want.
-This quick-start guide walks you through the basics.
-
## Quick Search
You'll see a search bar at the top of your sidebar. You can also bring up the command bar with the `cmd`/`ctrl` + `k` shortcut to navigate through your workspace, and find people, companies, notes, and more.
@@ -22,7 +22,7 @@ The command bar also supports other shortcuts for navigation.
## Create Pre-filtered Views
-Twenty allows you to add filters to see data that meets certain criteria and hides the rest.
+Twenty allows you to add filters to see data that meets certain criteria and hides the rest. You can apply multiple filters at once.
To create a filter in your workspace, click Filter at the top right and select the attribute you'd like to filter your records by. Create your filter and then save changes in a new view by clicking `+ Create view`.
@@ -32,6 +32,30 @@ The filtered view is now available to your whole team.
You can also add more stages to the opportunities board.
-On the Opportunities page, click on Options, Stages, then `+ Add Stage`.
+On the Opportunities page, click on Options, Stages, then `+ Add Stage`.
-You can also edit the stage by clicking on the name.
\ No newline at end of file
+You can also edit the stage by clicking on the name.
+
+## Create Notes and Tasks For Each Record
+
+You can attach notes and tasks to each record. With Notes, you can keep a record of any observations, comments, and interactions, and keep track of all items that require action with Tasks.
+
+There are multiple ways to create notes and tasks. Learn more about [Notes](./basics/notes.mdx) and [Tasks](./basics/tasks.mdx).
+
+## Upload Files For Each Record
+
+You can also upload and attach files for each record. To do so, expand a record, and head over to the Files tab. You'll then see the `+ Add file` button.
+
+
+
+## Add Records To Favorites
+
+You can add records to your favorites for quick access. To do so, expand the record you want to add, and click on the heart icon on the top right. You'll now be able to see your favorite records in your sidebar right above your workspace.
+
+
+
+## Import data
+
+You can easily import People and Companies data into Twenty from other apps using a .csv, .xslx, or .xsl file. In the Companies or People page, click on Options and then on Import.
+
+Upload your file, match the columns, and validate the data to import it.
\ No newline at end of file
diff --git a/packages/twenty-docs/src/theme/icons.js b/packages/twenty-docs/src/theme/icons.js
index 082003cef8..2e5e77f357 100644
--- a/packages/twenty-docs/src/theme/icons.js
+++ b/packages/twenty-docs/src/theme/icons.js
@@ -62,6 +62,9 @@ export {
TbSelect,
TbToggleRight,
TbTextPlus,
+ TbTargetArrow,
+ TbNote,
+ TbInfoCircle,
TbLink,
TbNavigation,
TbMenu,
diff --git a/packages/twenty-docs/static/img/architecture-dark.png b/packages/twenty-docs/static/img/architecture-dark.png
index 49f7786745..6d79318a5c 100644
Binary files a/packages/twenty-docs/static/img/architecture-dark.png and b/packages/twenty-docs/static/img/architecture-dark.png differ
diff --git a/packages/twenty-docs/static/img/architecture-light.png b/packages/twenty-docs/static/img/architecture-light.png
index f3587e6639..8710947ad9 100644
Binary files a/packages/twenty-docs/static/img/architecture-light.png and b/packages/twenty-docs/static/img/architecture-light.png differ
diff --git a/packages/twenty-docs/static/img/contributor/add-custom-objects.jpeg b/packages/twenty-docs/static/img/contributor/add-custom-objects.jpeg
index 2f25d84cd8..7437e1ee5e 100644
Binary files a/packages/twenty-docs/static/img/contributor/add-custom-objects.jpeg and b/packages/twenty-docs/static/img/contributor/add-custom-objects.jpeg differ
diff --git a/packages/twenty-docs/static/img/contributor/custom-object-schema.jpeg b/packages/twenty-docs/static/img/contributor/custom-object-schema.jpeg
index fef3c5d67e..269660df4f 100644
Binary files a/packages/twenty-docs/static/img/contributor/custom-object-schema.jpeg and b/packages/twenty-docs/static/img/contributor/custom-object-schema.jpeg differ
diff --git a/packages/twenty-docs/static/img/contributor/ide-dev-container-open.png b/packages/twenty-docs/static/img/contributor/ide-dev-container-open.png
index d440b05944..c06971336d 100644
Binary files a/packages/twenty-docs/static/img/contributor/ide-dev-container-open.png and b/packages/twenty-docs/static/img/contributor/ide-dev-container-open.png differ
diff --git a/packages/twenty-docs/static/img/contributor/ide-extensions.png b/packages/twenty-docs/static/img/contributor/ide-extensions.png
index 5854a5ef58..2a17e4b361 100644
Binary files a/packages/twenty-docs/static/img/contributor/ide-extensions.png and b/packages/twenty-docs/static/img/contributor/ide-extensions.png differ
diff --git a/packages/twenty-docs/static/img/contributor/ide-fresh-install.png b/packages/twenty-docs/static/img/contributor/ide-fresh-install.png
index afcb1e309a..c07a7e553a 100644
Binary files a/packages/twenty-docs/static/img/contributor/ide-fresh-install.png and b/packages/twenty-docs/static/img/contributor/ide-fresh-install.png differ
diff --git a/packages/twenty-docs/static/img/contributor/ide-project-open.png b/packages/twenty-docs/static/img/contributor/ide-project-open.png
index d23ffad02c..3c60b1745e 100644
Binary files a/packages/twenty-docs/static/img/contributor/ide-project-open.png and b/packages/twenty-docs/static/img/contributor/ide-project-open.png differ
diff --git a/packages/twenty-docs/static/img/contributor/ide-start-dev-container.png b/packages/twenty-docs/static/img/contributor/ide-start-dev-container.png
index ba2fc58dfe..a73953e997 100644
Binary files a/packages/twenty-docs/static/img/contributor/ide-start-dev-container.png and b/packages/twenty-docs/static/img/contributor/ide-start-dev-container.png differ
diff --git a/packages/twenty-docs/static/img/contributor/wsl-complete.png b/packages/twenty-docs/static/img/contributor/wsl-complete.png
index dafc5ea915..a144c330c2 100644
Binary files a/packages/twenty-docs/static/img/contributor/wsl-complete.png and b/packages/twenty-docs/static/img/contributor/wsl-complete.png differ
diff --git a/packages/twenty-docs/static/img/create-tasks-dark.png b/packages/twenty-docs/static/img/create-tasks-dark.png
index 61fdc0148f..30ffb549c8 100644
Binary files a/packages/twenty-docs/static/img/create-tasks-dark.png and b/packages/twenty-docs/static/img/create-tasks-dark.png differ
diff --git a/packages/twenty-docs/static/img/create-tasks-light.png b/packages/twenty-docs/static/img/create-tasks-light.png
index 27c32f2aa9..2a850790b7 100644
Binary files a/packages/twenty-docs/static/img/create-tasks-light.png and b/packages/twenty-docs/static/img/create-tasks-light.png differ
diff --git a/packages/twenty-docs/static/img/dark-doc-preview.png b/packages/twenty-docs/static/img/dark-doc-preview.png
index 833fed1a33..fa4d80e1e4 100644
Binary files a/packages/twenty-docs/static/img/dark-doc-preview.png and b/packages/twenty-docs/static/img/dark-doc-preview.png differ
diff --git a/packages/twenty-docs/static/img/dark-sign-in.png b/packages/twenty-docs/static/img/dark-sign-in.png
index 5541eae103..54ddeda821 100644
Binary files a/packages/twenty-docs/static/img/dark-sign-in.png and b/packages/twenty-docs/static/img/dark-sign-in.png differ
diff --git a/packages/twenty-docs/static/img/discord-icon.svg b/packages/twenty-docs/static/img/discord-icon.svg
index c03e8e1270..71b9fdac9e 100644
--- a/packages/twenty-docs/static/img/discord-icon.svg
+++ b/packages/twenty-docs/static/img/discord-icon.svg
@@ -1,8 +1 @@
-
-
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/packages/twenty-docs/static/img/figma-icon.png b/packages/twenty-docs/static/img/figma-icon.png
index 6b5b44f7fa..c6595adfae 100644
Binary files a/packages/twenty-docs/static/img/figma-icon.png and b/packages/twenty-docs/static/img/figma-icon.png differ
diff --git a/packages/twenty-docs/static/img/follow-your-deals-dark.png b/packages/twenty-docs/static/img/follow-your-deals-dark.png
index 68b9b84219..ab3d36ca9f 100644
Binary files a/packages/twenty-docs/static/img/follow-your-deals-dark.png and b/packages/twenty-docs/static/img/follow-your-deals-dark.png differ
diff --git a/packages/twenty-docs/static/img/follow-your-deals-light.png b/packages/twenty-docs/static/img/follow-your-deals-light.png
index ab343e0c7e..cdca0a773b 100644
Binary files a/packages/twenty-docs/static/img/follow-your-deals-light.png and b/packages/twenty-docs/static/img/follow-your-deals-light.png differ
diff --git a/packages/twenty-docs/static/img/light-doc-preview.png b/packages/twenty-docs/static/img/light-doc-preview.png
index 3a10a3ee58..a6c2939226 100644
Binary files a/packages/twenty-docs/static/img/light-doc-preview.png and b/packages/twenty-docs/static/img/light-doc-preview.png differ
diff --git a/packages/twenty-docs/static/img/light-sign-in.png b/packages/twenty-docs/static/img/light-sign-in.png
index 94f7d2e4be..5b52f0a7cd 100644
Binary files a/packages/twenty-docs/static/img/light-sign-in.png and b/packages/twenty-docs/static/img/light-sign-in.png differ
diff --git a/packages/twenty-docs/static/img/logo-square-dark-no-radius.svg b/packages/twenty-docs/static/img/logo-square-dark-no-radius.svg
index 81e7b8c5fe..45c3cb503f 100644
--- a/packages/twenty-docs/static/img/logo-square-dark-no-radius.svg
+++ b/packages/twenty-docs/static/img/logo-square-dark-no-radius.svg
@@ -1,13 +1 @@
-
-
+
\ No newline at end of file
diff --git a/packages/twenty-docs/static/img/logo-square-dark.svg b/packages/twenty-docs/static/img/logo-square-dark.svg
index bad18fab32..b43e21bce2 100644
--- a/packages/twenty-docs/static/img/logo-square-dark.svg
+++ b/packages/twenty-docs/static/img/logo-square-dark.svg
@@ -1,12 +1 @@
-
+
\ No newline at end of file
diff --git a/packages/twenty-docs/static/img/logo-square-light.svg b/packages/twenty-docs/static/img/logo-square-light.svg
index ce4077db56..cf57485265 100644
--- a/packages/twenty-docs/static/img/logo-square-light.svg
+++ b/packages/twenty-docs/static/img/logo-square-light.svg
@@ -1,11 +1 @@
-
+
\ No newline at end of file
diff --git a/packages/twenty-docs/static/img/preview-dark.png b/packages/twenty-docs/static/img/preview-dark.png
index 7e488ab75d..74fd85af0f 100644
Binary files a/packages/twenty-docs/static/img/preview-dark.png and b/packages/twenty-docs/static/img/preview-dark.png differ
diff --git a/packages/twenty-docs/static/img/preview-light.png b/packages/twenty-docs/static/img/preview-light.png
index 10c7755f8c..d4af37929c 100644
Binary files a/packages/twenty-docs/static/img/preview-light.png and b/packages/twenty-docs/static/img/preview-light.png differ
diff --git a/packages/twenty-docs/static/img/rich-notes-dark.png b/packages/twenty-docs/static/img/rich-notes-dark.png
index 27f4e208f1..425c4e068f 100644
Binary files a/packages/twenty-docs/static/img/rich-notes-dark.png and b/packages/twenty-docs/static/img/rich-notes-dark.png differ
diff --git a/packages/twenty-docs/static/img/rich-notes-light.png b/packages/twenty-docs/static/img/rich-notes-light.png
index 8510c46b31..4f21b6fee2 100644
Binary files a/packages/twenty-docs/static/img/rich-notes-light.png and b/packages/twenty-docs/static/img/rich-notes-light.png differ
diff --git a/packages/twenty-docs/static/img/shortcut-navigation-dark.png b/packages/twenty-docs/static/img/shortcut-navigation-dark.png
index 0754377ad5..68851b8dcc 100644
Binary files a/packages/twenty-docs/static/img/shortcut-navigation-dark.png and b/packages/twenty-docs/static/img/shortcut-navigation-dark.png differ
diff --git a/packages/twenty-docs/static/img/shortcut-navigation-light.png b/packages/twenty-docs/static/img/shortcut-navigation-light.png
index ce90eb33e9..801a2a411a 100644
Binary files a/packages/twenty-docs/static/img/shortcut-navigation-light.png and b/packages/twenty-docs/static/img/shortcut-navigation-light.png differ
diff --git a/packages/twenty-docs/static/img/social-card.png b/packages/twenty-docs/static/img/social-card.png
index 4d954c4531..314e6fef7b 100644
Binary files a/packages/twenty-docs/static/img/social-card.png and b/packages/twenty-docs/static/img/social-card.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/all-opportunities-dark.png b/packages/twenty-docs/static/img/user-guide/all-opportunities-dark.png
new file mode 100644
index 0000000000..ba7cd3564e
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/all-opportunities-dark.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/all-opportunities-light.png b/packages/twenty-docs/static/img/user-guide/all-opportunities-light.png
new file mode 100644
index 0000000000..98842e1a26
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/all-opportunities-light.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/attach-files-to-records-dark.png b/packages/twenty-docs/static/img/user-guide/attach-files-to-records-dark.png
new file mode 100644
index 0000000000..14c95fd148
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/attach-files-to-records-dark.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/attach-files-to-records-light.png b/packages/twenty-docs/static/img/user-guide/attach-files-to-records-light.png
new file mode 100644
index 0000000000..122658c6a4
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/attach-files-to-records-light.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/compact-opportunities-view-dark.png b/packages/twenty-docs/static/img/user-guide/compact-opportunities-view-dark.png
new file mode 100644
index 0000000000..d80ce2881e
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/compact-opportunities-view-dark.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/compact-opportunities-view-light.png b/packages/twenty-docs/static/img/user-guide/compact-opportunities-view-light.png
new file mode 100644
index 0000000000..ee73cf6f61
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/compact-opportunities-view-light.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/connect-zapier.png b/packages/twenty-docs/static/img/user-guide/connect-zapier.png
index ddbb27aca9..b449b882d7 100644
Binary files a/packages/twenty-docs/static/img/user-guide/connect-zapier.png and b/packages/twenty-docs/static/img/user-guide/connect-zapier.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/create-custom-object.gif b/packages/twenty-docs/static/img/user-guide/create-custom-object.gif
index fe72769b6e..e5d5d9ad61 100644
Binary files a/packages/twenty-docs/static/img/user-guide/create-custom-object.gif and b/packages/twenty-docs/static/img/user-guide/create-custom-object.gif differ
diff --git a/packages/twenty-docs/static/img/user-guide/create-new-note-dark.png b/packages/twenty-docs/static/img/user-guide/create-new-note-dark.png
new file mode 100644
index 0000000000..e1958ecc9e
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/create-new-note-dark.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/create-new-note-light.png b/packages/twenty-docs/static/img/user-guide/create-new-note-light.png
new file mode 100644
index 0000000000..d8bfd93f59
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/create-new-note-light.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/create-new-task-dark.png b/packages/twenty-docs/static/img/user-guide/create-new-task-dark.png
new file mode 100644
index 0000000000..22080b4503
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/create-new-task-dark.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/create-new-task-light.png b/packages/twenty-docs/static/img/user-guide/create-new-task-light.png
new file mode 100644
index 0000000000..a48c38bc56
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/create-new-task-light.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/display-fields-dark.png b/packages/twenty-docs/static/img/user-guide/display-fields-dark.png
new file mode 100644
index 0000000000..ba0b8a4b95
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/display-fields-dark.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/display-fields-light.png b/packages/twenty-docs/static/img/user-guide/display-fields-light.png
new file mode 100644
index 0000000000..6d688d652b
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/display-fields-light.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/filter-opportunities-dark.png b/packages/twenty-docs/static/img/user-guide/filter-opportunities-dark.png
new file mode 100644
index 0000000000..79b9b33603
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/filter-opportunities-dark.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/filter-opportunities-light.png b/packages/twenty-docs/static/img/user-guide/filter-opportunities-light.png
new file mode 100644
index 0000000000..b59aa623e2
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/filter-opportunities-light.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/manage-custom-object.png b/packages/twenty-docs/static/img/user-guide/manage-custom-object.png
index bd3094257c..142ba9cfbf 100644
Binary files a/packages/twenty-docs/static/img/user-guide/manage-custom-object.png and b/packages/twenty-docs/static/img/user-guide/manage-custom-object.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/view-all-objects-dark.png b/packages/twenty-docs/static/img/user-guide/view-all-objects-dark.png
new file mode 100644
index 0000000000..b8d1345d99
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/view-all-objects-dark.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/view-all-objects-light.png b/packages/twenty-docs/static/img/user-guide/view-all-objects-light.png
new file mode 100644
index 0000000000..9a6b5e38e2
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/view-all-objects-light.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/view-all-objects.png b/packages/twenty-docs/static/img/user-guide/view-all-objects.png
deleted file mode 100644
index 040278c15e..0000000000
Binary files a/packages/twenty-docs/static/img/user-guide/view-all-objects.png and /dev/null differ
diff --git a/packages/twenty-docs/static/img/user-guide/view-favorite-records-dark.png b/packages/twenty-docs/static/img/user-guide/view-favorite-records-dark.png
new file mode 100644
index 0000000000..891fef1187
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/view-favorite-records-dark.png differ
diff --git a/packages/twenty-docs/static/img/user-guide/view-favorite-records-light.png b/packages/twenty-docs/static/img/user-guide/view-favorite-records-light.png
new file mode 100644
index 0000000000..7bdd630f25
Binary files /dev/null and b/packages/twenty-docs/static/img/user-guide/view-favorite-records-light.png differ
diff --git a/packages/twenty-docs/static/img/visualise-customer-dark.png b/packages/twenty-docs/static/img/visualise-customer-dark.png
index bc8e6e0f17..f27511ec83 100644
Binary files a/packages/twenty-docs/static/img/visualise-customer-dark.png and b/packages/twenty-docs/static/img/visualise-customer-dark.png differ
diff --git a/packages/twenty-docs/static/img/visualise-customer-light.png b/packages/twenty-docs/static/img/visualise-customer-light.png
index abc10a254e..603bb25005 100644
Binary files a/packages/twenty-docs/static/img/visualise-customer-light.png and b/packages/twenty-docs/static/img/visualise-customer-light.png differ