Real-time Preview Enabled Semantic UI Composer

Copy the following Semantic-UI markup to Semantic Edit editor.

<div class="ui card">
  <div class="image">
    <img src="http://semantic-ui.com/images/avatar2/large/kristy.png">
  </div>
  <div class="content">
    <a class="header">Kristy</a>
    <div class="meta">
      <span class="date">Joined in 2013</span>
    </div>
    <div class="description">
      Kristy is an art director living in New York.
    </div>
  </div>
  <div class="extra content">
    <a>
      <i class="user icon"></i>
      22 Friends
    </a>
  </div>
</div>

You could copy and paste any Semantic UI components.

Semantic UI is an awesome library with excellent components that you can use to quickly build web interfaces. But I felt like it would be nicer if we can compose bunch of elements and see in realtime how they fit together. That's why Semantic Edit.

• Beautifier

JavaScript!

SemanticEdit uses the following

• Semantic UI
• React JS
• WebPack Build System
• Ace Editor & react-ace

I'm hoping to add features as I move along. Got a feature suggestion? Would love to hear about it. Please create a new issues.

• Follow us @SemanticEdit