diff --git a/app/client/src/components/designSystems/appsmith/PositionedContainer.tsx b/app/client/src/components/designSystems/appsmith/PositionedContainer.tsx
index 88eb60ead9..b53f25304d 100644
--- a/app/client/src/components/designSystems/appsmith/PositionedContainer.tsx
+++ b/app/client/src/components/designSystems/appsmith/PositionedContainer.tsx
@@ -23,7 +23,6 @@ export const PositionedContainer = (props: PositionedContainerProps) => {
           ? theme.spaces[9]
           : props.style.yPosition + (props.style.yPositionUnit || "px"),
         padding: props.isMainContainer ? 0 : WIDGET_PADDING + "px",
-        background: "white",
       }}
     >
       {props.children}
diff --git a/app/client/src/components/designSystems/appsmith/WidgetNameComponent.tsx b/app/client/src/components/designSystems/appsmith/WidgetNameComponent.tsx
index 11ba87635f..2a98b49fbf 100644
--- a/app/client/src/components/designSystems/appsmith/WidgetNameComponent.tsx
+++ b/app/client/src/components/designSystems/appsmith/WidgetNameComponent.tsx
@@ -5,9 +5,9 @@ import { AppState } from "reducers";
 
 const PositionStyle = styled.div<{ selected?: boolean }>`
   position: absolute;
-  top: -${props => props.theme.spaces[10]}px;
-  left: ${props => props.theme.spaces[6] * 2}px;
-  font-size: ${props => props.theme.fontSizes[3]}px;
+  top: -${props => props.theme.spaces[7]}px;
+  left: ${props => props.theme.spaces[6]}px;
+  font-size: ${props => props.theme.fontSizes[2]}px;
   font-weight: ${props => props.theme.fontWeights[2]};
   text-align: left;
   width: 100%;
@@ -15,7 +15,7 @@ const PositionStyle = styled.div<{ selected?: boolean }>`
   display: inline-block;
   & pre {
     display: inline;
-    padding: 5px;
+    padding: 3px;
     background: ${props =>
       props.selected
         ? props.theme.colors.widgetBorder
diff --git a/app/client/src/components/designSystems/blueprint/CheckboxComponent.tsx b/app/client/src/components/designSystems/blueprint/CheckboxComponent.tsx
index d76999f044..95226c8779 100644
--- a/app/client/src/components/designSystems/blueprint/CheckboxComponent.tsx
+++ b/app/client/src/components/designSystems/blueprint/CheckboxComponent.tsx
@@ -24,7 +24,7 @@ class CheckboxComponent extends React.Component<CheckboxComponentProps> {
           className={
             this.props.isLoading ? "bp3-skeleton" : Classes.RUNNING_TEXT
           }
-          defaultIndeterminate={this.props.defaultCheckedState}
+          defaultChecked={this.props.defaultCheckedState}
           onChange={this.onCheckChange}
           disabled={this.props.isDisabled}
         />
diff --git a/app/client/src/components/designSystems/blueprint/DatePickerComponent.tsx b/app/client/src/components/designSystems/blueprint/DatePickerComponent.tsx
index 3a39ee844d..a9d0b683e5 100644
--- a/app/client/src/components/designSystems/blueprint/DatePickerComponent.tsx
+++ b/app/client/src/components/designSystems/blueprint/DatePickerComponent.tsx
@@ -1,5 +1,6 @@
 import React from "react";
 import styled from "styled-components";
+import { labelStyle } from "constants/DefaultTheme";
 import { ControlGroup, Classes, Label } from "@blueprintjs/core";
 import { ComponentProps } from "components/designSystems/appsmith/BaseComponent";
 import { DateInput, DateRangeInput } from "@blueprintjs/datetime";
@@ -11,9 +12,10 @@ import { WIDGET_PADDING } from "constants/WidgetConstants";
 const StyledControlGroup = styled(ControlGroup)`
   &&& {
     label {
+      ${labelStyle}
       flex: 0 1 30%;
       text-align: right;
-      margin: 0 ${WIDGET_PADDING}px 0 0;
+      margin: 0 ${WIDGET_PADDING * 2}px 0 0;
       align-self: center;
     }
   }
diff --git a/app/client/src/components/designSystems/blueprint/DropdownComponent.tsx b/app/client/src/components/designSystems/blueprint/DropdownComponent.tsx
index 8151e95f87..6a007fb2ec 100644
--- a/app/client/src/components/designSystems/blueprint/DropdownComponent.tsx
+++ b/app/client/src/components/designSystems/blueprint/DropdownComponent.tsx
@@ -12,7 +12,7 @@ import { Select, MultiSelect, IItemRendererProps } from "@blueprintjs/select";
 import _ from "lodash";
 import { WIDGET_PADDING } from "constants/WidgetConstants";
 import "../../../../node_modules/@blueprintjs/select/lib/css/blueprint-select.css";
-import styled from "constants/DefaultTheme";
+import styled, { labelStyle } from "constants/DefaultTheme";
 
 const SingleDropDown = Select.ofType<DropdownOption>();
 const MultiDropDown = MultiSelect.ofType<DropdownOption>();
@@ -43,7 +43,8 @@ const StyledSingleDropDown = styled(SingleDropDown)`
 const StyledControlGroup = styled(ControlGroup)`
   &&& {
     label {
-      margin: 0 ${WIDGET_PADDING}px 0 0;
+      ${labelStyle}
+      margin: 0 ${WIDGET_PADDING * 2}px 0 0;
       align-self: center;
       flex: 0 1 30%;
       text-align: right;
diff --git a/app/client/src/components/designSystems/blueprint/InputComponent.tsx b/app/client/src/components/designSystems/blueprint/InputComponent.tsx
index efc38e4804..5eeb0efd15 100644
--- a/app/client/src/components/designSystems/blueprint/InputComponent.tsx
+++ b/app/client/src/components/designSystems/blueprint/InputComponent.tsx
@@ -1,6 +1,6 @@
 import React from "react";
 import styled from "styled-components";
-import { getBorderCSSShorthand } from "constants/DefaultTheme";
+import { getBorderCSSShorthand, labelStyle } from "constants/DefaultTheme";
 import { ComponentProps } from "components/designSystems/appsmith/BaseComponent";
 import {
   Intent,
@@ -42,8 +42,9 @@ const InputComponentWrapper = styled(ControlGroup)`
     }
     align-items: center;
     label {
+      ${labelStyle}
       flex: 0 1 30%;
-      margin: 0 ${WIDGET_PADDING}px 0 0;
+      margin: 0 ${WIDGET_PADDING * 2}px 0 0;
       text-align: right;
     }
   }
diff --git a/app/client/src/components/designSystems/blueprint/RadioGroupComponent.tsx b/app/client/src/components/designSystems/blueprint/RadioGroupComponent.tsx
index 5f67a50052..28cdbfcf66 100644
--- a/app/client/src/components/designSystems/blueprint/RadioGroupComponent.tsx
+++ b/app/client/src/components/designSystems/blueprint/RadioGroupComponent.tsx
@@ -10,13 +10,16 @@ import {
   Classes,
 } from "@blueprintjs/core";
 import { WIDGET_PADDING } from "constants/WidgetConstants";
+import { labelStyle } from "constants/DefaultTheme";
+
 const StyledControlGroup = styled(ControlGroup)`
   &&& {
     & > label {
+      ${labelStyle}
       flex: 0 1 30%;
       align-self: flex-start;
       text-align: right;
-      margin: 0 ${WIDGET_PADDING}px 0 0;
+      margin: 0 ${WIDGET_PADDING * 2}px 0 0;
     }
   }
 `;
diff --git a/app/client/src/components/designSystems/blueprint/TextComponent.tsx b/app/client/src/components/designSystems/blueprint/TextComponent.tsx
index 2ca62ea93c..713e0ad3ef 100644
--- a/app/client/src/components/designSystems/blueprint/TextComponent.tsx
+++ b/app/client/src/components/designSystems/blueprint/TextComponent.tsx
@@ -5,7 +5,7 @@ import { ComponentProps } from "components/designSystems/appsmith/BaseComponent"
 import { TextStyle } from "widgets/TextWidget";
 import Interweave from "interweave";
 import { UrlMatcher, EmailMatcher } from "interweave-autolink";
-
+import { labelStyle } from "constants/DefaultTheme";
 type TextStyleProps = {
   accent: "primary" | "secondary" | "error";
 };
@@ -22,21 +22,24 @@ export const BaseText = styled(Text)<TextStyleProps>``;
 
 export const TextContainer = styled.div`
   && {
-    text-overflow: hidden;
     height: 100%;
     width: 100%;
   }
 `;
-export const StyledText = styled(Text)`
+export const StyledText = styled(Text)<{ scroll: boolean }>`
   height: 100%;
-  overflow: hidden;
+  overflow-y: ${props => (props.scroll ? "auto" : "hidden")};
   text-overflow: ellipsis;
   display: flex;
   width: 100%;
   justify-content: flex-start;
   align-items: center;
-
-  span {
+  &.bp3-heading {
+    font-weight: ${props => props.theme.fontWeights[3]};
+    font-size: ${props => props.theme.fontSizes[4]}px;
+  }
+  &.bp3-ui-text {
+    ${labelStyle}
   }
 `;
 
@@ -45,6 +48,7 @@ export interface TextComponentProps extends ComponentProps {
   ellipsize?: boolean;
   textStyle?: TextStyle;
   isLoading: boolean;
+  shouldScroll?: boolean;
 }
 
 class TextComponent extends React.Component<TextComponentProps> {
@@ -56,12 +60,13 @@ class TextComponent extends React.Component<TextComponentProps> {
     }
     switch (textStyle) {
       case "HEADING":
-        className.push(Classes.TEXT_LARGE);
+        className.push(Classes.HEADING);
         break;
       case "BODY":
         className.push(Classes.RUNNING_TEXT);
         break;
       case "LABEL":
+        className.push(Classes.UI_TEXT);
         break;
       default:
         break;
@@ -75,6 +80,7 @@ class TextComponent extends React.Component<TextComponentProps> {
     return (
       <TextContainer>
         <StyledText
+          scroll={!!this.props.shouldScroll}
           className={this.getTextClass(textStyle)}
           ellipsize={ellipsize}
         >
diff --git a/app/client/src/components/editorComponents/Button.tsx b/app/client/src/components/editorComponents/Button.tsx
index 5a37b5eea2..d10cf55d4d 100644
--- a/app/client/src/components/editorComponents/Button.tsx
+++ b/app/client/src/components/editorComponents/Button.tsx
@@ -25,7 +25,7 @@ const buttonStyles = css<{
   &&&& {
     padding: ${props =>
       props.filled || props.outline
-        ? props.theme.spaces[3] + "px " + props.theme.spaces[3] + "px"
+        ? props.theme.spaces[2] + "px " + props.theme.spaces[3] + "px"
         : 0};
     background: ${props =>
       props.filled || props.outline ? "auto" : "transparent"};
@@ -59,7 +59,7 @@ export type ButtonProps = {
   iconAlignment?: Direction;
   loading?: boolean;
   disabled?: boolean;
-  large?: boolean;
+  size?: "large" | "small";
 };
 
 export const Button = (props: ButtonProps) => {
@@ -80,7 +80,8 @@ export const Button = (props: ButtonProps) => {
     outline: props.outline ? props.outline.toString() : undefined,
     filled: props.filled ? props.filled.toString() : undefined,
     intent: props.intent as BlueprintIntent,
-    large: props.large === undefined ? true : props.large,
+    large: props.size === "large",
+    small: props.size === "small",
     loading: props.loading,
     disabled: props.disabled,
   };
diff --git a/app/client/src/components/editorComponents/DraggableComponent.tsx b/app/client/src/components/editorComponents/DraggableComponent.tsx
index 2d89963ff9..aa7b69e431 100644
--- a/app/client/src/components/editorComponents/DraggableComponent.tsx
+++ b/app/client/src/components/editorComponents/DraggableComponent.tsx
@@ -247,11 +247,11 @@ const DraggableComponent = (props: DraggableComponentProps) => {
 
         {props.children}
 
-        <DragHandle className="control" ref={drag}>
+        {/* <DragHandle className="control" ref={drag}>
           <Tooltip content="Move" hoverOpenDelay={500}>
             {moveControlIcon}
           </Tooltip>
-        </DragHandle>
+        </DragHandle> */}
         <DeleteControl className="control" onClick={deleteWidget}>
           <Tooltip content="Delete" hoverOpenDelay={500}>
             {deleteControlIcon}
diff --git a/app/client/src/components/editorComponents/DropTargetComponent.tsx b/app/client/src/components/editorComponents/DropTargetComponent.tsx
index a0e7487e8c..8e2cf7fef6 100644
--- a/app/client/src/components/editorComponents/DropTargetComponent.tsx
+++ b/app/client/src/components/editorComponents/DropTargetComponent.tsx
@@ -260,6 +260,7 @@ export const DropTargetComponent = (props: DropTargetComponentProps) => {
           marginBottom,
           userSelect: "none",
           opacity: 0.99,
+          background: "none",
         }}
       >
         {props.children}
diff --git a/app/client/src/components/editorComponents/ResizableContainer.tsx b/app/client/src/components/editorComponents/ResizableContainer.tsx
index 85496d4dc0..cb28b27edc 100644
--- a/app/client/src/components/editorComponents/ResizableContainer.tsx
+++ b/app/client/src/components/editorComponents/ResizableContainer.tsx
@@ -29,13 +29,13 @@ const borderCSS = css<ResizeBorderDotDivProps>`
 export const ResizeBorderDotDiv = styled.div<ResizeBorderDotDivProps>`
   ${borderCSS}
   &:after {
-    left: -${props => props.theme.spaces[5]}px;
+    left: -${props => props.theme.spaces[2]}px;
     top: calc(50% - ${props => props.theme.spaces[1]}px);
     z-index: 0;
   }
   &:before {
     left: calc(50% - ${props => props.theme.spaces[1]}px);
-    top: -${props => props.theme.spaces[5]}px;
+    top: -${props => props.theme.spaces[2]}px;
     z-index: 1;
   }
 `;
diff --git a/app/client/src/components/propertyControls/OptionControl.tsx b/app/client/src/components/propertyControls/OptionControl.tsx
index 5f221b4db3..c6a0cc128b 100644
--- a/app/client/src/components/propertyControls/OptionControl.tsx
+++ b/app/client/src/components/propertyControls/OptionControl.tsx
@@ -15,7 +15,7 @@ import { AnyStyledComponent } from "styled-components";
 const StyledDeleteIcon = styled(FormIcons.DELETE_ICON as AnyStyledComponent)`
   padding: 5px 5px;
   position: absolute;
-  right: -13px;
+  right: -4px;
   cursor: pointer;
 `;
 
diff --git a/app/client/src/constants/DefaultTheme.tsx b/app/client/src/constants/DefaultTheme.tsx
index 6ec1cc5558..4add12998b 100644
--- a/app/client/src/constants/DefaultTheme.tsx
+++ b/app/client/src/constants/DefaultTheme.tsx
@@ -62,12 +62,15 @@ export const BlueprintButtonIntentsCSS = css`
     border-width: 1px;
     border-style: solid;
     outline: none;
-    min-width: 100px;
+    min-width: 50px;
     color: ${IntentColors.secondary};
     border-color: ${IntentColors.none};
     & span.bp3-icon {
       color: ${IntentColors.none};
     }
+    & span {
+      font-weight: ${props => props.theme.fontWeights[3]};
+    }
     background: ${Colors.WHITE};
   }
   &&&.bp3-button.bp3-intent-primary:not(.bp3-minimal) {
@@ -195,13 +198,17 @@ export const getBorderCSSShorthand = (border?: ThemeBorder): string => {
   return values.join(" ");
 };
 
+export const labelStyle = css`
+  font-weight: ${props => props.theme.fontWeights[3]};
+`;
+
 export const theme: Theme = {
   radii: [0, 4, 8, 10, 20, 50],
   fontSizes: [0, 10, 12, 14, 16, 18, 24, 28, 32, 48, 64],
   spaces: [0, 4, 6, 8, 10, 12, 14, 16, 18, 20, 22, 24, 30, 36],
   fontWeights: [0, 400, 500, 700],
   propertyPane: {
-    width: 250,
+    width: 270,
     height: 600,
     dividerColor: Colors.MAKO,
   },
diff --git a/app/client/src/constants/WidgetConstants.tsx b/app/client/src/constants/WidgetConstants.tsx
index 881a230af4..5b964cbc12 100644
--- a/app/client/src/constants/WidgetConstants.tsx
+++ b/app/client/src/constants/WidgetConstants.tsx
@@ -77,13 +77,13 @@ export const GridDefaults = {
   DEFAULT_WIDGET_WIDTH: 200,
   DEFAULT_WIDGET_HEIGHT: 100,
   DEFAULT_GRID_COLUMNS: 16,
-  DEFAULT_GRID_ROW_HEIGHT: 50,
+  DEFAULT_GRID_ROW_HEIGHT: 38,
 };
 
 export const CONTAINER_GRID_PADDING =
-  (GridDefaults.DEFAULT_GRID_ROW_HEIGHT / 2) * 0.6;
+  (GridDefaults.DEFAULT_GRID_ROW_HEIGHT / 2) * 0.8;
 
-export const WIDGET_PADDING = (GridDefaults.DEFAULT_GRID_ROW_HEIGHT / 2) * 0.4;
+export const WIDGET_PADDING = (GridDefaults.DEFAULT_GRID_ROW_HEIGHT / 2) * 0.2;
 
 export const WIDGET_CLASSNAME_PREFIX = "WIDGET_";
 export const MAIN_CONTAINER_WIDGET_ID = "0";
diff --git a/app/client/src/index.css b/app/client/src/index.css
index ef28b7fe25..a3e248351e 100755
--- a/app/client/src/index.css
+++ b/app/client/src/index.css
@@ -52,6 +52,14 @@ div.bp3-popover-arrow {
   cursor: default !important;
 }
 
+.bp3-intent-primary, input:checked ~ span.bp3-control-indicator {
+  background: #29CCA3 !important;
+  box-shadow: none !important;
+}
+.bp3-intent-primary {
+  border-radius: 4px !important;
+}
+
 .pace {
   -webkit-pointer-events: none;
   pointer-events: none;
diff --git a/app/client/src/mockResponses/WidgetConfigResponse.tsx b/app/client/src/mockResponses/WidgetConfigResponse.tsx
index 170fe412b2..1cafbb54fc 100644
--- a/app/client/src/mockResponses/WidgetConfigResponse.tsx
+++ b/app/client/src/mockResponses/WidgetConfigResponse.tsx
@@ -128,7 +128,7 @@ const WidgetConfigResponse: WidgetConfigReducerState = {
     RADIO_GROUP_WIDGET: {
       rows: 2,
       columns: 5,
-      label: "Labels",
+      label: "Label",
       options: [
         { id: "1", label: "Alpha", value: "1" },
         { id: "2", label: "Bravo", value: "2" },
diff --git a/app/client/src/pages/Applications/ApplicationCard.tsx b/app/client/src/pages/Applications/ApplicationCard.tsx
index eeac087ee1..bd5a588b9e 100644
--- a/app/client/src/pages/Applications/ApplicationCard.tsx
+++ b/app/client/src/pages/Applications/ApplicationCard.tsx
@@ -95,14 +95,21 @@ const ApplicationTitle = styled.div`
 `;
 
 const ApplicationImage = styled.div`
-  height: 100%;
-  width: 100%;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  & {
-    .control {
-      display: none;
+  && {
+    height: 100%;
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    & {
+      .control {
+        display: none;
+        button {
+          span {
+            font-weight: ${props => props.theme.fontWeights[3]};
+          }
+        }
+      }
     }
   }
 `;
@@ -183,7 +190,7 @@ export const ApplicationCard = (props: ApplicationCardProps) => {
         <span>{props.application.name}</span>
         <Link to={viewApplicationURL}>
           <Control className="control">
-            <Tooltip content="View Application" hoverOpenDelay={500}>
+            <Tooltip content="Launch App" hoverOpenDelay={500}>
               {viewControlIcon}
             </Tooltip>
           </Control>
@@ -207,6 +214,7 @@ export const ApplicationCard = (props: ApplicationCardProps) => {
               intent="primary"
               icon="edit"
               iconAlignment="left"
+              size="small"
             />
           </Control>
         </ApplicationImage>
diff --git a/app/client/src/pages/Editor/EditorHeader.tsx b/app/client/src/pages/Editor/EditorHeader.tsx
index 575dfe8861..21f53b0f10 100644
--- a/app/client/src/pages/Editor/EditorHeader.tsx
+++ b/app/client/src/pages/Editor/EditorHeader.tsx
@@ -129,7 +129,7 @@ export const EditorHeader = (props: EditorHeaderProps) => {
       <StretchedBreadCrumb items={navigation} />
       <CustomizedDropdown {...pageSelectorData} />
       <LoadingContainer>
-        {props.isSaving ? "Saving..." : "All changed Saved"}
+        {props.isSaving ? "Saving..." : "All changes saved"}
       </LoadingContainer>
       <PreviewPublishSection>
         <Tooltip
@@ -147,7 +147,7 @@ export const EditorHeader = (props: EditorHeaderProps) => {
             loading={props.isPublishing}
             intent="primary"
             filled
-            large={false}
+            size="small"
           />
         </Tooltip>
       </PreviewPublishSection>
diff --git a/app/client/src/pages/Editor/Popper.tsx b/app/client/src/pages/Editor/Popper.tsx
index 2ab58b080e..db662e3d3d 100644
--- a/app/client/src/pages/Editor/Popper.tsx
+++ b/app/client/src/pages/Editor/Popper.tsx
@@ -21,6 +21,7 @@ const PopperWrapper = styled(PaneWrapper)`
     ${props => props.theme.colors.paneBG};
   border-right: 0;
   overflow-y: auto;
+  overflow-x: hidden;
   padding: 0 ${props => props.theme.spaces[5]}px 0 0;
 
   scrollbar-color: ${props => props.theme.colors.paneCard}
diff --git a/app/client/src/pages/Editor/PropertyPane.tsx b/app/client/src/pages/Editor/PropertyPane.tsx
index 152ccc7059..fb53525ddd 100644
--- a/app/client/src/pages/Editor/PropertyPane.tsx
+++ b/app/client/src/pages/Editor/PropertyPane.tsx
@@ -47,6 +47,7 @@ const PropertyPaneTitle = styled.div`
 
 const PropertyPaneWrapper = styled.div`
   position: relative;
+  width: 100%;
 `;
 
 class PropertyPane extends Component<
diff --git a/app/client/src/pages/common/CustomizedDropdown/StyledComponents.tsx b/app/client/src/pages/common/CustomizedDropdown/StyledComponents.tsx
index 3b591e8718..7128883986 100644
--- a/app/client/src/pages/common/CustomizedDropdown/StyledComponents.tsx
+++ b/app/client/src/pages/common/CustomizedDropdown/StyledComponents.tsx
@@ -25,7 +25,7 @@ export const DropdownTrigger = styled.div`
 `;
 export const DropdownContent = styled.div`
   &&& * {
-    font-size: ${props => props.theme.fontSizes[4]}px;
+    font-size: ${props => props.theme.fontSizes[3]}px;
   }
 `;
 
diff --git a/app/client/src/widgets/TextWidget.tsx b/app/client/src/widgets/TextWidget.tsx
index 295564eec6..fb8d878e2d 100644
--- a/app/client/src/widgets/TextWidget.tsx
+++ b/app/client/src/widgets/TextWidget.tsx
@@ -36,6 +36,7 @@ class TextWidget extends BaseWidget<TextWidgetProps, WidgetState> {
         textStyle={this.props.textStyle}
         text={this.props.text}
         isLoading={this.props.isLoading}
+        shouldScroll={this.props.shouldScroll}
         // lines={lines}
       />
     );
@@ -52,6 +53,7 @@ export interface TextWidgetProps extends WidgetProps {
   text?: string;
   textStyle: TextStyle;
   isLoading: boolean;
+  shouldScroll: boolean;
 }
 
 export default TextWidget;