diff --git a/examples/CMakeLists.txt b/examples/CMakeLists.txt
index 3d088b2..eff3c85 100644
--- a/examples/CMakeLists.txt
+++ b/examples/CMakeLists.txt
@@ -8,6 +8,16 @@ set(CMAKE_CXX_EXTENSIONS OFF)
 
 include_directories("../include/")
 file(GLOB_RECURSE SOURCE_LIST "./*.cpp")
+list(FILTER SOURCE_LIST EXCLUDE REGEX "CMakeCXXCompilerId.cpp$")
 set(CMAKE_RUNTIME_OUTPUT_DIRECTORY "../bin")
 
-add_executable(${PROJECT_NAME} ${SOURCE_LIST})
+foreach( source ${SOURCE_LIST} )
+    string(REPLACE ".cpp" "" name ${source} )
+    string(REGEX REPLACE ".+/" "" name ${name} )
+    add_executable( ${name} ${source} )
+    target_link_libraries(${name}
+    PRIVATE
+        Spaic
+        SpaicCSS
+    )
+endforeach( source ${SOURCE_LIST} )
\ No newline at end of file
diff --git a/examples/Counter.cpp b/examples/Counter.cpp
index 967ebe3..af8022c 100644
--- a/examples/Counter.cpp
+++ b/examples/Counter.cpp
@@ -1,6 +1,7 @@
 #include <cstdlib>
 
 #include <spaic/Prelude.hpp>
