<svg viewbox="0 0 700 225">
    <clipPath id="textClip" class="filled-heading">
        <text y="70">We are</text>
        <text y="140">Creators</text>
        <text y="210">+Innovators</text>
        
        <text y="70">We are</text>
        <text y="140">Movers</text>
        <text y="210">+Shakers</text>

        <text y="70">We are</text>
        <text y="140">Stylish</text>
        <text y="210">+Techy</text>
    </clipPath>
    
    <g id="background" clip-path="url(#textClip)">
        <path d="m108.51 198.24c-68.576 21.595-114.17 57.226-104.72 2.8714 9.4539-54.355 8.8929 15.643-2.562-21.478-11.455-37.122 36.826-87.851 52.189-57.786 15.362 30.066 3.0926-35.052 57.465 2.1231 54.373 37.175 26.891 0.19388 14.227 40.632-12.664 40.438-1.8729 29-16.602 33.638z" fill="#4e8cff" stroke-width="0"/>
        <path d="m674.85 1.3643c7.6071 35.587 1.2164 57.949 39.639 89.576 38.422 31.627-23.024 49.992-73.441 43.721 1.7405 2.1019-32.888 63.815-38.042-72.07-0.67588-46.479 64.237-96.813 71.844-61.227z" fill="#ffbe4e" stroke-width="0"/>
        <path d="m100.74 242.53c-43.428 33.95-50.214-121.92 16.161-118.97 66.376 2.9548 56.817-28.557 102.44-2.8635 45.62 25.694-31.239 58.396 26.69 41.251 57.929-17.144 51.753 1.7768 65.448 35.313 13.695 33.536-89.181-4.3226-123.31 18.987-34.124 23.31-44.003-7.6694-87.432 26.281z" fill="#4ee7ff" stroke-width="0"/>
        <path d="m340.46 112.61c-3.9639 15.799 78.413 55.088-23.068 60.76-114.26 6.386-84.813 12.838-99.843-6.4874-28.307-36.397-22.793-32.755 42.602-87.885 65.395-55.13-30.417 21.512-21.859-40.612 8.5586-62.123-10.65-19.182 77.451-39.445 88.101-20.263 46.189 28.092 24.718 113.67z" fill="#e7ff4e" stroke-width="0"/>
        <path d="m8.8117-5.3718c44.016 17.435-9.7209 57.103 44.026 51.05 53.747-6.0529 46.214-20.928 51.757 21.703 5.5426 42.631-45.65 60.508-93.082 29.237-47.432-31.271 47.851-13.883 0.6852 13.87-47.166 27.753-15.522-48.2-11.667-81.328 3.855-33.128-35.736-51.966 8.2798-34.531z" fill="#e7ff4e" stroke-width="0"/>
        <path d="m165.6 88.767c61.136 62.823 35.015 40.577-46.096 51.296-81.112 10.719 42.189 6.2343-36.228 43.575-78.417 37.341-152.25 22.876-89.784-72.819 62.465-95.694 5.1128 29.277 92.934-3.0729 87.821-32.35 101.44 1.946 84.294 51.483-17.145 49.537-66.256-133.29-5.1201-70.463z" fill="#ff664e" stroke-width="0"/>
        <path d="m433.01 37.746c24.598-43.188-14.973 103.95 14.584 51.296 10.481-103.41 99.772 14.333 75.403 24.563-61.833 24.535-22.985 7.311-25.484 60.353-2.4986 53.042-77.838 25.441-90.466-37.041-12.628-62.482 25.962-99.171 25.962-99.171z" fill="#664eff" stroke-width="0"/>
        <path d="m183.13 65.878c18.642-53.437-40.63-33.913 5.3102-57.185 45.94-23.273 34.028 18.436 65.703-25.409 31.675-43.845 33.531 41.827 7.5587 63.954-25.973 22.126 33.664-12.385 30.057 31.281-3.0714 37.175-65.218 43.012-87.591 43.643-22.373 0.63069-39.679-2.8459-21.038-56.283z" fill="#ffbe4e" stroke-width="0"/>
        <path d="m141.35 98.623c-56.55-10.762-30.733 53.499-74.432 14.751-43.699-38.748-2.1148-57.263 41.995-55.804 44.11 1.4597-40.712 64.536-8.6373-11.945 32.075-76.481 51.99-53.221 61.672 3.2503 68.003-10.901 46.152 62.999-20.597 49.748z" fill="#ff4e8f" stroke-width="0"/>
        <path d="m598.05 194.59c-32.463 1.6396-48.632-32.651-75.231-3.8193-26.599 28.831-35.331 25.417-38.068-38.95-2.7373-64.368 58.587-17.897 15.895-79.84-42.692-61.943 104.51 53.226 157.19 45.068 52.675-8.1579-5.6907 11.387 21.97 54.403 27.66 43.016-49.29 21.499-81.753 23.139z" fill="#4ee7ff" stroke-width="0"/>
        <path d="m389.89 224.94c-55.339 19.152-109.12-63.021-77.6-62.249 16.441 0.40266 47.033 30.564 23.193-21.802-23.84-52.366 22.736-155.3 52.446-144.12 29.709 11.174 25.002 193.39 47.319 194.89 14.06 62.221-10.711 21.763-45.358 33.284z" fill="#4e8cff" stroke-width="0"/>
        <path d="m642.4 1.4488c8.0908 53.053 5.8003 84.97-23.571 93.321-29.371 8.3517 31.584 28.449-48.193 7.544-79.777-20.905-9.3306-76.792-65.575-47.022-35.947-62.504 95.618-62.534 108.35-65.828 53.543-14.24 20.899-41.068 28.989 11.985z" fill="#8fff4e" stroke-width="0"/>
        <path d="m147.32 57.816c-10.567-21.53-38.49-61.589-46.613-4.5724-9.9808 70.063-89.462-14.784-95.052-51.308-5.5894-36.523 67.904 4.7347 103.17-5.7093 35.27-10.444 75.212-34.432 90.247 30.71 15.035 65.143-29.389-0.21051 6.8358 18.603 36.225 18.813-34.527 61.31-58.593 12.276z" fill="#4eff66" stroke-width="0"/>
        <path d="m395.36 39.277c-14.078-38.016-9.6195-43.2 21.428-52.883s45.105 40.379 63.729 14.036c18.624-26.343 26.366 9.3188 38.32 35.184 125.69 20.885 44.277 30.59-45.168 47.901-30.824 8.4535-28.678 67.18-62.508-1.5712-12.772-25.957 0 0-15.8-42.667z" fill="#ff664e" stroke-width="0"/>
        <path d="m550.76 177.74c37.61 3.1772 52.837-62.124 55.775-30.206 2.9376 31.918 24.291 87.868-33.716 105.84-58.007 17.967 16.158-58.542-31.319-21.444-47.477 37.098-128.02 26.817-125.51-38.454 2.5098-65.271 58.923-25.209 84.786-7.8162 25.863 17.392 12.372-11.092 49.982-7.9151z" fill="#ff4e8f" stroke-width="0"/>
        <path d="m598.05 190.59c43.319-15.087 90.958-113.59 101.34-92.047 10.377 21.543 2.7233 60.627-8.4086 112.73-11.132 52.101-37.759-11.405-48.075 13.405 0.0273 5.8999-95.091-16.654-44.852-34.086z" fill="#e7ff4e" stroke-width="0"/>
        <path d="m311.01 154.14c3.7548 34.833 51.465 68.255 10.938 69.17-46.302 1.4813-28.726 7.7236-59.49 12.096-30.764 4.3729-139.76-30.084-110.17-49.861 29.593-19.777 31.604 24.454 34.672 2.7296 3.0688-21.725 58.195-19.481 124.05-34.135z" fill="#4eff66" stroke-width="0"/>
    </g>
