diff --git a/modules/color/color.admin-rtl.css b/modules/color/color.admin-rtl.css
new file mode 100644
index 0000000..1cacb2e
--- /dev/null
+++ b/modules/color/color.admin-rtl.css
@@ -0,0 +1,43 @@
+#placeholder {
+  left: 0;
+  right: auto;
+}
+
+/* Palette */
+.color-form .form-item {
+  padding-left: 0;
+  padding-right: 1em;
+}
+.color-form label {
+  float: right;
+  clear: right;
+}
+.color-form .form-text,
+.color-form .form-select {
+  float: right;
+}
+.color-form .form-text {
+  margin-right: 0;
+  margin-left: 5px;
+}
+#palette .hook {
+  float: right;
+}
+#palette .down,
+#palette .up,
+#palette .both {
+  background: url(images/hook-rtl.png) no-repeat 0 0;
+}
+#palette .up {
+  background-position: 0 -27px;
+}
+#palette .both {
+  background-position: 0 -54px;
+}
+#palette .lock {
+  float: right;
+  right: -10px;
+}
+html.js #preview {
+  float: right;
+}
diff --git a/modules/color/color.admin.css b/modules/color/color.admin.css
new file mode 100644
index 0000000..e513dad
--- /dev/null
+++ b/modules/color/color.admin.css
@@ -0,0 +1,81 @@
+
+/* Farbtastic placement */
+.color-form {
+  max-width: 50em;
+  position: relative;
+}
+#placeholder {
+  position: absolute;
+  top: 0;
+  right: 0; /* LTR */
+}
+
+/* Palette */
+.color-form .form-item {
+  height: 2em;
+  line-height: 2em;
+  padding-left: 1em; /* LTR */
+  margin: 0.5em 0;
+}
+.color-form label {
+  float: left; /* LTR */
+  clear: left; /* LTR */
+  width: 10em;
+}
+.color-form .form-text,
+.color-form .form-select {
+  float: left; /* LTR */
+}
+.color-form .form-text {
+  text-align: center;
+  margin-right: 5px; /* LTR */
+  cursor: pointer;
+}
+
+#palette .hook {
+  float: left; /* LTR */
+  margin-top: 3px;
+  width: 16px;
+  height: 16px;
+}
+#palette .down,
+#palette .up,
+#palette .both {
+  background: url(images/hook.png) no-repeat 100% 0; /* LTR */
+}
+#palette .up {
+  background-position: 100% -27px; /* LTR */
+}
+#palette .both {
+  background-position: 100% -54px; /* LTR */
+}
+
+#palette .lock {
+  float: left; /* LTR */
+  position: relative;
+  top: -1.4em;
+  left: -10px; /* LTR */
+  width: 20px;
+  height: 25px;
+  background: url(images/lock.png) no-repeat 50% 2px;
+  cursor: pointer;
+}
+#palette .unlocked {
+  background-position: 50% -22px;
+}
+#palette .form-item {
+  width: 20em;
+}
+#palette .item-selected {
+  background: #eee;
+}
+
+/* Preview */
+#preview {
+  display: none;
+}
+html.js #preview {
+  display: block;
+  position: relative;
+  float: left; /* LTR */
+}