<link xmlns="http://www.w3.org/1999/xhtml" href="https://fonts.googleapis.com/css?family=Ultra" rel="stylesheet" type="text/css" />
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="600" height="100">
  <defs>
    <link xmlns="http://www.w3.org/1999/xhtml" href="https://fonts.googleapis.com/css?family=Ultra" rel="stylesheet" type="text/css" />
    <style type="text/css">
      <![CDATA[   

      ::selection {
        background: black;
      }

      ::-moz-selection {
        background: black;
      }


      .filtered{
        filter: url(#filter);
        fill: black;
        font-family: 'Ultra', serif;
        font-size: 100px;
      }
      ]]>

    </style>
    <filter id="filter">
      <feFlood flood-color="#FF0000" flood-opacity="0.5" result="RED" />
      <feFlood flood-color="#00FF00" flood-opacity="0.5" result="GREEN" />
      <feFlood flood-color="#0000FF" flood-opacity="0.5" result="BLUE" />
      <feComposite operator="in" in="RED" in2="SourceAlpha" result="RED_TEXT"/>
      <feComposite operator="in" in="GREEN" in2="SourceAlpha" result="GREEN_TEXT"/>
      <feComposite operator="in" in="BLUE" in2="SourceAlpha" result="BLUE_TEXT"/>
      <feOffset in="RED_TEXT" dx="-15" dy="0" result="RED_TEXT_OFF"/>
      <feOffset in="GREEN_TEXT" dx="15" dy="0"  result="GREEN_TEXT_OFF"/>
      <feOffset in="BLUE_TEXT" dx="0" dy="0"  result="BLUE_TEXT_OFF"/>
      <feMerge>
              <feMergeNode in="RED_TEXT_OFF" />
              <feMergeNode in="GREEN_TEXT_OFF"/>
              <feMergeNode in="BLUE_TEXT_OFF"/>
      </feMerge>
    </filter>
  </defs>
  <text class="filtered" x="20" y="85">Off Set.</text>
</svg>