+#include <spaic-css/Prelude.hpp>
 
 namespace props::counter
 {
@@ -46,9 +47,8 @@ auto counter = create_component(props::counter::all, state::counter::all, update
 int main()
 {
     using namespace props::counter;
+    auto wtf_is_this_style = css(
+        width = 10.0_px);
     counter(is_dark_theme = true)("Hello, world!");
-    // new Counter(is_dark_theme = true);
-    // Counter{is_dark_theme = true};
-    // Counter(is_dark_theme = true);
     return EXIT_SUCCESS;
 }
diff --git a/include/spaic-css/CSS.hpp b/include/spaic-css/CSS.hpp
index 4194b4a..f661ea1 100644
--- a/include/spaic-css/CSS.hpp
+++ b/include/spaic-css/CSS.hpp
@@ -2,8 +2,12 @@
 
 #include <spaic-css/Stylesheet.hpp>
 
-namespace spaic
+namespace spaic::css
 {
 template <typename... T>
-spaic::css::Stylesheet css(T... params);
-}
+Stylesheet css(T... params);
+template <typename... T>
+Stylesheet keyframes(T... params);
+} // namespace spaic::css
+
+#include <spaic-css/detail/CSS.hpp>
\ No newline at end of file
diff --git a/include/spaic-css/CssProperty.hpp b/include/spaic-css/CssProperty.hpp
new file mode 100644
index 0000000..12f6093
--- /dev/null
+++ b/include/spaic-css/CssProperty.hpp
@@ -0,0 +1,18 @@
+#pragma once
+
+namespace spaic::css::prop
+{
+template <typename T>
+class AssignedCssProperty
+{
+};
+
+template <typename T>
+class CssProperty
+{
+public:
+    AssignedCssProperty<T> operator=(T value);
+};
+} // namespace spaic::css::prop
+
+#include <spaic-css/detail/CssProperty.hpp>
\ No newline at end of file
diff --git a/include/spaic-css/PredefinedCssProperty.hpp b/include/spaic-css/PredefinedCssProperty.hpp
new file mode 100644
index 0000000..60edce1
--- /dev/null
+++ b/include/spaic-css/PredefinedCssProperty.hpp
@@ -0,0 +1,11 @@
+#pragma once
+
+#include <spaic-css/CssProperty.hpp>
+#include <spaic-css/Unit.hpp>
+
+namespace spaic::css::prop
+{
+using namespace spaic::css::unit;
+// TODO: Strong type check, can we use Length type?
+CssProperty<CssUnit<CssUnitType::px>> width;
+} // namespace spaic::css::prop
\ No newline at end of file
diff --git a/include/spaic-css/Prelude.hpp b/include/spaic-css/Prelude.hpp
new file mode 100644
index 0000000..7d2d1ee
--- /dev/null
+++ b/include/spaic-css/Prelude.hpp
@@ -0,0 +1,9 @@
+#pragma once
+
+#include <spaic-css/PredefinedCssProperty.hpp>
+#include <spaic-css/CSS.hpp>
+#include <spaic-css/Unit.hpp>
+
+using namespace spaic::css::prop;
+using spaic::css::css;
+using namespace spaic::css::unit;
\ No newline at end of file
diff --git a/include/spaic-css/Stylesheet.hpp b/include/spaic-css/Stylesheet.hpp
index d8642e8..6ea190f 100644
--- a/include/spaic-css/Stylesheet.hpp
+++ b/include/spaic-css/Stylesheet.hpp
@@ -1,8 +1,11 @@
 #pragma once
 
+#include <string>
+
 namespace spaic::css
 {
 class Stylesheet
 {
+    std::string compile();
 };
 } // namespace spaic::css
diff --git a/include/spaic-css/Unit.hpp b/include/spaic-css/Unit.hpp
new file mode 100644
index 0000000..0ea99c0
--- /dev/null
+++ b/include/spaic-css/Unit.hpp
@@ -0,0 +1,102 @@
+#pragma once
+
+#define defineUnitUDLRaw(underscore, unitType)                                                    \
+    CssUnit<CssUnitType::unitType> operator"" underscore##unitType(long double v) noexcept        \
+    {                                                                                             \
+        return CssUnit<CssUnitType::unitType>(v);                                                 \
+    }                                                                                             \
+    CssUnit<CssUnitType::unitType> operator"" underscore##unitType(unsigned long long v) noexcept \
+    {                                                                                             \
+        return CssUnit<CssUnitType::unitType>(v);                                                 \
+    }
+#define defineUnitUDL(unitType) defineUnitUDLRaw(_, unitType)
+
+#include <string>
+
+namespace spaic::css::unit
+{
+enum class CssUnitType
+{
+    em,
+    ex,
+    cap,
+    ch,
+    ic,
+    rem,
+    lh,
+    rlh,
+    vw,
+    vh,
+    vi,
+    vb,
+    vmin,
+    vmax,
+    cm,
+    mm,
+    q,
+    in,
+    pc,
+    pt,
+    px,
+    deg,
+    grad,
+    rad,
+    turn,
+    s,
+    ms,
+    hz,
+    khz,
+    dpi,
+    dpcm,
+    dppx,
+    percent
+};
+template <CssUnitType T>
+class CssUnit
+{
+private:
+    long double value;
+
+public:
+    CssUnit(long double value) noexcept : value(value) {}
+
+    std::string toCssValue();
+};
+
+defineUnitUDL(em);
+defineUnitUDL(ex);
+defineUnitUDL(cap);
+defineUnitUDL(ch);
+defineUnitUDL(ic);
+defineUnitUDL(rem);
+defineUnitUDL(lh);
+defineUnitUDL(rlh);
+defineUnitUDL(vw);
+defineUnitUDL(vh);
+defineUnitUDL(vi);
+defineUnitUDL(vb);
+defineUnitUDL(vmin);
+defineUnitUDL(vmax);
+defineUnitUDL(cm);
+defineUnitUDL(mm);
+defineUnitUDL(q);
+defineUnitUDL(in);
+defineUnitUDL(pc);
+defineUnitUDL(pt);
+defineUnitUDL(px);
+defineUnitUDL(deg);
+defineUnitUDL(grad);
+defineUnitUDL(rad);
+defineUnitUDL(turn);
+defineUnitUDL(s);
+defineUnitUDL(ms);
+defineUnitUDL(hz);
+defineUnitUDL(khz);
+defineUnitUDL(dpi);
+defineUnitUDL(dpcm);
+defineUnitUDL(dppx);
+defineUnitUDL(percent);
+} // namespace spaic::css::unit
+
+#undef defineUnitUDLRaw
+#undef defineUnitUDL
\ No newline at end of file
diff --git a/include/spaic-css/detail/CSS.hpp b/include/spaic-css/detail/CSS.hpp
new file mode 100644
index 0000000..19efa0f
--- /dev/null
+++ b/include/spaic-css/detail/CSS.hpp
@@ -0,0 +1,12 @@
+#pragma once
+
+#include <spaic-css/CSS.hpp>
+
+namespace spaic::css
+{
+template <typename... T>
+spaic::css::Stylesheet css(T... params)
+{
+    throw "TODO";
+}
+} // namespace spaic::css
diff --git a/include/spaic-css/detail/CssProperty.hpp b/include/spaic-css/detail/CssProperty.hpp
new file mode 100644
index 0000000..09fa61e
--- /dev/null
+++ b/include/spaic-css/detail/CssProperty.hpp
@@ -0,0 +1,14 @@
+#pragma once
+
+#include <spaic-css/CssProperty.hpp>
+
+namespace spaic::css::prop
+{
+
+template <typename T>
+AssignedCssProperty<T> CssProperty<T>::operator=(T value)
+{
+    return AssignedCssProperty<T>();
+}
+
+} // namespace spaic::css::prop
\ No newline at end of file
diff --git a/include/spaic/Component.hpp b/include/spaic/Component.hpp
index 51af79c..62e42b3 100644
--- a/include/spaic/Component.hpp
+++ b/include/spaic/Component.hpp
@@ -11,8 +11,11 @@ namespace spaic::comp
 using ShouldRender = bool;
 using Update = std::function<ShouldRender()>;
 using Render = std::function<spaic::vnode::VNode()>;
-
-class ComponentBody;
+class ComponentBody
+{
+public:
+    spaic::vnode::VNode operator()(spaic::vnode::VNode children...) noexcept;
+};
 template <typename Props>
 class Component
 {
@@ -20,11 +23,8 @@ class Component
     template <typename... T>
     ComponentBody operator()(T... args) noexcept;
 };
-class ComponentBody
-{
-public:
-    spaic::vnode::VNode operator()(spaic::vnode::VNode children...) noexcept;
-};
 template <typename Props, typename StateSet>
 Component<Props> create_component(Props props, StateSet state, Update update, Render render);
 } // namespace spaic::comp
