diff --git a/web/app/components/comment/__vote/_selected/comment__vote_selected.scss b/web/app/components/comment/__vote/_selected/comment__vote_selected.scss
index c501ce38..41d8cdce 100644
--- a/web/app/components/comment/__vote/_selected/comment__vote_selected.scss
+++ b/web/app/components/comment/__vote/_selected/comment__vote_selected.scss
@@ -1,4 +1,4 @@
 .comment__vote_selected {
-  border-top-color: #00aaaa;
+  border-top-color: #0aa;
   cursor: default;
 }
diff --git a/web/app/components/comment/__vote/comment__vote.scss b/web/app/components/comment/__vote/comment__vote.scss
index cca58823..5e578d08 100644
--- a/web/app/components/comment/__vote/comment__vote.scss
+++ b/web/app/components/comment/__vote/comment__vote.scss
@@ -8,6 +8,6 @@
   cursor: pointer;
 
   &:hover {
-    border-top-color: #00aaaa;
+    border-top-color: #0aa;
   }
 }
diff --git a/web/app/components/comment/_marked/comment_marked.scss b/web/app/components/comment/_marked/comment_marked.scss
new file mode 100644
index 00000000..dc66b124
--- /dev/null
+++ b/web/app/components/comment/_marked/comment_marked.scss
@@ -0,0 +1,9 @@
+@import 'common/variables';
+
+.comment_marked {
+  &, &.comment_view_admin {
+    .comment__username {
+      font-weight: 700;
+    }
+  }
+}
diff --git a/web/app/components/comment/_pinned/comment_pinned.scss b/web/app/components/comment/_pinned/comment_pinned.scss
deleted file mode 100644
index f21be6bc..00000000
--- a/web/app/components/comment/_pinned/comment_pinned.scss
+++ /dev/null
@@ -1,7 +0,0 @@
-.comment_pinned {
-  &, &.comment_view_admin {
-    .comment__username {
-      color: #FFD700;
-    }
-  }
-}
diff --git a/web/app/components/comment/comment.jsx b/web/app/components/comment/comment.jsx
index 7195286a..c4f79990 100644
--- a/web/app/components/comment/comment.jsx
+++ b/web/app/components/comment/comment.jsx
@@ -65,7 +65,7 @@ export default class Comment extends Component {
 
     this.setState({ pinned: false });
 
-    api.pin({ id, url }).then(() => {
+    api.unpin({ id, url }).then(() => {
       api.getComment({ id }).then(comment => store.replaceComment(comment));
     });
   }
@@ -144,6 +144,7 @@ export default class Comment extends Component {
     // TODO: add smth that will count 'hours ago' (mb this: https://github.com/catamphetamine/javascript-time-ago)
     // TODO: check out stash's impl;
     // TODO: don't forget about optional locales, m?
+    // TODO: also date must be a link to the comment
     const timeStr = `${time.toLocaleDateString([], { month: 'short', day: 'numeric' })}, ${time.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}`;
     const o = {
       ...data,
@@ -155,7 +156,7 @@ export default class Comment extends Component {
     };
 
     const defaultMods = {
-      pinned,
+      marked: mods.pinned ? null : pinned,
       // TODO: add default view mod or don't?
       view: o.user.admin ? 'admin' : null,
     };
@@ -184,9 +185,13 @@ export default class Comment extends Component {
 
               <span className="comment__time">{o.time}</span>
 
-              <span className="comment__controls">
-                <span className="comment__action" onClick={this.onReplyClick}>reply</span>
-              </span>
+              {
+                !mods.pinned && (
+                  <span className="comment__controls">
+                    <span className="comment__action" onClick={this.onReplyClick}>reply</span>
+                  </span>
+                )
+              }
 
               {
                 isAdmin &&
diff --git a/web/app/components/comment/index.js b/web/app/components/comment/index.js
index 81cfc497..9a5eee85 100644
--- a/web/app/components/comment/index.js
+++ b/web/app/components/comment/index.js
@@ -25,6 +25,6 @@ require('./__vote/_type/_up/comment__vote_type_up.scss');
 
 require('./_level/comment_level.scss');
 
-require('./_pinned/comment_pinned.scss');
+require('./_marked/comment_marked.scss');
 
 require('./_view/_admin/comment_view_admin.scss');
diff --git a/web/app/components/root/__pinned-comment/root__pinned-comment.scss b/web/app/components/root/__pinned-comment/root__pinned-comment.scss
new file mode 100644
index 00000000..208448cb
--- /dev/null
+++ b/web/app/components/root/__pinned-comment/root__pinned-comment.scss
@@ -0,0 +1,5 @@
+.root__pinned-comment {
+  &:last-child {
+    margin-bottom: 0;
+  }
+}
diff --git a/web/app/components/root/__pinned-comments/root__pinned-comments.scss b/web/app/components/root/__pinned-comments/root__pinned-comments.scss
new file mode 100644
index 00000000..9247668e
--- /dev/null
+++ b/web/app/components/root/__pinned-comments/root__pinned-comments.scss
@@ -0,0 +1,8 @@
+@import 'common/variables';
+
+.root__pinned-comments {
+  margin-bottom: $offset * 2;
+  padding: ($offset / 3) ($offset / 2);
+  border: 3px solid #0aa;
+  border-radius: 4px;
+}
diff --git a/web/app/components/root/index.js b/web/app/components/root/index.js
index 75ce872d..7cc8f9c7 100644
--- a/web/app/components/root/index.js
+++ b/web/app/components/root/index.js
@@ -1,6 +1,8 @@
 export { default } from './root';
 
 require('./__input/root__input.scss');
+require('./__pinned-comment/root__pinned-comment.scss');
+require('./__pinned-comments/root__pinned-comments.scss');
 require('./__thread/root__thread.scss');
 
 require('./_loading/root_loading.scss');
diff --git a/web/app/components/root/root.jsx b/web/app/components/root/root.jsx
index 7f51fc19..cc10b8a3 100644
--- a/web/app/components/root/root.jsx
+++ b/web/app/components/root/root.jsx
@@ -4,6 +4,7 @@ import api from 'common/api';
 import { url, id } from 'common/settings';
 import store from 'common/store';
 
+import Comment from 'components/comment';
 import Input from 'components/input';
 import Thread from 'components/thread';
 
@@ -51,11 +52,30 @@ export default class Root extends Component {
       );
     }
 
+    // TODO: i think we should do it on backend
+    const pinnedComments = store.getPinnedComments();
+
     return (
       <div id={id}>
         <div className="root root__loading" id={id}>
           <Input mix="root__input" onSubmit={this.addComment}/>
 
+          {
+            !!pinnedComments.length && (
+              <div className="root__pinned-comments">
+                {
+                  pinnedComments.map(comment => (
+                    <Comment
+                      data={comment}
+                      mods={{ level: 0, pinned: true }}
+                      mix="root__pinned-comment"
+                    />
+                  ))
+                }
+              </div>
+            )
+          }
+
           {
             comments.map(thread => (
               <Thread