diff --git a/src/Toplo-LookAndFeel/ToAbstractTheme.class.st b/src/Toplo-LookAndFeel/ToAbstractTheme.class.st
index d27c2682e..4680a65c8 100644
--- a/src/Toplo-LookAndFeel/ToAbstractTheme.class.st
+++ b/src/Toplo-LookAndFeel/ToAbstractTheme.class.st
@@ -26,8 +26,7 @@ ToAbstractTheme class >> cleanUp: anObject [
 { #category : #current }
 ToAbstractTheme class >> current [
 
-	current ifNil: [ current := ToTheme blue ].
-	^ current
+	^ current ifNil: [ current := ToTheme blue ]
 ]
 
 { #category : #dresser }
@@ -101,12 +100,15 @@ ToAbstractTheme >> installOnSpace: aSpace [
 
 	aSpace ifNil:[ ^ self ].
 
+	"Tag installation complete"
+	aSpace root userData at: #isToThemeInstalled put: true.
+	Toplo useLookAndFeel ifFalse: [ ^ self ].
+	
 	"Update root background color depending theme"
 	self flag:'labordep : this code should not be here but in a dresser dedicated to root element (to be coherent with dresser pattern)'.
 	aSpace root background: self backgroundColor.
 	
-	"Tag installation complete"
-	aSpace root userData at: #isToThemeInstalled put: true
+
 ]
 
 { #category : #colors }
diff --git a/src/Toplo-LookAndFeel/ToDashedButtonSkin.class.st b/src/Toplo-LookAndFeel/ToDashedButtonSkin.class.st
index 1a648eb0e..b1bbeb250 100644
--- a/src/Toplo-LookAndFeel/ToDashedButtonSkin.class.st
+++ b/src/Toplo-LookAndFeel/ToDashedButtonSkin.class.st
@@ -36,7 +36,7 @@ ToDashedButtonSkin >> builtBorderBuilder [
 
 	| builder |
 	builder := super builtBorderBuilder.
-	builder dashArray: self theme dashed.
+	builder dashArray: self theme dashArray.
 	^ builder
 ]
 
@@ -46,7 +46,7 @@ ToDashedButtonSkin >> builtBorderHoverBuilder [
 	| builder |
 	builder := super builtBorderHoverBuilder.
 	builder paint: self theme colorPrimaryHover.
-	builder dashArray: self theme dashed.
+	builder dashArray: self theme dashArray.
 	^ builder
 ]
 
@@ -56,7 +56,7 @@ ToDashedButtonSkin >> builtBorderPressedBuilder [
 	| builder |
 	builder := super builtBorderPressedBuilder.
 	builder paint: self theme colorPrimaryPressed.
-	builder dashArray: self theme dashed.
+	builder dashArray: self theme dashArray.
 	^ builder
 ]
 
diff --git a/src/Toplo-LookAndFeel/ToLAFButtonDresser.class.st b/src/Toplo-LookAndFeel/ToLAFButtonDresser.class.st
index 667e1c638..eb5f338a1 100644
--- a/src/Toplo-LookAndFeel/ToLAFButtonDresser.class.st
+++ b/src/Toplo-LookAndFeel/ToLAFButtonDresser.class.st
@@ -24,8 +24,8 @@ ToLAFButtonDresser >> hover: anElement event: anEvent [
 	super mouseEnterEvent: anEvent in: anElement.
 
 	"update main element"
-	self background: self skin backgroundHover in: anElement.
-	self border: self skin borderHover in: anElement.
+	anElement background: self skin backgroundHover.
+	anElement border: self skin borderHover.
 
 	"label event dispatch"
 	label := anElement label.
@@ -41,20 +41,22 @@ ToLAFButtonDresser >> hover: anElement event: anEvent [
 { #category : #'events handling' }
 ToLAFButtonDresser >> initialState: anElement [
 
-	| label image|
+	| label image |
 	super initialState: anElement.
 
 	"update main element"
-	self background: self skin background in: anElement.
-	self border: self skin border in: anElement.
-	
+	anElement background: self skin background.
+	anElement border: self skin border.
+
 	"label event dispatch"
 	label := anElement label.
-	(label notNil and:[label dresser notNil]) ifTrue:[ label dresser initialState: label ].
-	
+	(label notNil and: [ label dresser notNil ]) ifTrue: [
+		label dresser initialState: label ].
+
 	"icon event dispatch"
 	image := anElement icon.
-	(image notNil and:[image dresser notNil]) ifTrue:[ image dresser initialState: image ].
+	(image notNil and: [ image dresser notNil ]) ifTrue: [
+		image dresser initialState: image ]
 ]
 
 { #category : #accessing }
@@ -80,8 +82,8 @@ ToLAFButtonDresser >> leftClickEvent: anEvent in: anElement [
 
 	super leftClickEvent: anEvent in: anElement.
 	"self restoreUnpressedState."
-	
-	self hover: anElement event: anEvent
+
+	self mouseEnterEvent: anEvent in: anElement
 ]
 
 { #category : #deprecated }
@@ -100,21 +102,21 @@ ToLAFButtonDresser >> leftClicked: anElement event: anEvent [
 
 { #category : #'events handling' }
 ToLAFButtonDresser >> leftMouseDownEvent: anEvent in: anElement [
-	| label image |
 
-	"self savePressedState"
-	
-	"update main element"
-	self background: self skin backgroundPressed in: anElement.
-	self border: self skin borderPressed in: anElement.
+	| label image |
+	"self savePressedState""update main element"
+	anElement background: self skin backgroundPressed.
+	anElement border: self skin borderPressed.
 
 	"label event dispatch"
 	label := anElement label.
-	(label notNil and:[label dresser notNil]) ifTrue:[ label dresser leftMouseDownEvent: anEvent in: label ].
-	
+	(label notNil and: [ label dresser notNil ]) ifTrue: [
+		label dresser leftMouseDownEvent: anEvent in: label ].
+
 	"icon event dispatch"
 	image := anElement icon.
-	(image notNil and:[image dresser notNil]) ifTrue:[ image dresser leftMouseDownEvent: anEvent in: image ].
+	(image notNil and: [ image dresser notNil ]) ifTrue: [
+		image dresser leftMouseDownEvent: anEvent in: image ]
 ]
 
 { #category : #'events handling' }
@@ -162,21 +164,22 @@ ToLAFButtonDresser >> leftUp: anElement event: anEvent [
 { #category : #'events handling' }
 ToLAFButtonDresser >> mouseEnterEvent: anEvent in: anElement [
 
-
-	| label image|
+	| label image |
 	super mouseEnterEvent: anEvent in: anElement.
-	
+
 	"update main element"
-	self background: self skin backgroundHover in: anElement.
-	self border: self skin borderHover in: anElement.
+	anElement background: self skin backgroundHover.
+	anElement border: self skin borderHover.
 
 	"label event dispatch"
 	label := anElement label.
-	(label notNil and:[label dresser notNil]) ifTrue:[ label dresser hover: label event: anEvent ].
-	
+	(label notNil and: [ label dresser notNil ]) ifTrue: [
+		label dresser hover: label event: anEvent ].
+
 	"icon event dispatch"
 	image := anElement icon.
-	(image notNil and:[image dresser notNil]) ifTrue:[ image dresser hover: image event: anEvent ].
+	(image notNil and: [ image dresser notNil ]) ifTrue: [
+		image dresser hover: image event: anEvent ]
 ]
 
 { #category : #'events handling' }
diff --git a/src/Toplo-LookAndFeel/ToLAFExamples.class.st b/src/Toplo-LookAndFeel/ToLAFExamples.class.st
index 789062399..f78faaea6 100644
--- a/src/Toplo-LookAndFeel/ToLAFExamples.class.st
+++ b/src/Toplo-LookAndFeel/ToLAFExamples.class.st
@@ -9,11 +9,11 @@ ToLAFExamples class >> example_ButtonSkins [
 
 	| space button1 button2 button3 button4 button5 pane |
 	space := BlSpace new.
-	space root layout: (BlLinearLayout vertical cellSpacing: 10).
-	
+
+	space root layout: (BlLinearLayout vertical).
+
 	pane := ToPane horizontal.
-	pane layout: (BlLinearLayout horizontal cellSpacing: 10).
-	
+	pane background: Color random.
 	button1 := ToButton skinType: #primary.
 	button1 labelText: 'Primary button'.
 	button2 := ToButton skinType: #default.
@@ -28,8 +28,8 @@ ToLAFExamples class >> example_ButtonSkins [
 	pane addChild: button1; addChild: button2; addChild: button3; addChild: button4; addChild: button5.
 	space root addChild: pane.
 	
-	pane := ToPane horizontal.
-	pane layout: (BlLinearLayout horizontal cellSpacing: 10).
+	pane := ToPane horizontal.	
+	pane background: Color random.
 	
 	button1 := ToButton skinType: #primary.
 	button1 labelText: 'Primary button'.
@@ -50,8 +50,8 @@ ToLAFExamples class >> example_ButtonSkins [
 	pane addChild: button1; addChild: button2; addChild: button3; addChild: button4; addChild: button5.
 	space root addChild: pane.
 	
-	pane := ToPane horizontal.
-	pane layout: (BlLinearLayout horizontal cellSpacing: 10).
+	pane := ToPane horizontal.	
+	pane background: Color random.
 	
 	button1 := ToButton skinType: #primary.
 	button1 icon: (ToImage new innerImage: (ToThemeIcons iconSearchOutlined16x16)).
@@ -68,8 +68,8 @@ ToLAFExamples class >> example_ButtonSkins [
 	pane addChild: button1; addChild: button2; addChild: button3; addChild: button4; addChild: button5.
 	space root addChild: pane.
 	
-	pane := ToPane horizontal.
-	pane layout: (BlLinearLayout horizontal cellSpacing: 10).
+	pane := ToPane horizontal.	
+	pane background: Color random.
 	
 	button1 := ToButton skinType: #dangerPrimary .
 	button1 labelText: 'Danger primary'.
@@ -85,8 +85,8 @@ ToLAFExamples class >> example_ButtonSkins [
 	pane addChild: button1; addChild: button2; addChild: button3; addChild: button4; addChild: button5.
 	space root addChild: pane.
 	
-	pane := ToPane horizontal.
-	pane layout: (BlLinearLayout horizontal cellSpacing: 10).
+	pane := ToPane horizontal.	
+	pane background: Color random.
 	
 	button1 := ToButton skinType: #dangerPrimary .
 	button1 labelText: 'Danger primary'.
@@ -107,8 +107,8 @@ ToLAFExamples class >> example_ButtonSkins [
 	pane addChild: button1; addChild: button2; addChild: button3; addChild: button4; addChild: button5.
 	space root addChild: pane.
 	
-	pane := ToPane horizontal.
-	pane layout: (BlLinearLayout horizontal cellSpacing: 10).
+	pane := ToPane horizontal.	
+	pane background: Color random.
 	
 	button1 := ToButton skinType: #dangerPrimary .
 	button1 icon: (ToImage new innerImage: (ToThemeIcons iconSearchOutlined16x16)).
@@ -125,8 +125,9 @@ ToLAFExamples class >> example_ButtonSkins [
 	space root addChild: pane.
 	
 	space show.
+	space root inspect.
 
-	^space
+	^space 
 ]
 
 { #category : #buttons }
diff --git a/src/Toplo-LookAndFeel/ToLAFImageDresser.class.st b/src/Toplo-LookAndFeel/ToLAFImageDresser.class.st
index d49d573ba..9be1a9182 100644
--- a/src/Toplo-LookAndFeel/ToLAFImageDresser.class.st
+++ b/src/Toplo-LookAndFeel/ToLAFImageDresser.class.st
@@ -38,6 +38,12 @@ ToLAFImageDresser >> isSkinCompatible: aSkin [
 	^ aSkin isKindOf: ToAbstractImageSkin
 ]
 
+{ #category : #'events handling' }
+ToLAFImageDresser >> leftMouseDownEvent: anEvent in: anElement [
+	
+	self leftPressed: anElement event: anEvent
+]
+
 { #category : #'events handling' }
 ToLAFImageDresser >> leftPressed: anElement event: aBlMouseDownEvent [ 
 	
diff --git a/src/Toplo-LookAndFeel/ToLAFLabelDresser.class.st b/src/Toplo-LookAndFeel/ToLAFLabelDresser.class.st
index 992bbde56..d5bfec668 100644
--- a/src/Toplo-LookAndFeel/ToLAFLabelDresser.class.st
+++ b/src/Toplo-LookAndFeel/ToLAFLabelDresser.class.st
@@ -40,6 +40,12 @@ ToLAFLabelDresser >> isSkinCompatible: aSkin [
 	^ aSkin isKindOf: ToAbstractLabelSkin
 ]
 
+{ #category : #'events handling' }
+ToLAFLabelDresser >> leftMouseDownEvent: anEvent in: anElement [
+
+	self leftPressed: anElement event: anEvent
+]
+
 { #category : #'events handling' }
 ToLAFLabelDresser >> leftPressed: anElement event: aBlMouseDownEvent [ 
 	
diff --git a/src/Toplo-LookAndFeel/ToLAFRadioButtonDresser.class.st b/src/Toplo-LookAndFeel/ToLAFRadioButtonDresser.class.st
index cbcb092bb..3c5eb6264 100644
--- a/src/Toplo-LookAndFeel/ToLAFRadioButtonDresser.class.st
+++ b/src/Toplo-LookAndFeel/ToLAFRadioButtonDresser.class.st
@@ -120,19 +120,23 @@ ToLAFRadioButtonDresser >> hover: anElement event: anEvent [
 
 { #category : #accessing }
 ToLAFRadioButtonDresser >> initialState: anElement [
-
 	"update main element"
-	self background: self skin background in: anElement.
-	self border: self skin border in: anElement.
-	
+
+	anElement background: self skin background.
+	anElement border: self skin border.
+
 	"update checked/unchecked icon"
 	anElement checked
 		ifTrue: [
-			self skin checkedBorder ifNotNil: [:e | anElement icon innerImage border: e].
-			self skin checkedBackground ifNotNil: [:e | anElement icon innerImage background: e]]
+			self skin checkedBorder ifNotNil: [ :e |
+				anElement icon innerImage border: e ].
+			self skin checkedBackground ifNotNil: [ :e |
+				anElement icon innerImage background: e ] ]
 		ifFalse: [
-			self skin uncheckedBorder ifNotNil: [:e | anElement icon innerImage border: e].
-			self skin uncheckedBackground ifNotNil: [:e | anElement icon innerImage background: e]]
+			self skin uncheckedBorder ifNotNil: [ :e |
+				anElement icon innerImage border: e ].
+			self skin uncheckedBackground ifNotNil: [ :e |
+				anElement icon innerImage background: e ] ]
 ]
 
 { #category : #accessing }
diff --git a/src/Toplo/BlElement.extension.st b/src/Toplo/BlElement.extension.st
index d7e1fb3f9..4b54f2935 100644
--- a/src/Toplo/BlElement.extension.st
+++ b/src/Toplo/BlElement.extension.st
@@ -8,6 +8,29 @@ BlElement >> asPlaceholderLayer [
 		  yourself
 ]
 
+{ #category : #'*Toplo' }
+BlElement >> checkSkinInitialization [
+]
+
+{ #category : #'*Toplo' }
+BlElement >> checkSkinInstallation [
+
+	self launchSkinInstallation.
+	self childrenDo: [ :child | child checkSkinInstallation ]
+]
+
+{ #category : #'*Toplo' }
+BlElement >> currentSkinState [
+
+	^ self userData at: #currentSkinState ifAbsentPut: [  ]
+]
+
+{ #category : #'*Toplo' }
+BlElement >> currentSkinState: aState [
+
+	self userData at: #currentSkinState put: aState
+]
+
 { #category : #'*Toplo' }
 BlElement >> dispatchLookEvent: anEvent [
 
@@ -30,6 +53,13 @@ BlElement >> holder [
 	^ self constraints infinite holder
 ]
 
+{ #category : #'*Toplo' }
+BlElement >> launchSkinInstallation [
+
+	"Nothing to do at BlElement level to preserve efficienty"
+
+]
+
 { #category : #'*Toplo-LookAndFeel' }
 BlElement >> openInOBlSpaceWithoutToTheme [
 	"This is a development method : use this method when your Space cannot support ToTheme management"
@@ -61,24 +91,61 @@ BlElement >> openInSpaceWithoutToTheme [
 
 ]
 
+{ #category : #'*Toplo' }
+BlElement >> privateSkin [
+
+	^ self userData at: #privateSkin ifAbsent: [  ]
+]
+
+{ #category : #'*Toplo' }
+BlElement >> privateSkin: aSkin [
+
+	self privateSkin = aSkin ifTrue: [ ^ self ].
+	self userData at: #privateSkin put: aSkin
+]
+
+{ #category : #'*Toplo' }
+BlElement >> privateToTheme [
+
+	^ self userData at: #privateToTheme ifAbsent: [  ]
+]
+
+{ #category : #'*Toplo' }
+BlElement >> privateToTheme: aTheme [
+
+	self userData at: #privateToTheme put: aTheme
+]
+
+{ #category : #'*Toplo' }
+BlElement >> switchToSkinState: aState [
+
+	"self currentState class = aState class ifTrue: [ ^ self ]."
+	self currentSkinState: aState.
+	self dispatchLookEvent: (ToElementStateChangedEvent new state: aState; yourself)
+]
+
 { #category : #'*Toplo-LookAndFeel' }
 BlElement >> toTheme [
 
-	self userData at: #ToTheme ifPresent: [ :th | ^ th ] ifAbsent: [
-		self parentDo: [ :p | ^ p toTheme ].
-		^ ToAbstractTheme current ]
+	^ self privateToTheme ifNil: [
+		  self hasParent
+			  ifTrue: [ self parent toTheme ]
+			  ifFalse: [
+				  self isAttachedToSceneGraph
+					  ifTrue: [ " install the theme only if the root is visible to 
+						avoid default installation in another element that the space root"
+						  self privateToTheme: ToAbstractTheme current.
+						  self privateToTheme ]
+					  ifFalse: [ ToAbstractTheme current ] ] ]
 ]
 
 { #category : #'*Toplo-LookAndFeel' }
 BlElement >> toTheme: aTheme [
 
-	self userData
-		at: #ToTheme
-		ifPresent: [ :currentTheme |
-		currentTheme = aTheme ifTrue: [ ^ self ] ].
+	self privateToTheme = aTheme ifTrue: [ ^ self ].
+	self privateToTheme: aTheme.
+	self toThemeChanged.
 
-	self userData at: #ToTheme put: aTheme.
-	self toThemeChanged
 ]
 
 { #category : #'*Toplo-LookAndFeel' }
@@ -89,3 +156,22 @@ BlElement >> toThemeChanged [
 
 
 ]
+
+{ #category : #'*Toplo' }
+BlElement >> withSkin: aSkin [
+
+	self withoutSkin.
+	self privateSkin: aSkin.
+	Toplo useLookAndFeel ifTrue: [ ^ self ].
+	self privateSkin ifNotNil: [ :s |
+		self addEventHandler: s.
+		self dispatchSkinChangedEvent ]
+]
+
+{ #category : #'*Toplo' }
+BlElement >> withoutSkin [
+
+	self privateSkin ifNotNil: [ :s |
+		self removeEventHandler: s.
+		self privateSkin: nil ]
+]
diff --git a/src/Toplo/BlSpace.extension.st b/src/Toplo/BlSpace.extension.st
index 38652b698..3fca88ddb 100644
--- a/src/Toplo/BlSpace.extension.st
+++ b/src/Toplo/BlSpace.extension.st
@@ -1,12 +1,38 @@
 Extension { #name : #BlSpace }
 
+{ #category : #'*Toplo' }
+BlSpace >> checkRootSkinInstallation [
+
+	self root privateSkin ifNil: [ 
+		self root withSkin: ToSpaceRootSkin new].
+	" To preserve efficiency, #launchSkinInstallation does nothing by default at BlElement level."
+	" Thus, the installation for root is directly launched here "
+	self root privateSkin launchSkinInstallationIn: self root
+]
+
+{ #category : #'*Toplo' }
+BlSpace >> checkSkinFrameInstallation [
+
+	(self frame phases anySatisfy: [ :p |
+		 p isKindOf: ToSpaceFrameSkinInstallationPhase ]) ifTrue: [ ^ self ].
+	self frame addPhase: ToSpaceFrameSkinInstallationPhase new
+]
+
+{ #category : #'*Toplo' }
+BlSpace >> checkSkinInstallation [
+
+	
+	self checkRootSkinInstallation.
+	self root checkSkinInstallation
+]
+
 { #category : #'*Toplo' }
 BlSpace >> defaultPopupElevation [
 
 	^ BlRelativeElevation elevation: SmallInteger maxVal
 ]
 
-{ #category : #'*Toplo-LookAndFeel' }
+{ #category : #'*Toplo' }
 BlSpace >> isSupportToTheme [
 	"Development method : to check if the Space support ToTheme management"
 
@@ -32,7 +58,7 @@ BlSpace >> openAsPopup: anElement [
 BlSpace >> switchThemeDarkOrLight [
 	"Switch to the opposite theme : dark or light (if available)"
 	| newTheme |
-
+	Toplo useLookAndFeel ifFalse: [ ^ self ].
 	(self toTheme isNil or:[self toTheme isSupportLightAndDark not]) ifTrue:[ ^ self ].
 
 	newTheme := self toTheme isLight
@@ -46,18 +72,14 @@ BlSpace >> switchThemeDarkOrLight [
 { #category : #'*Toplo-LookAndFeel' }
 BlSpace >> toTheme [
 
-	| theme |
-	theme := self root toTheme.
-
-	"Check theme installation : this is dirty and temporary"
-	(theme notNil and:[self isThemeInstalled not]) ifTrue:[ theme installOnSpace: self ].
-	
-	^ theme
+	self checkSkinFrameInstallation.
+	^ self root toTheme
 ]
 
 { #category : #'*Toplo-LookAndFeel' }
 BlSpace >> toTheme: aTheme [
 
-	aTheme ifNotNil: [ aTheme installOnSpace: self ].
-	self root toTheme: aTheme
+	self root toTheme: aTheme.
+	Toplo useLookAndFeel ifFalse: [ ^ self ].
+	aTheme installOnSpace: self.
 ]
diff --git a/src/Toplo/TToDressable.extension.st b/src/Toplo/TToDressable.extension.st
index fc07d13f6..79616b53b 100644
--- a/src/Toplo/TToDressable.extension.st
+++ b/src/Toplo/TToDressable.extension.st
@@ -52,23 +52,6 @@ TToDressable >> skinType: aType [
 	self setSkinForType: aType.
 ]
 
-{ #category : #'*Toplo-LookAndFeel' }
-TToDressable >> toTheme [
-
-	^ self userData at: #ToTheme ifAbsent: [
-		  self hasParent
-			  ifTrue: [ self parent toTheme ]
-			  ifFalse: [ ToAbstractTheme current ] 
-	]
-]
-
-{ #category : #'*Toplo-LookAndFeel' }
-TToDressable >> toTheme: aTheme [
-
-	self userData at: #ToTheme put: aTheme.
-	self toThemeChanged
-]
-
 { #category : #'*Toplo-LookAndFeel' }
 TToDressable >> toThemeChanged [
 
diff --git a/src/Toplo/TToDressable.trait.st b/src/Toplo/TToDressable.trait.st
index bd35fa64d..6a1553588 100644
--- a/src/Toplo/TToDressable.trait.st
+++ b/src/Toplo/TToDressable.trait.st
@@ -130,23 +130,6 @@ TToDressable >> skinType: aType [
 	self setSkinForType: aType.
 ]
 
-{ #category : #'*Toplo-LookAndFeel' }
-TToDressable >> toTheme [
-
-	^ self userData at: #ToTheme ifAbsent: [
-		  self hasParent
-			  ifTrue: [ self parent toTheme ]
-			  ifFalse: [ ToAbstractTheme current ] 
-	]
-]
-
-{ #category : #'*Toplo-LookAndFeel' }
-TToDressable >> toTheme: aTheme [
-
-	self userData at: #ToTheme put: aTheme.
-	self toThemeChanged
-]
-
 { #category : #'*Toplo-LookAndFeel' }
 TToDressable >> toThemeChanged [
 
diff --git a/src/Toplo/TToElementWithState.trait.st b/src/Toplo/TToElementWithState.trait.st
index 696f00e6d..712cd7176 100644
--- a/src/Toplo/TToElementWithState.trait.st
+++ b/src/Toplo/TToElementWithState.trait.st
@@ -1,42 +1,19 @@
 Trait {
 	#name : #TToElementWithState,
 	#instVars : [
-		'#currentState => ObservableSlot'
+		'currentState'
 	],
 	#category : #'Toplo-Core'
 }
 
 { #category : #'t - state processing' }
-TToElementWithState >> currentState [
+TToElementWithState >> currentSkinState [
 
 	^ currentState
 ]
 
 { #category : #'t - state processing' }
-TToElementWithState >> currentState: aState [
+TToElementWithState >> currentSkinState: aState [
 
 	currentState := aState
 ]
-
-{ #category : #initialization }
-TToElementWithState >> initialize [
-
-	self class initializeSlots: self.
-	super initialize.
-]
-
-{ #category : #'t - state processing' }
-TToElementWithState >> switchToState: aState [
-
-	"self currentState class = aState class ifTrue: [ ^ self ]."
-	self currentState: aState.
-	self dispatchLookEvent: (ToElementStateChangedEvent new state: aState; yourself)
-]
-
-{ #category : #enumerating }
-TToElementWithState >> whenCurrentStateChangedDo: aBlock [
-
-	"set a block to perform after that the slot has been changed, and its action performed"
-
-	self property: #currentState whenChangedDo: aBlock
-]
diff --git a/src/Toplo/TToElementtWithStateDep.trait.st b/src/Toplo/TToElementtWithStateDep.trait.st
index 911cec472..f46300dd9 100644
--- a/src/Toplo/TToElementtWithStateDep.trait.st
+++ b/src/Toplo/TToElementtWithStateDep.trait.st
@@ -7,6 +7,12 @@ Trait {
 	#category : #'Toplo-Core'
 }
 
+{ #category : #testing }
+TToElementtWithStateDep classSide >> isDeprecated [ 
+
+	^ true
+]
+
 { #category : #'t - state processing' }
 TToElementtWithStateDep >> canSwitchToNextState [ 
 
diff --git a/src/Toplo/TToSkinable.trait.st b/src/Toplo/TToSkinable.trait.st
index b234a8e6a..1004063be 100644
--- a/src/Toplo/TToSkinable.trait.st
+++ b/src/Toplo/TToSkinable.trait.st
@@ -6,14 +6,6 @@ Trait {
 	#category : #'Toplo-Core-Theme'
 }
 
-{ #category : #'t - skin accessing' }
-TToSkinable >> addLook: aLook [
-
-	self checkSkin.
-	privateSkin ifNil: [ ^ self ].
-	privateSkin addLook: aLook
-]
-
 { #category : #'t - skin accessing' }
 TToSkinable >> checkSkin [
 
@@ -32,12 +24,6 @@ TToSkinable >> initializeSkin [
 	self withSkin: self defaultSkin
 ]
 
-{ #category : #'t - skin accessing' }
-TToSkinable >> launchSkinInitialization [
-
-	self privateSkin ifNotNil: [ :s | s launchSkinInitializationIn: self ]
-]
-
 { #category : #'t - skin accessing' }
 TToSkinable >> launchSkinInstallation [
 
@@ -51,20 +37,8 @@ TToSkinable >> privateSkin [
 ]
 
 { #category : #'t - skin accessing' }
-TToSkinable >> withSkin: aSkin [
-
-	self withoutSkin.
-	privateSkin := aSkin.
-	Toplo useLookAndFeel ifTrue: [ ^ self ].
-	privateSkin ifNotNil: [
-		self addEventHandler: privateSkin.
-		self dispatchSkinChangedEvent ]
-]
-
-{ #category : #'t - skin accessing' }
-TToSkinable >> withoutSkin [
+TToSkinable >> privateSkin: aSkin [
 
-	privateSkin ifNotNil: [
-		self removeEventHandler: privateSkin.
-		privateSkin := nil ]
+	privateSkin = aSkin ifTrue: [ ^ self ].
+	privateSkin := aSkin
 ]
diff --git a/src/Toplo/ToCheckableSkin.class.st b/src/Toplo/ToCheckableSkin.class.st
index 5bc4e51e5..a0b534f5c 100644
--- a/src/Toplo/ToCheckableSkin.class.st
+++ b/src/Toplo/ToCheckableSkin.class.st
@@ -11,7 +11,7 @@ ToCheckableSkin >> buttonIconChanged: anEvent [
 	" have to change the state of the new icon so that its skin is initialized with the right state.
 	As an example in case of click, a CheckBoxButton turns into HoverState and change its icon which 
 	itself must be initialized into an HoverState (the same as its CheckBoxButton) "
-	anEvent currentTarget icon currentState: anEvent currentTarget currentState.
+	anEvent currentTarget icon currentSkinState: anEvent currentTarget currentState.
 	anEvent currentTarget icon withSkin: self iconSkin.
 	
 ]
diff --git a/src/Toplo/ToElement.class.st b/src/Toplo/ToElement.class.st
index b23142d7f..ca94783b4 100644
--- a/src/Toplo/ToElement.class.st
+++ b/src/Toplo/ToElement.class.st
@@ -21,7 +21,7 @@ ToElement >> defaultLayoutCommonConstraints [
 	^ BlLayoutCommonConstraints new
 ]
 
-{ #category : #initialization }
+{ #category : #'as yet unclassified' }
 ToElement >> initialize [ 
 
 	super initialize.
diff --git a/src/Toplo/ToGeneralButtonDresser.class.st b/src/Toplo/ToGeneralButtonDresser.class.st
index 8bcdecb6c..0270d61e0 100644
--- a/src/Toplo/ToGeneralButtonDresser.class.st
+++ b/src/Toplo/ToGeneralButtonDresser.class.st
@@ -141,7 +141,7 @@ ToGeneralButtonDresser >> mouseUpOutsideEvent: anEvent in: anElement [
 		^ self ].
 	"MouseUpOutside for a button is managed if a MouseDown (inside) has occured before (with a consequent pressed state).
 	So, do not change the state if the button is not in pressed state"
-	anElement currentState isPressedState ifFalse: [ ^ self ].
+	anElement currentSkinState isPressedState ifFalse: [ ^ self ].
 	self initialState: anElement
 ]
 
@@ -154,7 +154,7 @@ ToGeneralButtonDresser >> pressedState: anElement [
 { #category : #'events handling' }
 ToGeneralButtonDresser >> switchToState: aState in: anElement [
 
-	anElement switchToState: aState
+	anElement switchToSkinState: aState
 ]
 
 { #category : #'api - install/uninstall  hook' }
diff --git a/src/Toplo/ToSandBox.class.st b/src/Toplo/ToSandBox.class.st
index 6b340f091..60e1649af 100644
--- a/src/Toplo/ToSandBox.class.st
+++ b/src/Toplo/ToSandBox.class.st
@@ -940,6 +940,7 @@ ToSandBox class >> example_ToButtonSkins [
 
 	| space pane themeSwitcher butBuilder buttonSpecsBuilder |
 	space := BlSpace new.
+	space inspect.
 	
 	space root layout: (BlLinearLayout vertical cellSpacing: 10).
 
@@ -1148,7 +1149,7 @@ ToSandBox class >> example_ToButtonWithPrimarySkin [
 	| space button1 |
 	
 	space := BlSpace new.
-
+	space inspect.
 	button1 := ToButton new withSkin: (ToButtonSkin new type: ToButtonPrimaryType new).
 	button1 label: (ToLabel text: 'Primary button').
 	button1 icon: (ToImage new innerImage: (ToThemeIcons iconSearchOutlined16x16)).
@@ -1953,6 +1954,22 @@ ToSandBox class >> example_scaledImage [
 	im openInSpace
 ]
 
+{ #category : #space }
+ToSandBox class >> example_spaceRootSkin [
+
+	| space themeSwitcher |
+	space := BlSpace new.
+	space inspect.
+	themeSwitcher := ToToggleButton new
+		      labelText: 'Theme';
+		      beLabelFirst.
+	themeSwitcher switchBarOnElement: ((ToLabel text: ('Dark' asRopedText foreground: Color white)) ).
+	themeSwitcher switchBarOffElement: ((ToLabel text: ('Light' asRopedText foreground: Color black)) ).
+	themeSwitcher when: ToCheckableCheckEvent do: [ :event | space toTheme: ( event current ifTrue: [ToThemeDark new] ifFalse: [ ToThemeLight new]) ].
+	space root addChild: themeSwitcher.
+	space show
+]
+
 { #category : #'text field' }
 ToSandBox class >> example_textField0 [
 
diff --git a/src/Toplo/ToSpaceFrameSkinInstallationPhase.class.st b/src/Toplo/ToSpaceFrameSkinInstallationPhase.class.st
new file mode 100644
index 000000000..fb5939436
--- /dev/null
+++ b/src/Toplo/ToSpaceFrameSkinInstallationPhase.class.st
@@ -0,0 +1,18 @@
+Class {
+	#name : #ToSpaceFrameSkinInstallationPhase,
+	#superclass : #BlSpaceFramePhase,
+	#category : #'Toplo-Space - Frame'
+}
+
+{ #category : #accessing }
+ToSpaceFrameSkinInstallationPhase >> name [
+	<return: #String>
+	
+	^ 'Skin installation'
+]
+
+{ #category : #actions }
+ToSpaceFrameSkinInstallationPhase >> runOn: aSpace [
+
+	aSpace checkSkinInstallation
+]
diff --git a/src/Toplo/ToSpaceRootSkin.class.st b/src/Toplo/ToSpaceRootSkin.class.st
new file mode 100644
index 000000000..431abff64
--- /dev/null
+++ b/src/Toplo/ToSpaceRootSkin.class.st
@@ -0,0 +1,14 @@
+Class {
+	#name : #ToSpaceRootSkin,
+	#superclass : #ToWidgetSkin,
+	#category : #'Toplo-Widget-Pane-Skin'
+}
+
+{ #category : #'api - install/uninstall  hook' }
+ToSpaceRootSkin >> onSkinInstalledIn: anElement [
+
+	super onSkinInstalledIn: anElement.
+	self addLook: (ToBackgroundLook new
+			 initialBg: [ :e | e toTheme backgroundColor ];
+			 yourself)
+]
diff --git a/src/Toplo/ToWidgetDresser.class.st b/src/Toplo/ToWidgetDresser.class.st
index f0631452e..38c13133c 100644
--- a/src/Toplo/ToWidgetDresser.class.st
+++ b/src/Toplo/ToWidgetDresser.class.st
@@ -9,7 +9,10 @@ Class {
 { #category : #'deprecated private' }
 ToWidgetDresser >> background: aBackground in: anElement [
 
-	self deprecated: 'Look is managed by skins'.
+	self
+		deprecated: 'Please send #background: to the element instead.'
+		transformWith: '`@receiver background: `@aBackground in: `@anElement'
+			-> '`@anElement background: `@aBackground'.
 	anElement
 		disableEventType: BlElementBackgroundChangedEvent 
 		while: [ anElement background: aBackground ]
@@ -18,7 +21,10 @@ ToWidgetDresser >> background: aBackground in: anElement [
 { #category : #'deprecated private' }
 ToWidgetDresser >> border: aBorder in: anElement [
 
-	self deprecated: 'Look is managed by skins'.
+	self
+		deprecated: 'Please send #border: to the element instead.'
+		transformWith: '`@receiver border: `@aBorder in: `@anElement'
+			-> '`@anElement border: `@aBorder'.
 	anElement
 		disableEventType: BlElementBorderChangedEvent
 		while: [ anElement border: aBorder ]
diff --git a/src/Toplo/ToWidgetSkin.class.st b/src/Toplo/ToWidgetSkin.class.st
index b7dec6867..12c26c80d 100644
--- a/src/Toplo/ToWidgetSkin.class.st
+++ b/src/Toplo/ToWidgetSkin.class.st
@@ -75,8 +75,9 @@ ToWidgetSkin >> launchSkinInitializationIn: anElement [
 	| state |
 	anElement isLayoutRequested ifTrue: [ ^ self ].
 	initialized ifTrue: [ ^ self ].
-	state := anElement currentState ifNil: [ ToInitialState new ].
-	anElement switchToState: state.
+
+	state := anElement currentSkinState ifNil: [ ToInitialState new ].
+	anElement switchToSkinState: state.
 	initialized := true.
 
 ]
@@ -84,7 +85,7 @@ ToWidgetSkin >> launchSkinInitializationIn: anElement [
 { #category : #'api - install/uninstall  hook' }
 ToWidgetSkin >> launchSkinInstallationIn: anElement [
 
-	installed ifTrue: [ ^ self ].
+	installed ifTrue: [ ^ self launchSkinInitializationIn: anElement ].
 	anElement requestLayout.
 	installed := true.
 	self privateLook: ToNullElementLook new.
@@ -94,7 +95,6 @@ ToWidgetSkin >> launchSkinInstallationIn: anElement [
 
 { #category : #'api - install/uninstall  hook' }
 ToWidgetSkin >> launchSkinUninstallationIn: anElement [
-
 	installed ifFalse: [ ^ self ].
 	anElement dispatchLookEvent: ToUninstallLookEvent new.
 	self onSkinUninstalledIn: anElement.