+
+#include <spaic/detail/Component.hpp>
\ No newline at end of file
diff --git a/include/spaic/Message.hpp b/include/spaic/Message.hpp
index d6cdef0..7a5f38c 100644
--- a/include/spaic/Message.hpp
+++ b/include/spaic/Message.hpp
@@ -17,3 +17,5 @@ class Message
 };
 
 } // namespace spaic::msg
+
+#include <spaic/detail/Message.hpp>
\ No newline at end of file
diff --git a/include/spaic/Property.hpp b/include/spaic/Property.hpp
index 358388f..109b4ae 100644
--- a/include/spaic/Property.hpp
+++ b/include/spaic/Property.hpp
@@ -13,7 +13,7 @@ class Property
 {
 
 public:
-    virtual AssignedProperty<I, O> operator=(I &&value) noexcept;
+    virtual AssignedProperty<I, O> operator=(I &&value) noexcept {};
 };
 
 template <typename I, typename O>
@@ -23,14 +23,16 @@ class AssignedProperty
     Property<I, O> &target;
     O value;
 
-    AssignedProperty(Property<I, O> &target, O &&value);
+public:
+    template <typename U>
+    AssignedProperty(Property<I, O> &target, U &&value);
 };
 template <typename T>
-Property<T, T> &&required() noexcept;
-
+Property<T, T> required() noexcept;
 template <typename T>
-Property<T, std::optional<T>> &&optional() noexcept;
-
+Property<T, std::optional<T>> optional() noexcept;
 template <typename T>
-Property<T, T> &&fallback(T &&value) noexcept;
+Property<T, T> fallback(T &&fallback_value) noexcept;
 } // namespace spaic::props
