title: Why Notion homepage keeps css style inside HTML div
body: <p>It's commonly agreed that it's a bad practice to keep css style inside div for a large project. One should keep a separate CSS file.</p>
  <p>However, i came across <a href="http://notion.so" rel="nofollow noreferrer">Notion</a> homepage, it's a beautiful website with good performance. Inspecting the webpage, i see a lot of lines like:</p>
  <pre><code>&lt;div class=&quot;notion-app-inner notion-light-theme&quot; style=&quot;
  color: rgb(55, 53, 47); 
  fill: currentcolor; 
  line-height: 1.5; 
  font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, &quot;Apple Color Emoji&quot;, Arial, sans-serif, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;; 
  -webkit-font-smoothing: auto;&quot;&gt; 
  </code></pre>
  <p>My question is why the site keeps the css style inside the div instead of a separate css file? (or it is a result of some react practice?) What's the reason for doing it?</p>
  <p>I understand why it's a good practice in general to keep css in a separate file. I would like to know why Notion use the opposite practice? The engineers behind the site is clearly knows what they are doing.</p>