diff --git a/desktop/flipper-plugin/src/ui/CodeBlock.tsx b/desktop/flipper-plugin/src/ui/CodeBlock.tsx
index c94ae04c1..10725a7ac 100644
--- a/desktop/flipper-plugin/src/ui/CodeBlock.tsx
+++ b/desktop/flipper-plugin/src/ui/CodeBlock.tsx
@@ -28,5 +28,7 @@ const StyledParagrah = styled(Typography.Paragraph)({
   },
   '& pre': {
     margin: 0,
+    border: 'none',
+    background: 'none',
   },
 });
diff --git a/desktop/flipper-plugin/src/ui/Toolbar.tsx b/desktop/flipper-plugin/src/ui/Toolbar.tsx
index 3e8cf195c..90304982c 100644
--- a/desktop/flipper-plugin/src/ui/Toolbar.tsx
+++ b/desktop/flipper-plugin/src/ui/Toolbar.tsx
@@ -12,23 +12,32 @@ import styled from '@emotion/styled';
 import {Layout} from './Layout';
 import {theme} from './theme';
 
-const SandyToolbarContainer = styled(Layout.Horizontal)({
-  flexWrap: 'wrap',
-  padding: theme.space.small,
-  boxShadow: `inset 0px -1px 0px ${theme.dividerColor}`,
-});
+const SandyToolbarContainer = styled(Layout.Horizontal)<{wash?: boolean}>(
+  ({wash}) => ({
+    flexWrap: 'wrap',
+    padding: theme.space.small,
+    boxShadow: `inset 0px -1px 0px ${theme.dividerColor}`,
+    background: wash ? theme.backgroundWash : undefined,
+  }),
+);
 
 export function Toolbar({
   children,
   style,
+  wash,
 }: {
   children?: React.ReactNode;
   position?: 'bottom' | 'top';
   compact?: boolean;
+  wash?: boolean;
   style?: React.CSSProperties;
 }) {
   return (
-    <SandyToolbarContainer style={style} gap={theme.space.small} center>
+    <SandyToolbarContainer
+      style={style}
+      gap={theme.space.small}
+      center
+      wash={wash}>
       {children}
     </SandyToolbarContainer>
   );
diff --git a/desktop/themes/typography.less b/desktop/themes/typography.less
index 80cbf2193..7f3f4fb96 100644
--- a/desktop/themes/typography.less
+++ b/desktop/themes/typography.less
@@ -99,3 +99,7 @@
   // Prevents ANT breaking global styles implicitly used by old Flipper design
   line-height: 1;
 }
+
+.ant-btn {
+  font-weight: normal;
+}
diff --git a/docs/extending/sandy-migration.mdx b/docs/extending/sandy-migration.mdx
index ae6155c58..b55a84fab 100644
--- a/docs/extending/sandy-migration.mdx
+++ b/docs/extending/sandy-migration.mdx
@@ -164,6 +164,8 @@ Since Sandy plugins are expected to support dark mode, (use the settings pane to
 
 Ideally there should be no hard-coded colors anymore either, and little need to use `width: 100%` / `height: 100%` anywhere, as needing those typically signals a layout issue.
 
+Tip: it is recommended to keep components as much as possible outside the entry file, as components defined outside the index.tsx file will benefit from fast refresh.
+
 ### Wrapping up
 
 This step of the process is completed as soon as there are no imports from the `flipper` package anymore. 
diff --git a/docs/tutorial/js-custom.mdx b/docs/tutorial/js-custom.mdx
index 665a57f61..7298a205e 100644
--- a/docs/tutorial/js-custom.mdx
+++ b/docs/tutorial/js-custom.mdx
@@ -260,6 +260,8 @@ Using `useValue` as deep in the component tree as possible will benefit performa
 Finally (`(4)`) we render the data we have. The details have been left out here, as from here it is just idiomatic React code.
 The source of the other `MammalCard` component can be found [here](https://github.com/facebook/flipper/blob/master/desktop/plugins/public/seamammals/src/index.tsx#L113-L165).
 
+Tip: it is recommended to keep components as much as possible outside the entry file, as components defined outside the index.tsx file will benefit from fast refresh.
+
 ### Unit testing the User Interface
 
 At this moment the plugin is ready to be used in Flipper, and opening it should lead to sane results.