+
+#include <spaic/detail/Property.hpp>
\ No newline at end of file
diff --git a/include/spaic/State.hpp b/include/spaic/State.hpp
index 848e66d..0947d40 100644
--- a/include/spaic/State.hpp
+++ b/include/spaic/State.hpp
@@ -8,7 +8,8 @@ class State
 public:
     State() {}
 
-    // todo:
     T &operator*();
 };
 } // namespace spaic::state
+
+#include <spaic/detail/State.hpp>
\ No newline at end of file
diff --git a/include/spaic/VNode.hpp b/include/spaic/VNode.hpp
index bc22a2a..f286aa4 100644
--- a/include/spaic/VNode.hpp
+++ b/include/spaic/VNode.hpp
@@ -6,6 +6,7 @@
 
 namespace spaic::vnode
 {
+// TODO: Array of VNode should be VNode.
 using VNode = std::variant<
     std::string,
     std::nullptr_t,
diff --git a/include/spaic/detail/Component.hpp b/include/spaic/detail/Component.hpp
new file mode 100644
index 0000000..db41b7b
--- /dev/null
+++ b/include/spaic/detail/Component.hpp
@@ -0,0 +1,27 @@
+#pragma once
+
+#include <functional>
+#include <variant>
+#include <spaic/VNode.hpp>
+#include <spaic/Property.hpp>
+#include <spaic/State.hpp>
+
+namespace spaic::comp
+{
+spaic::vnode::VNode ComponentBody::operator()(spaic::vnode::VNode children...) noexcept
+{
+    throw "TODO: ComponentBody::operator()(children)";
+}
+
+template <typename Props>
+template <typename... T>
+ComponentBody Component<Props>::operator()(T... args) noexcept
+{
+    throw "TODO: Component::operator()(args)";
+}
+template <typename Props, typename StateSet>
+Component<Props> create_component(Props props, StateSet state, Update update, Render render)
+{
+    throw "TODO: create_component(props, state, update, render)";
+}
+} // namespace spaic::comp
diff --git a/include/spaic/detail/Message.hpp b/include/spaic/detail/Message.hpp
new file mode 100644
index 0000000..cf523bd
--- /dev/null
+++ b/include/spaic/detail/Message.hpp
@@ -0,0 +1,22 @@
+#pragma once
+
+#include <tuple>
+#include <spaic/Message.hpp>
+
+namespace spaic::msg
+{
+
+template <typename... T>
+Message<T...>::operator bool()
+{
+    throw "TODO: Message::operator bool()";
+}
+
+template <typename... T>
+template <size_t I>
+typename std::tuple_element<I, std::tuple<T...>>::type Message<T...>::get()
+{
+    throw "TODO: Message::get<I>()";
+}
+
+} // namespace spaic::msg
diff --git a/include/spaic/detail/Property.hpp b/include/spaic/detail/Property.hpp
new file mode 100644
index 0000000..ffea73b
--- /dev/null
+++ b/include/spaic/detail/Property.hpp
@@ -0,0 +1,63 @@
+#pragma once
+
+#include <optional>
+#include <spaic/Property.hpp>
+
+namespace spaic::props
+{
+
+template <typename T>
+class Required : public Property<T, T>
+{
+public:
+    AssignedProperty<T, T> operator=(T &&value) noexcept
+    {
+        return AssignedProperty(*this, value);
+    };
+};
+template <typename T>
+class Optional : public Property<T, std::optional<T>>
+{
+public:
+    AssignedProperty<T, std::optional<T>> operator=(T &&value) noexcept
+    {
+        return AssignedProperty(*this, std::optional(value));
+    };
+};
+template <typename T>
+class Fallback : public Property<T, T>
+{
+private:
+    T m_fallback_value;
+
+public:
+    template <typename U>
+    Fallback(U &&fallback_value) : m_fallback_value(std::forward<U>(fallback_value))
+    {
+    }
+    AssignedProperty<T, T> operator=(T &&value) noexcept
+    {
+        return AssignedProperty(*this, value);
+    };
+};
+
+template <typename I, typename O>
+template <typename U>
+AssignedProperty<I, O>::AssignedProperty(Property<I, O> &target, U &&value) : target(target), value(std::forward<U>(value)) {}
+
+template <typename T>
+Property<T, T> required() noexcept
+{
+    return Required<T>();
+}
+template <typename T>
+Property<T, std::optional<T>> optional() noexcept
+{
+    return Optional<T>();
+}
+template <typename T>
+Property<T, T> fallback(T &&fallback_value) noexcept
+{
+    return Fallback<T>(fallback_value);
+}
+} // namespace spaic::props
diff --git a/include/spaic/detail/State.hpp b/include/spaic/detail/State.hpp
new file mode 100644
index 0000000..e16ef75
--- /dev/null
+++ b/include/spaic/detail/State.hpp
@@ -0,0 +1,14 @@
+#pragma once
+
+#include <spaic/State.hpp>
+
+namespace spaic::state
+{
+
+template <typename T>
+T &State<T>::operator*()
+{
+    throw "TODO: State::operator*()";
+}
+
+} // namespace spaic::state
diff --git a/src/spaic-css/CMakeLists.txt b/src/spaic-css/CMakeLists.txt
index 4362780..7a7dbd1 100644
--- a/src/spaic-css/CMakeLists.txt
+++ b/src/spaic-css/CMakeLists.txt
@@ -8,6 +8,7 @@ set(CMAKE_CXX_EXTENSIONS OFF)
 
 include_directories("../../include/")
 file(GLOB_RECURSE SOURCE_LIST "./*.cpp")
+list(FILTER SOURCE_LIST EXCLUDE REGEX "CMakeCXXCompilerId.cpp$")
 set(CMAKE_RUNTIME_OUTPUT_DIRECTORY "../../bin")
 
 add_library(${PROJECT_NAME} STATIC ${SOURCE_LIST})
diff --git a/src/spaic/CMakeLists.txt b/src/spaic/CMakeLists.txt
index 4ce38d1..69dac14 100644
--- a/src/spaic/CMakeLists.txt
+++ b/src/spaic/CMakeLists.txt
@@ -8,6 +8,7 @@ set(CMAKE_CXX_EXTENSIONS OFF)
 
 include_directories("../../include/")
 file(GLOB_RECURSE SOURCE_LIST "./*.cpp")
+list(FILTER SOURCE_LIST EXCLUDE REGEX "CMakeCXXCompilerId.cpp$")
 set(CMAKE_RUNTIME_OUTPUT_DIRECTORY "../../bin")
 
 add_library(${PROJECT_NAME} STATIC ${SOURCE_LIST})
diff --git a/src/spaic/Property.cpp b/src/spaic/Property.cpp
index 37047ba..6af2406 100644
--- a/src/spaic/Property.cpp
+++ b/src/spaic/Property.cpp
@@ -4,52 +4,4 @@
 
 namespace spaic::props
 {
-template <typename T>
-class Required : Property<T, T>
-{
-public:
-    AssignedProperty<T, T> operator=(T &&value) noexcept
-    {
-        return std::move(new AssignedProperty(&this, value));
-    };
-};
-template <typename T>
-class Optional : Property<T, std::optional<T>>
-{
-public:
-    AssignedProperty<T, std::optional<T>> operator=(T &&value) noexcept
-    {
-        return std::move(new AssignedProperty(&this, std::optional(value)));
-    };
-};
-template <typename T>
-class Fallback : Property<T, T>
-{
-private:
-    T &&m_fallback_value;
-
-public:
-    Fallback(T &&fallback_value) : m_fallback_value(fallback_value)
-    {
-    }
-    AssignedProperty<T, T> operator=(T &&value) noexcept
-    {
-        return std::move(new AssignedProperty(&this, value));
-    };
-};
-template <typename T>
-Property<T, T> &&required() noexcept
-{
-    return std::move(Required<T>());
-}
-template <typename T>
-Property<T, std::optional<T>> &&optional() noexcept
-{
-    return std::move(Optional<T>());
-}
-template <typename T>
-Property<T, T> &&fallback(T &&fallback_value) noexcept
-{
-    return std::move(Fallback<T>(fallback_value));
-}
 } // namespace spaic::props