TypeCellOS · matthewlipski · Apr 29, 2026 · Apr 28, 2026 · Apr 28, 2026 · Apr 28, 2026
diff --git a/examples/02-backend/04-rendering-static-documents/src/App.tsx b/examples/02-backend/04-rendering-static-documents/src/App.tsx
@@ -22,17 +22,17 @@ This example has the HTML hard-coded, but shows at least how the document will b
 export default function App() {
   // This HTML is generated by the ServerBlockNoteEditor.blocksToFullHTML method
   const html = `<div class="bn-block-group" data-node-type="blockGroup">
-  <div class="bn-block-outer" data-node-type="blockOuter" data-id="1" data-text-color="yellow" data-background-color="blue">
-      <div class="bn-block" data-node-type="blockContainer" data-id="1" data-text-color="yellow" data-background-color="blue">
-          <div class="bn-block-content" data-content-type="heading" data-text-alignment="right" data-level="2">
+  <div class="bn-block-outer" data-node-type="blockOuter" data-id="1">
+      <div class="bn-block" data-node-type="blockContainer" data-id="1">
+          <div class="bn-block-content" data-content-type="heading" data-background-color="blue" data-text-color="yellow" data-text-alignment="right" data-level="2">
               <h2 class="bn-inline-content">
                   <strong><u>Heading </u></strong><em><s>2</s></em>
               </h2>
           </div>
           <div class="bn-block-group" data-node-type="blockGroup">
-              <div class="bn-block-outer" data-node-type="blockOuter" data-id="2" data-background-color="red">
-                  <div class="bn-block" data-node-type="blockContainer" data-id="2" data-background-color="red">
-                      <div class="bn-block-content" data-content-type="paragraph">
+              <div class="bn-block-outer" data-node-type="blockOuter" data-id="2">
+                  <div class="bn-block" data-node-type="blockContainer" data-id="2">
+                      <div class="bn-block-content" data-content-type="paragraph" data-background-color="red">
                           <p class="bn-inline-content">Paragraph</p>
                       </div>
                   </div>

diff --git a/packages/core/src/editor/Block.css b/packages/core/src/editor/Block.css
@@ -561,110 +561,92 @@ NESTED BLOCKS
 
 /* TEXT COLORS */
 [data-style-type="textColor"][data-value="gray"],
-[data-text-color="gray"],
 .bn-block:has(> .bn-block-content[data-text-color="gray"]) {
   color: #9b9a97;
 }
 
 [data-style-type="textColor"][data-value="brown"],
-[data-text-color="brown"],
 .bn-block:has(> .bn-block-content[data-text-color="brown"]) {
   color: #64473a;
 }
 
 [data-style-type="textColor"][data-value="red"],
-[data-text-color="red"],
 .bn-block:has(> .bn-block-content[data-text-color="red"]) {
   color: #e03e3e;
 }
 
 [data-style-type="textColor"][data-value="orange"],
-[data-text-color="orange"],
 .bn-block:has(> .bn-block-content[data-text-color="orange"]) {
   color: #d9730d;
 }
 
 [data-style-type="textColor"][data-value="yellow"],
-[data-text-color="yellow"],
 .bn-block:has(> .bn-block-content[data-text-color="yellow"]) {
   color: #dfab01;
 }
 
 [data-style-type="textColor"][data-value="green"],
-[data-text-color="green"],
 .bn-block:has(> .bn-block-content[data-text-color="green"]) {
   color: #4d6461;
 }
 
 [data-style-type="textColor"][data-value="blue"],
-[data-text-color="blue"],
 .bn-block:has(> .bn-block-content[data-text-color="blue"]) {
   color: #0b6e99;
 }
 
 [data-style-type="textColor"][data-value="purple"],
-[data-text-color="purple"],
 .bn-block:has(> .bn-block-content[data-text-color="purple"]) {
   color: #6940a5;
 }
 
 [data-style-type="textColor"][data-value="pink"],
-[data-text-color="pink"],
 .bn-block:has(> .bn-block-content[data-text-color="pink"]) {
   color: #ad1a72;
 }
 
 /* BACKGROUND COLORS */
 [data-style-type="backgroundColor"][data-value="gray"],
-[data-background-color="gray"],
 .bn-block:has(> .bn-block-content[data-background-color="gray"]) {
   background-color: #ebeced;
 }
 
 [data-style-type="backgroundColor"][data-value="brown"],
-[data-background-color="brown"],
 .bn-block:has(> .bn-block-content[data-background-color="brown"]) {
   background-color: #e9e5e3;
 }
 
 [data-style-type="backgroundColor"][data-value="red"],
-[data-background-color="red"],
 .bn-block:has(> .bn-block-content[data-background-color="red"]) {
   background-color: #fbe4e4;
 }
 
 [data-style-type="backgroundColor"][data-value="orange"],
-[data-background-color="orange"],
 .bn-block:has(> .bn-block-content[data-background-color="orange"]) {
   background-color: #f6e9d9;
 }
 
 [data-style-type="backgroundColor"][data-value="yellow"],
-[data-background-color="yellow"],
 .bn-block:has(> .bn-block-content[data-background-color="yellow"]) {
   background-color: #fbf3db;
 }
 
 [data-style-type="backgroundColor"][data-value="green"],
-[data-background-color="green"],
 .bn-block:has(> .bn-block-content[data-background-color="green"]) {
   background-color: #ddedea;
 }
 
 [data-style-type="backgroundColor"][data-value="blue"],
-[data-background-color="blue"],
 .bn-block:has(> .bn-block-content[data-background-color="blue"]) {
   background-color: #ddebf1;
 }
 
 [data-style-type="backgroundColor"][data-value="purple"],
-[data-background-color="purple"],
 .bn-block:has(> .bn-block-content[data-background-color="purple"]) {
   background-color: #eae4f2;
 }
 
 [data-style-type="backgroundColor"][data-value="pink"],
-[data-background-color="pink"],
 .bn-block:has(> .bn-block-content[data-background-color="pink"]) {
   background-color: #f4dfeb;
 }

diff --git a/packages/core/src/i18n/locales/ar.ts b/packages/core/src/i18n/locales/ar.ts
@@ -214,7 +214,7 @@ export const ar: Dictionary = {
     text_title: "نص",
     background_title: "خلفية",
     colors: {
-      default: "افتراضي",
+      default: "تلقائي",
       gray: "رمادي",
       brown: "بني",
       red: "أحمر",

diff --git a/packages/core/src/i18n/locales/de.ts b/packages/core/src/i18n/locales/de.ts
@@ -249,7 +249,7 @@ export const de: Dictionary = {
     text_title: "Text",
     background_title: "Hintergrund",
     colors: {
-      default: "Standard",
+      default: "Automatisch",
       gray: "Grau",
       brown: "Braun",
       red: "Rot",

diff --git a/packages/core/src/i18n/locales/en.ts b/packages/core/src/i18n/locales/en.ts
@@ -229,7 +229,7 @@ export const en = {
     text_title: "Text",
     background_title: "Background",
     colors: {
-      default: "Default",
+      default: "Auto",
       gray: "Gray",
       brown: "Brown",
       red: "Red",

diff --git a/packages/core/src/i18n/locales/es.ts b/packages/core/src/i18n/locales/es.ts
@@ -228,7 +228,7 @@ export const es: Dictionary = {
     text_title: "Texto",
     background_title: "Fondo",
     colors: {
-      default: "Por defecto",
+      default: "Automático",
       gray: "Gris",
       brown: "Marrón",
       red: "Rojo",

diff --git a/packages/core/src/i18n/locales/fa.ts b/packages/core/src/i18n/locales/fa.ts
@@ -197,7 +197,7 @@ export const fa = {
     text_title: "متن",
     background_title: "پس‌زمینه",
     colors: {
-      default: "پیش‌فرض",
+      default: "خودکار",
       gray: "خاکستری",
       brown: "قهوه‌ای",
       red: "قرمز",

diff --git a/packages/core/src/i18n/locales/fr.ts b/packages/core/src/i18n/locales/fr.ts
@@ -275,7 +275,7 @@ export const fr: Dictionary = {
     text_title: "Texte",
     background_title: "Fond",
     colors: {
-      default: "Défaut",
+      default: "Auto",
       gray: "Gris",
       brown: "Marron",
       red: "Rouge",

diff --git a/packages/core/src/i18n/locales/he.ts b/packages/core/src/i18n/locales/he.ts
@@ -230,7 +230,7 @@ export const he: Dictionary = {
     text_title: "טקסט",
     background_title: "רקע",
     colors: {
-      default: "ברירת מחדל",
+      default: "אוטומטי",
       gray: "אפור",
       brown: "חום",
       red: "אדום",

diff --git a/packages/core/src/i18n/locales/hr.ts b/packages/core/src/i18n/locales/hr.ts
@@ -242,7 +242,7 @@ export const hr: Dictionary = {
     text_title: "Tekst",
     background_title: "Pozadina",
     colors: {
-      default: "Zadano",
+      default: "Automatski",
       gray: "Siva",
       brown: "Smeđa",
       red: "Crvena",

diff --git a/packages/core/src/i18n/locales/is.ts b/packages/core/src/i18n/locales/is.ts
@@ -242,7 +242,7 @@ export const is: Dictionary = {
     text_title: "Texti",
     background_title: "Bakgrunnur",
     colors: {
-      default: "Sjálfgefið",
+      default: "Sjálfvirkt",
       gray: "Grár",
       brown: "Brúnn",
       red: "Rauður",

diff --git a/packages/core/src/i18n/locales/it.ts b/packages/core/src/i18n/locales/it.ts
@@ -251,7 +251,7 @@ export const it: Dictionary = {
     text_title: "Testo",
     background_title: "Sfondo",
     colors: {
-      default: "Predefinito",
+      default: "Automatico",
       gray: "Grigio",
       brown: "Marrone",
       red: "Rosso",

diff --git a/packages/core/src/i18n/locales/ja.ts b/packages/core/src/i18n/locales/ja.ts
@@ -269,7 +269,7 @@ export const ja: Dictionary = {
     text_title: "文字色",
     background_title: "背景色",
     colors: {
-      default: "デフォルト",
+      default: "自動",
       gray: "グレー",
       brown: "茶色",
       red: "赤",

diff --git a/packages/core/src/i18n/locales/ko.ts b/packages/core/src/i18n/locales/ko.ts
@@ -242,7 +242,7 @@ export const ko: Dictionary = {
     text_title: "텍스트",
     background_title: "배경",
     colors: {
-      default: "기본",
+      default: "자동",
       gray: "회색",
       brown: "갈색",
       red: "빨간색",

diff --git a/packages/core/src/i18n/locales/nl.ts b/packages/core/src/i18n/locales/nl.ts
@@ -230,7 +230,7 @@ export const nl: Dictionary = {
     text_title: "Tekst",
     background_title: "Achtergrond",
     colors: {
-      default: "Standaard",
+      default: "Automatisch",
       gray: "Grijs",
       brown: "Bruin",
       red: "Rood",

diff --git a/packages/core/src/i18n/locales/no.ts b/packages/core/src/i18n/locales/no.ts
@@ -247,7 +247,7 @@ export const no: Dictionary = {
     text_title: "Tekst",
     background_title: "Bakgrunn",
     colors: {
-      default: "Standard",
+      default: "Automatisk",
       gray: "Grå",
       brown: "Brun",
       red: "Rød",

diff --git a/packages/core/src/i18n/locales/pl.ts b/packages/core/src/i18n/locales/pl.ts
@@ -220,7 +220,7 @@ export const pl: Dictionary = {
     text_title: "Tekst",
     background_title: "Tło",
     colors: {
-      default: "Domyślny",
+      default: "Automatyczny",
       gray: "Szary",
       brown: "Brązowy",
       red: "Czerwony",

diff --git a/packages/core/src/i18n/locales/pt.ts b/packages/core/src/i18n/locales/pt.ts
@@ -221,7 +221,7 @@ export const pt: Dictionary = {
     text_title: "Texto",
     background_title: "Fundo",
     colors: {
-      default: "Padrão",
+      default: "Automático",
       gray: "Cinza",
       brown: "Marrom",
       red: "Vermelho",

diff --git a/packages/core/src/i18n/locales/ru.ts b/packages/core/src/i18n/locales/ru.ts
@@ -272,7 +272,7 @@ export const ru: Dictionary = {
     text_title: "Текст",
     background_title: "Задний фон",
     colors: {
-      default: "По умолчанию",
+      default: "Авто",
       gray: "Серый",
       brown: "Коричневый",
       red: "Красный",

diff --git a/packages/core/src/i18n/locales/sk.ts b/packages/core/src/i18n/locales/sk.ts
@@ -228,7 +228,7 @@ export const sk = {
     text_title: "Text",
     background_title: "Pozadie",
     colors: {
-      default: "Predvolená",
+      default: "Automaticky",
       gray: "Sivá",
       brown: "Hnedá",
       red: "Červená",

diff --git a/packages/core/src/i18n/locales/uk.ts b/packages/core/src/i18n/locales/uk.ts
@@ -254,7 +254,7 @@ export const uk: Dictionary = {
     text_title: "Текст",
     background_title: "Фон",
     colors: {
-      default: "За замовчуванням",
+      default: "Авто",
       gray: "Сірий",
       brown: "Коричневий",
       red: "Червоний",

diff --git a/packages/core/src/i18n/locales/uz.ts b/packages/core/src/i18n/locales/uz.ts
@@ -294,7 +294,7 @@ export const uz: Dictionary = {
     text_title: "Matn",
     background_title: "Fon",
     colors: {
-      default: "Standart",
+      default: "Avtomatik",
       gray: "Kulrang",
       brown: "Jigarrang",
       red: "Qizil",

diff --git a/packages/core/src/i18n/locales/vi.ts b/packages/core/src/i18n/locales/vi.ts
@@ -228,7 +228,7 @@ export const vi: Dictionary = {
     text_title: "Văn bản",
     background_title: "Nền",
     colors: {
-      default: "Mặc định",
+      default: "Tự động",
       gray: "Xám",
       brown: "Nâu",
       red: "Đỏ",

diff --git a/packages/core/src/i18n/locales/zh-tw.ts b/packages/core/src/i18n/locales/zh-tw.ts
@@ -270,7 +270,7 @@ export const zhTW: Dictionary = {
     text_title: "文字",
     background_title: "背景色",
     colors: {
-      default: "預設",
+      default: "自動",
       gray: "灰色",
       brown: "棕色",
       red: "紅色",

diff --git a/packages/core/src/i18n/locales/zh.ts b/packages/core/src/i18n/locales/zh.ts
@@ -270,7 +270,7 @@ export const zh: Dictionary = {
     text_title: "文本",
     background_title: "背景色",
     colors: {
-      default: "默认",
+      default: "自动",
       gray: "灰色",
       brown: "棕色",
       red: "红色",