</svg>
/* Basic styling */
svg {
    width: 100%;
}
.filled-heading {
    text-transform: uppercase;
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 5em;
    line-height: 0.9;
}

/* Animate the background shapes */
#background path {
    animation: pulse 4s cubic-bezier(0.455, 0.030, 0.515, 0.955) infinite;
    
    /* Necessary to keep the SVG objects in place while scaling */
    transform-origin: 50% 50%;
    transform-box: fill-box;
}

/* Reveal the desired lines of text in the desired order */
#textClip text:nth-of-type(n + 1):nth-of-type(-n + 3) {
    animation: showFirst 12s infinite;
}
#textClip text:nth-of-type(n + 4):nth-of-type(-n + 6) {
    animation: showSecond 12s infinite;
}
#textClip text:nth-of-type(n + 7):nth-of-type(-n + 9) {
    animation: showThird 12s infinite;
}

@keyframes pulse {
    /* Rotating it along with the scale makes it a little bit more fancy */
    0%, 100% { transform: scale(0) rotate(33deg); }
    35%, 65% { transform: scale(1) rotate(0deg); }
}
@keyframes showFirst {
    0%, 33% {
        opacity: 1;
    }
    33.0001%, 100% { opacity: 0; }
}
@keyframes showSecond {
    33.0001%, 66% {
        opacity: 1;
    }
    0%, 33%, 66.0001%, 100% { opacity: 0; }
}
@keyframes showThird {
    66.0001%, 99.999% {
        opacity: 1;
    }
    0%, 66%, 100% { opacity: 0; }
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.