Sort

Example 4: Multi sort option with Combine

Sort by 4 different sorting options with the Combine component

See Finsweet
Walkthrough

What we will cover

  • The structure of our CMS Collection List

  • Sorting by text within the collection by applying a class to the text

  • Structure of a class and data-attribute on our sort button

  • The .sort() component to make the Collection List sortable by multiple sorting options

  • An explanation of the difference between sortReverse true vs. false

Sort by multiple value
Sort by Project Number
Sort by Color
Sort by Year
Sort by Service
Project 1
2019
Blue
Fun
used cms true

Branding, Web Design

Project 2
2020
Blue
Fun
used cms false

Branding

Project 3
2017
Red
Not fun
used cms true

Web Design

Project 4
2018
Yellow
Not fun
used cms false

Development

Project 5
2018
Green
Fun
used cms true

Development

Project 6
2018
Blue
Not fun
used cms false

Motion Graphics

Project 7
2019
Blue
Fun
used cms true

Branding

Project 8
2020
Yellow
Fun
used cms false

Web Design

Project 9
2020
Orange
Fun
used cms true

Web Design, Development

Project 10
2020
Green
Not fun
used cms false

Web Design, Development

Project 11
2019
Yellow
Not fun
used cms true

Strategy Consulting

Project 12
2017
Red
Not fun
used cms false

Web Design, Development

Project 13
2019
Red
Not fun
used cms true

Web Design

Project 14
2020
Red
Fun
used cms false

Strategy Consulting

Project 15
2017
Blue
Fun
used cms true

Branding, Motion Graphics

Project 16
2018
Blue
Not fun
used cms false

Branding, Web Design

Project 17
2018
Blue
Fun
used cms true

Strategy Consulting

Project 18
2018
Red
Fun
used cms false

Branding, Web Design

Project 19
2019
Yellow
Fun
used cms true

Branding, Web Design

Project 20
2020
Green
Not fun
used cms false

Branding, Web Design

Project 21
2020
Blue
Not fun
used cms true

Branding, Strategy Consulting

Project 22
2020
Blue
Fun
used cms false

Branding, Strategy Consulting

Project 23
2019
Yellow
Not fun
used cms true

Motion Graphics

Project 24
2017
Orange
Fun
used cms false

Motion Graphics

Project 25
2019
Green
Fun
used cms true

Branding, Web Design

Project 26
2020
Yellow
Fun
used cms false

Branding

Project 27
2017
Red
Not fun
used cms true

Web Design

Project 28
2018
Red
Not fun
used cms false

Development

Project 29
2018
Red
Not fun
used cms true

Development

Project 30
2018
Blue
Not fun
used cms false

Motion Graphics

Project 31
2019
Blue
Fun
used cms true

Branding

Project 32
2020
Blue
Fun
used cms false

Web Design

Project 33
2020
Red
Not fun
used cms true

Web Design, Development

Project 34
2020
Yellow
Fun
used cms false

Web Design, Development

Project 35
2019
Green
Fun
used cms true

Strategy Consulting

Project 36
2017
Blue
Fun
used cms false

Web Design, Development

Project 37
2019
Blue
Not fun
used cms true

Web Design

Project 38
2020
Yellow
Not fun
used cms false

Strategy Consulting

Project 39
2017
Orange
Fun
used cms true

Branding, Motion Graphics

Project 40
2018
Green
Not fun
used cms false

Branding, Web Design

Project 41
2018
Yellow
Fun
used cms true

Strategy Consulting

Project 42
2018
Red
Fun
used cms false

Branding, Web Design

Project 43
2019
Red
Fun
used cms true

Branding, Web Design

Project 44
2020
Red
Not fun
used cms false

Branding, Web Design

Project 45
2020
Blue
Not fun
used cms true

Branding, Strategy Consulting

Project 46
2020
Blue
Not fun
used cms false

Branding, Strategy Consulting

Project 47
2019
Blue
Not fun
used cms true

Motion Graphics

Project 48
2017
Red
Fun
used cms false

Motion Graphics

Project 49
2019
Yellow
Fun
used cms true

Branding, Web Design

Project 50
2020
Green
Not fun
used cms false

Branding

Project 51
2017
Blue
Fun
used cms true

Web Design

Project 52
2018
Blue
Fun
used cms false

Development

Project 53
2018
Yellow
Fun
used cms true

Development

Project 54
2018
Orange
Not fun
used cms false

Motion Graphics

Project 55
2019
Green
Not fun
used cms true

Branding

Project 56
2020
Yellow
Fun
used cms false

Web Design

Project 57
2020
Red
Not fun
used cms true

Web Design, Development

Project 58
2020
Red
Fun
used cms false

Web Design, Development

Project 59
2019
Red
Fun
used cms true

Strategy Consulting

Project 60
2017
Blue
Fun
used cms false

Web Design, Development

Project 61
2019
Blue
Not fun
used cms true

Web Design

Project 62
2020
Blue
Not fun
used cms false

Strategy Consulting

Project 63
2017
Red
Not fun
used cms true

Branding, Motion Graphics

Project 64
2018
Yellow
Not fun
used cms false

Branding, Web Design

Project 65
2018
Green
Fun
used cms true

Strategy Consulting

Project 66
2018
Blue
Fun
used cms false

Branding, Web Design

Project 67
2019
Blue
Not fun
used cms true

Branding, Web Design

Project 68
2020
Yellow
Fun
used cms false

Branding, Web Design

Project 69
2020
Orange
Fun
used cms true

Branding, Strategy Consulting

Project 70
2020
Green
Fun
used cms false

Branding, Strategy Consulting

Project 71
2019
Yellow
Not fun
used cms true

Motion Graphics

Project 72
2017
Red
Not fun
used cms false

Motion Graphics

Project 73
2019
Red
Fun
used cms true

Branding, Web Design

Project 74
2020
Red
Not fun
used cms false

Branding

Project 75
2017
Blue
Fun
used cms true

Web Design

Project 76
2018
Blue
Fun
used cms false

Development

Project 77
2018
Blue
Fun
used cms true

Development

Project 78
2018
Red
Not fun
used cms false

Motion Graphics

Project 79
2019
Yellow
Not fun
used cms true

Branding

Project 80
2020
Green
Not fun
used cms false

Web Design

Project 81
2020
Blue
Not fun
used cms true

Web Design, Development

Project 82
2020
Blue
Fun
used cms false

Web Design, Development

Project 83
2019
Yellow
Fun
used cms true

Strategy Consulting

Project 84
2017
Orange
Not fun
used cms false

Web Design, Development

Project 85
2019
Green
Fun
used cms true

Web Design

Project 86
2020
Yellow
Fun
used cms false

Strategy Consulting

Project 87
2017
Red
Fun
used cms true

Branding, Motion Graphics

Project 88
2018
Red
Not fun
used cms false

Branding, Web Design

Project 89
2018
Red
Not fun
used cms true

Strategy Consulting

Project 90
2018
Blue
Fun
used cms false

Branding, Web Design

Project 91
2019
Blue
Not fun
used cms true

Branding, Web Design

Project 92
2020
Blue
Fun
used cms false

Branding, Web Design

Project 93
2020
Red
Fun
used cms true

Branding, Strategy Consulting

Project 94
2020
Yellow
Fun
used cms false

Branding, Strategy Consulting

Project 95
2019
Green
Not fun
used cms true

Motion Graphics

Project 96
2017
Blue
Not fun
used cms false

Motion Graphics

Project 97
2019
Blue
Not fun
used cms true

Branding, Web Design

Project 98
2020
Yellow
Not fun
used cms false

Branding

Project 99
2017
Orange
Fun
used cms true

Web Design

Project 100
2018
Green
Fun
used cms false

Development

Project 101
2018
Yellow
Not fun
used cms true

Development

Project 102
2018
Red
Fun
used cms false

Motion Graphics

Project 103
2019
Red
Fun
used cms true

Branding

Project 104
2020
Red
Fun
used cms false

Web Design

Project 105
2020
Blue
Not fun
used cms true

Web Design, Development

Project 106
2020
Blue
Not fun
used cms false

Web Design, Development

Project 107
2019
Blue
Fun
used cms true

Strategy Consulting

Project 108
2017
Red
Not fun
used cms false

Web Design, Development

Project 109
2019
Yellow
Fun
used cms true

Web Design

Project 110
2020
Green
Fun
used cms false

Strategy Consulting

Project 111
2017
Blue
Fun
used cms true

Branding, Motion Graphics

Project 112
2018
Blue
Not fun
used cms false

Branding, Web Design

Project 113
2018
Yellow
Not fun
used cms true

Strategy Consulting

Project 114
2018
Orange
Not fun
used cms false

Branding, Web Design

Project 115
2019
Green
Not fun
used cms true

Branding, Web Design

Project 116
2020
Yellow
Fun
used cms false

Branding, Web Design

Project 117
2020
Red
Fun
used cms true

Branding, Strategy Consulting

Project 118
2020
Red
Not fun
used cms false

Branding, Strategy Consulting

Project 119
2019
Red
Fun
used cms true

Motion Graphics

Project 120
2017
Blue
Fun
used cms false

Motion Graphics

Project 121
2019
Blue
Fun
used cms true

Branding, Web Design

Project 122
2020
Blue
Not fun
used cms false

Branding

Project 123
2017
Red
Not fun
used cms true

Web Design

Project 124
2018
Yellow
Fun
used cms false

Development

Project 125
2018
Green
Not fun
used cms true

Development

Project 126
2018
Blue
Fun
used cms false

Motion Graphics

Project 127
2019
Blue
Fun
used cms true

Branding

Project 128
2020
Yellow
Fun
used cms false

Web Design

Project 129
2020
Orange
Not fun
used cms true

Web Design, Development

Project 130
2020
Green
Not fun
used cms false

Web Design, Development

Project 131
2019
Yellow
Not fun
used cms true

Strategy Consulting

Project 132
2017
Red
Not fun
used cms false

Web Design, Development

Project 133
2019
Red
Fun
used cms true

Web Design

Project 134
2020
Red
Fun
used cms false

Strategy Consulting

Project 135
2017
Blue
Not fun
used cms true

Branding, Motion Graphics

Project 136
2018
Blue
Fun
used cms false

Branding, Web Design

Project 137
2018
Blue
Fun
used cms true

Strategy Consulting

Project 138
2018
Red
Fun
used cms false

Branding, Web Design

Project 139
2019
Yellow
Not fun
used cms true

Branding, Web Design

Project 140
2020
Green
Not fun
used cms false

Branding, Web Design

Project 141
2020
Blue
Fun
used cms true

Branding, Strategy Consulting

Project 142
2020
Blue
Not fun
used cms false

Branding, Strategy Consulting

Project 143
2019
Yellow
Fun
used cms true

Motion Graphics

Project 144
2017
Orange
Fun
used cms false

Motion Graphics

Project 145
2019
Green
Fun
used cms true

Branding, Web Design

Project 146
2020
Yellow
Not fun
used cms false

Branding

Project 147
2017
Red
Not fun
used cms true

Web Design

Project 148
2018
Red
Not fun
used cms false

Development

Project 149
2018
Red
Not fun
used cms true

Development

Project 150
2018
Blue
Fun
used cms false

Motion Graphics

Project 151
2019
Blue
Fun
used cms true

Branding

Project 152
2020
Blue
Not fun
used cms false

Web Design

Project 153
2020
Red
Fun
used cms true

Web Design, Development

Project 154
2020
Yellow
Fun
used cms false

Web Design, Development

Project 155
2019
Green
Fun
used cms true

Strategy Consulting

Project 156
2017
Blue
Not fun
used cms false

Web Design, Development

Project 157
2019
Blue
Not fun
used cms true

Web Design

Project 158
2020
Yellow
Fun
used cms false

Strategy Consulting

Project 159
2017
Orange
Not fun
used cms true

Branding, Motion Graphics

Project 160
2018
Green
Fun
used cms false

Branding, Web Design

Project 161
2018
Yellow
Fun
used cms true

Strategy Consulting

Project 162
2018
Red
Fun
used cms false

Branding, Web Design

Project 163
2019
Red
Not fun
used cms true

Branding, Web Design

Project 164
2020
Red
Not fun
used cms false

Branding, Web Design

Project 165
2020
Blue
Not fun
used cms true

Branding, Strategy Consulting

Project 166
2020
Blue
Not fun
used cms false

Branding, Strategy Consulting

Project 167
2019
Blue
Fun
used cms true

Motion Graphics

Project 168
2017
Red
Fun
used cms false

Motion Graphics

Project 169
2019
Yellow
Not fun
used cms true

Branding, Web Design

Project 170
2020
Green
Fun
used cms false

Branding

Project 171
2017
Blue
Fun
used cms true

Web Design

Project 172
2018
Blue
Fun
used cms false

Development

Project 173
2018
Yellow
Not fun
used cms true

Development

Project 174
2018
Orange
Not fun
used cms false

Motion Graphics

Project 175
2019
Green
Fun
used cms true

Branding

Project 176
2020
Yellow
Not fun
used cms false

Web Design

Project 177
2020
Red
Fun
used cms true

Web Design, Development

Project 178
2020
Red
Fun
used cms false

Web Design, Development

Project 179
2019
Red
Fun
used cms true

Strategy Consulting

Project 180
2017
Blue
Not fun
used cms false

Web Design, Development

Project 181
2019
Blue
Not fun
used cms true

Web Design

Project 182
2020
Blue
Not fun
used cms false

Strategy Consulting

Project 183
2017
Red
Not fun
used cms true

Branding, Motion Graphics

Project 184
2018
Yellow
Fun
used cms false

Branding, Web Design

Project 185
2018
Green
Fun
used cms true

Strategy Consulting

Project 186
2018
Blue
Not fun
used cms false

Branding, Web Design

Project 187
2019
Blue
Fun
used cms true

Branding, Web Design

Project 188
2020
Yellow
Fun
used cms false

Branding, Web Design

Project 189
2020
Orange
Fun
used cms true

Branding, Strategy Consulting

Project 190
2020
Green
Not fun
used cms false

Branding, Strategy Consulting

Project 191
2019
Yellow
Not fun
used cms true

Motion Graphics

Project 192
2017
Red
Fun
used cms false

Motion Graphics

Project 193
2019
Red
Not fun
used cms true

Branding, Web Design

Project 194
2020
Red
Fun
used cms false

Branding

Project 195
2017
Blue
Fun
used cms true

Web Design

Project 196
2018
Blue
Fun
used cms false

Development

Project 197
2018
Blue
Not fun
used cms true

Development

Project 198
2018
Red
Not fun
used cms false

Motion Graphics

Project 199
2019
Yellow
Not fun
used cms true

Branding

Project 200
2020
Green
Not fun
used cms false

Web Design

Project 201
2020
Blue
Fun
used cms true

Web Design, Development

Project 202
2020
Blue
Fun
used cms false

Web Design, Development

Project 203
2019
Yellow
Not fun
used cms true

Strategy Consulting

Project 204
2017
Orange
Fun
used cms false

Web Design, Development

Project 205
2019
Green
Fun
used cms true

Web Design

Project 206
2020
Yellow
Fun
used cms false

Strategy Consulting

Project 207
2017
Red
Not fun
used cms true

Branding, Motion Graphics

Project 208
2018
Red
Not fun
used cms false

Branding, Web Design

Project 209
2018
Red
Fun
used cms true

Strategy Consulting

Project 210
2018
Blue
Not fun
used cms false

Branding, Web Design

Project 211
2019
Blue
Fun
used cms true

Branding, Web Design

Project 212
2020
Blue
Fun
used cms false

Branding, Web Design

Project 213
2020
Red
Fun
used cms true

Branding, Strategy Consulting

Project 214
2020
Yellow
Not fun
used cms false

Branding, Strategy Consulting

Project 215
2019
Green
Not fun
used cms true

Motion Graphics

Project 216
2017
Blue
Not fun
used cms false

Motion Graphics

Project 217
2019
Blue
Not fun
used cms true

Branding, Web Design

Project 218
2020
Yellow
Fun
used cms false

Branding

Project 219
2017
Orange
Fun
used cms true

Web Design

Project 220
2018
Green
Not fun
used cms false

Development

Project 221
2018
Yellow
Fun
used cms true

Development

Project 222
2018
Red
Fun
used cms false

Motion Graphics

Project 223
2019
Red
Fun
used cms true

Branding

Project 224
2020
Red
Not fun
used cms false

Web Design

Project 225
2020
Blue
Not fun
used cms true

Web Design, Development

Project 226
2020
Blue
Fun
used cms false

Web Design, Development

Project 227
2019
Blue
Not fun
used cms true

Strategy Consulting

Project 228
2017
Red
Fun
used cms false

Web Design, Development

Project 229
2019
Yellow
Fun
used cms true

Web Design

Project 230
2020
Green
Fun
used cms false

Strategy Consulting

Project 231
2017
Blue
Not fun
used cms true

Branding, Motion Graphics

Project 232
2018
Blue
Not fun
used cms false

Branding, Web Design

Project 233
2018
Yellow
Not fun
used cms true

Strategy Consulting

Project 234
2018
Orange
Not fun
used cms false

Branding, Web Design

Project 235
2019
Green
Fun
used cms true

Branding, Web Design

Project 236
2020
Yellow
Fun
used cms false

Branding, Web Design

Project 237
2020
Red
Not fun
used cms true

Branding, Strategy Consulting

Project 238
2020
Red
Fun
used cms false

Branding, Strategy Consulting

Project 239
2019
Red
Fun
used cms true

Motion Graphics

Project 240
2017
Blue
Fun
used cms false

Motion Graphics

Project 241
2019
Blue
Not fun
used cms true

Branding, Web Design

Project 242
2020
Blue
Not fun
used cms false

Branding

Project 243
2017
Red
Fun
used cms true

Web Design

Project 244
2018
Yellow
Not fun
used cms false

Development

Project 245
2018
Green
Fun
used cms true

Development

Project 246
2018
Blue
Fun
used cms false

Motion Graphics

Project 247
2019
Blue
Fun
used cms true

Branding

Project 248
2020
Yellow
Not fun
used cms false

Web Design

Project 249
2020
Orange
Not fun
used cms true

Web Design, Development

Project 250
2020
Green
Not fun
used cms false

Web Design, Development

Project 251
2019
Yellow
Not fun
used cms true

Strategy Consulting

Project 252
2017
Red
Fun
used cms false

Web Design, Development

Project 253
2019
Red
Fun
used cms true

Web Design

Project 254
2020
Red
Not fun
used cms false

Strategy Consulting

Project 255
2017
Blue
Fun
used cms true

Branding, Motion Graphics

Project 256
2018
Blue
Fun
used cms false

Branding, Web Design

Project 257
2018
Blue
Fun
used cms true

Strategy Consulting

Project 258
2018
Red
Not fun
used cms false

Branding, Web Design

Project 259
2019
Yellow
Not fun
used cms true

Branding, Web Design

Project 260
2020
Green
Fun
used cms false

Branding, Web Design

Project 261
2020
Blue
Not fun
used cms true

Branding, Strategy Consulting

Project 262
2020
Blue
Fun
used cms false

Branding, Strategy Consulting

Project 263
2019
Yellow
Fun
used cms true

Motion Graphics

Project 264
2017
Orange
Fun
used cms false

Motion Graphics

Project 265
2019
Green
Not fun
used cms true

Branding, Web Design

Project 266
2020
Yellow
Not fun
used cms false

Branding

Project 267
2017
Red
Not fun
used cms true

Web Design

Project 268
2018
Red
Not fun
used cms false

Development

Project 269
2018
Red
Fun
used cms true

Development

Project 270
2018
Blue
Fun
used cms false

Motion Graphics

Project 271
2019
Blue
Not fun
used cms true

Branding

Project 272
2020
Blue
Fun
used cms false

Web Design

Project 273
2020
Red
Fun
used cms true

Web Design, Development

Project 274
2020
Yellow
Fun
used cms false

Web Design, Development

Project 275
2019
Green
Not fun
used cms true

Strategy Consulting

Project 276
2017
Blue
Not fun
used cms false

Web Design, Development

Project 277
2019
Blue
Fun
used cms true

Web Design

Project 278
2020
Yellow
Not fun
used cms false

Strategy Consulting

Project 279
2017
Orange
Fun
used cms true

Branding, Motion Graphics

Project 280
2018
Green
Fun
used cms false

Branding, Web Design

Project 281
2018
Yellow
Fun
used cms true

Strategy Consulting

Project 282
2018
Red
Not fun
used cms false

Branding, Web Design

Project 283
2019
Red
Not fun
used cms true

Branding, Web Design

Project 284
2020
Red
Not fun
used cms false

Branding, Web Design

Project 285
2020
Blue
Not fun
used cms true

Branding, Strategy Consulting

Project 286
2020
Blue
Fun
used cms false

Branding, Strategy Consulting

Project 287
2019
Blue
Fun
used cms true

Motion Graphics

Project 288
2017
Red
Not fun
used cms false

Motion Graphics

Project 289
2019
Yellow
Fun
used cms true

Branding, Web Design

Project 290
2020
Green
Fun
used cms false

Branding

Project 291
2017
Blue
Fun
used cms true

Web Design

Project 292
2018
Blue
Not fun
used cms false

Development

Project 293
2018
Yellow
Not fun
used cms true

Development

Project 294
2018
Orange
Fun
used cms false

Motion Graphics

Project 295
2019
Green
Not fun
used cms true

Branding

Project 296
2020
Yellow
Fun
used cms false

Web Design

Project 297
2020
Red
Fun
used cms true

Web Design, Development

Project 298
2020
Red
Fun
used cms false

Web Design, Development

Project 299
2019
Red
Not fun
used cms true

Strategy Consulting

Project 300
2017
Blue
Not fun
used cms false

Web Design, Development

Project 301
2019
Blue
Not fun
used cms true

Web Design

Project 302
2020
Blue
Not fun
used cms false

Strategy Consulting

Project 303
2017
Red
Fun
used cms true

Branding, Motion Graphics

Project 304
2018
Yellow
Fun
used cms false

Branding, Web Design

Project 305
2018
Green
Not fun
used cms true

Strategy Consulting

Project 306
2018
Blue
Fun
used cms false

Branding, Web Design

Project 307
2019
Blue
Fun
used cms true

Branding, Web Design

Project 308
2020
Yellow
Fun
used cms false

Branding, Web Design

Project 309
2020
Orange
Not fun
used cms true

Branding, Strategy Consulting

Project 310
2020
Green
Not fun
used cms false

Branding, Strategy Consulting

Project 311
2019
Yellow
Fun
used cms true

Motion Graphics

Project 312
2017
Red
Not fun
used cms false

Motion Graphics

Project 313
2019
Red
Fun
used cms true

Branding, Web Design

Project 314
2020
Red
Fun
used cms false

Branding

Project 315
2017
Blue
Fun
used cms true

Web Design

Project 316
2018
Blue
Not fun
used cms false

Development

Project 317
2018
Blue
Not fun
used cms true

Development

Project 318
2018
Red
Not fun
used cms false

Motion Graphics

Project 319
2019
Yellow
Not fun
used cms true

Branding

Project 320
2020
Green
Fun
used cms false

Web Design

Project 321
2020
Blue
Fun
used cms true

Web Design, Development

Project 322
2020
Blue
Not fun
used cms false

Web Design, Development

Project 323
2019
Yellow
Fun
used cms true

Strategy Consulting

Project 324
2017
Orange
Fun
used cms false

Web Design, Development

Project 325
2019
Green
Fun
used cms true

Web Design

Project 326
2020
Yellow
Not fun
used cms false

Strategy Consulting

Project 327
2017
Red
Not fun
used cms true

Branding, Motion Graphics

Project 328
2018
Red
Fun
used cms false

Branding, Web Design

Project 329
2018
Red
Not fun
used cms true

Strategy Consulting

Project 330
2018
Blue
Fun
used cms false

Branding, Web Design

Project 331
2019
Blue
Fun
used cms true

Branding, Web Design

Project 332
2020
Blue
Fun
used cms false

Branding, Web Design

Project 333
2020
Red
Not fun
used cms true

Branding, Strategy Consulting

Project 334
2020
Yellow
Not fun
used cms false

Branding, Strategy Consulting

Project 335
2019
Green
Not fun
used cms true

Motion Graphics

Project 336
2017
Blue
Not fun
used cms false

Motion Graphics

Project 337
2019
Blue
Fun
used cms true

Branding, Web Design

Project 338
2020
Yellow
Fun
used cms false

Branding

Project 339
2017
Orange
Not fun
used cms true

Web Design

Project 340
2018
Green
Fun
used cms false

Development

Project 341
2018
Yellow
Fun
used cms true

Development

Project 342
2018
Red
Fun
used cms false

Motion Graphics

Project 343
2019
Red
Not fun
used cms true

Branding

Project 344
2020
Red
Not fun
used cms false

Web Design

Project 345
2020
Blue
Fun
used cms true

Web Design, Development

Project 346
2020
Blue
Not fun
used cms false

Web Design, Development

Project 347
2019
Blue
Fun
used cms true

Strategy Consulting

Project 348
2017
Red
Fun
used cms false

Web Design, Development

Project 349
2019
Yellow
Fun
used cms true

Web Design

Project 350
2020
Green
Not fun
used cms false

Strategy Consulting

Project 351
2017
Blue
Not fun
used cms true

Branding, Motion Graphics

Project 352
2018
Blue
Not fun
used cms false

Branding, Web Design

Project 353
2018
Yellow
Not fun
used cms true

Strategy Consulting

Project 354
2018
Orange
Fun
used cms false

Branding, Web Design

Project 355
2019
Green
Fun
used cms true

Branding, Web Design

Project 356
2020
Yellow
Not fun
used cms false

Branding, Web Design

Project 357
2020
Red
Fun
used cms true

Branding, Strategy Consulting

Project 358
2020
Red
Fun
used cms false

Branding, Strategy Consulting

Project 359
2019
Red
Fun
used cms true

Motion Graphics

Project 360
2017
Blue
Not fun
used cms false

Motion Graphics

Project 361
2019
Blue
Not fun
used cms true

Branding, Web Design

Project 362
2020
Blue
Fun
used cms false

Branding

Project 363
2017
Red
Not fun
used cms true

Web Design

Project 364
2018
Yellow
Fun
used cms false

Development

Project 365
2018
Green
Fun
used cms true

Development

Project 366
2018
Blue
Fun
used cms false

Motion Graphics

Project 367
2019
Blue
Not fun
used cms true

Branding

Project 368
2020
Yellow
Not fun
used cms false

Web Design

Project 369
2020
Orange
Not fun
used cms true

Web Design, Development

Project 370
2020
Green
Not fun
used cms false

Web Design, Development

Project 371
2019
Yellow
Fun
used cms true

Strategy Consulting

Project 372
2017
Red
Fun
used cms false

Web Design, Development

Project 373
2019
Red
Not fun
used cms true

Web Design

Project 374
2020
Red
Fun
used cms false

Strategy Consulting

Project 375
2017
Blue
Fun
used cms true

Branding, Motion Graphics

Project 376
2018
Blue
Fun
used cms false

Branding, Web Design

Project 377
2018
Blue
Not fun
used cms true

Strategy Consulting

Project 378
2018
Red
Not fun
used cms false

Branding, Web Design

Project 379
2019
Yellow
Fun
used cms true

Branding, Web Design

Project 380
2020
Green
Not fun
used cms false

Branding, Web Design

Project 381
2020
Blue
Fun
used cms true

Branding, Strategy Consulting

Project 382
2020
Blue
Fun
used cms false

Branding, Strategy Consulting

Project 383
2019
Yellow
Fun
used cms true

Motion Graphics

Project 384
2017
Orange
Not fun
used cms false

Motion Graphics

Project 385
2019
Green
Not fun
used cms true

Branding, Web Design

Project 386
2020
Yellow
Not fun
used cms false

Branding

Project 387
2017
Red
Not fun
used cms true

Web Design

Project 388
2018
Red
Fun
used cms false

Development

Project 389
2018
Red
Fun
used cms true

Development

Project 390
2018
Blue
Not fun
used cms false

Motion Graphics

Project 391
2019
Blue
Fun
used cms true

Branding

Project 392
2020
Blue
Fun
used cms false

Web Design

Project 393
2020
Red
Fun
used cms true

Web Design, Development

Project 394
2020
Yellow
Not fun
used cms false

Web Design, Development

Project 395
2019
Green
Not fun
used cms true

Strategy Consulting

Project 396
2017
Blue
Fun
used cms false

Web Design, Development

Project 397
2019
Blue
Not fun
used cms true

Web Design

Project 398
2020
Yellow
Fun
used cms false

Strategy Consulting

Project 399
2017
Orange
Fun
used cms true

Branding, Motion Graphics

Project 400
2018
Green
Fun
used cms false

Branding, Web Design

Project 401
2018
Yellow
Not fun
used cms true

Strategy Consulting

Project 402
2018
Red
Not fun
used cms false

Branding, Web Design

Project 403
2019
Red
Not fun
used cms true

Branding, Web Design

Project 404
2020
Red
Not fun
used cms false

Branding, Web Design

Project 405
2020
Blue
Fun
used cms true

Branding, Strategy Consulting

Project 406
2020
Blue
Fun
used cms false

Branding, Strategy Consulting

Project 407
2019
Blue
Not fun
used cms true

Motion Graphics

Project 408
2017
Red
Fun
used cms false

Motion Graphics

Project 409
2019
Yellow
Fun
used cms true

Branding, Web Design

Project 410
2020
Green
Fun
used cms false

Branding

Project 411
2017
Blue
Not fun
used cms true

Web Design

Project 412
2018
Blue
Not fun
used cms false

Development

Project 413
2018
Yellow
Fun
used cms true

Development

Project 414
2018
Orange
Not fun
used cms false

Motion Graphics

Project 415
2019
Green
Fun
used cms true

Branding

Project 416
2020
Yellow
Fun
used cms false

Web Design

Project 417
2020
Red
Fun
used cms true

Web Design, Development

Project 418
2020
Red
Not fun
used cms false

Web Design, Development

Project 419
2019
Red
Not fun
used cms true

Strategy Consulting

Project 420
2017
Blue
Not fun
used cms false

Web Design, Development

Project 421
2019
Blue
Not fun
used cms true

Web Design

Project 422
2020
Blue
Fun
used cms false

Strategy Consulting

Project 423
2017
Red
Fun
used cms true

Branding, Motion Graphics

Project 424
2018
Yellow
Not fun
used cms false

Branding, Web Design

Project 425
2018
Green
Fun
used cms true

Strategy Consulting

Project 426
2018
Blue
Fun
used cms false

Branding, Web Design

Project 427
2019
Blue
Fun
used cms true

Branding, Web Design

Project 428
2020
Yellow
Not fun
used cms false

Branding, Web Design

Project 429
2020
Orange
Not fun
used cms true

Branding, Strategy Consulting

Project 430
2020
Green
Fun
used cms false

Branding, Strategy Consulting

Project 431
2019
Yellow
Not fun
used cms true

Motion Graphics

Project 432
2017
Red
Fun
used cms false

Motion Graphics

Project 433
2019
Red
Fun
used cms true

Branding, Web Design

Project 434
2020
Red
Fun
used cms false

Branding

Project 435
2017
Blue
Not fun
used cms true

Web Design

Project 436
2018
Blue
Not fun
used cms false

Development

Project 437
2018
Blue
Not fun
used cms true

Development

Project 438
2018
Red
Not fun
used cms false

Motion Graphics

Project 439
2019
Yellow
Fun
used cms true

Branding

Project 440
2020
Green
Fun
used cms false

Web Design

Project 441
2020
Blue
Not fun
used cms true

Web Design, Development

Project 442
2020
Blue
Fun
used cms false

Web Design, Development

Project 443
2019
Yellow
Fun
used cms true

Strategy Consulting

Project 444
2017
Orange
Fun
used cms false

Web Design, Development

Project 445
2019
Green
Not fun
used cms true

Web Design

Project 446
2019
Yellow
Not fun
used cms false

Strategy Consulting

Project 447
2020
Red
Fun
used cms true

Branding, Motion Graphics

Project 448
2017
Red
Not fun
used cms false

Branding, Web Design

Project 449
2018
Red
Fun
used cms true

Strategy Consulting

Project 450
2018
Blue
Fun
used cms false

Branding, Web Design

Project 451
2018
Blue
Fun
used cms true

Branding, Web Design

Project 452
2019
Blue
Not fun
used cms false

Branding, Web Design

Project 453
2020
Red
Not fun
used cms true

Branding, Strategy Consulting

Project 454
2020
Yellow
Not fun
used cms false

Branding, Strategy Consulting

Project 455
2020
Green
Not fun
used cms true

Motion Graphics

Project 456
2019
Blue
Fun
used cms false

Motion Graphics

Project 457
2017
Blue
Fun
used cms true

Branding, Web Design

Project 458
2019
Yellow
Not fun
used cms false

Branding

Project 459
2020
Orange
Fun
used cms true

Web Design

Project 460
2017
Green
Fun
used cms false

Development

Project 461
2018
Yellow
Fun
used cms true

Development

Project 462
2018
Red
Not fun
used cms false

Motion Graphics

Project 463
2018
Red
Not fun
used cms true

Branding

Project 464
2019
Red
Fun
used cms false

Web Design

Project 465
2020
Blue
Not fun
used cms true

Web Design, Development

Project 466
2020
Blue
Fun
used cms false

Web Design, Development

Project 467
2020
Blue
Fun
used cms true

Strategy Consulting

Project 468
2019
Red
Fun
used cms false

Web Design, Development

Project 469
2017
Yellow
Not fun
used cms true

Web Design

Project 470
2019
Green
Not fun
used cms false

Strategy Consulting

Project 471
2020
Blue
Not fun
used cms true

Branding, Motion Graphics

Project 472
2017
Blue
Not fun
used cms false

Branding, Web Design

Project 473
2018
Yellow
Fun
used cms true

Strategy Consulting

Project 474
2018
Orange
Fun
used cms false

Branding, Web Design

Project 475
2018
Green
Not fun
used cms true

Branding, Web Design

Project 476
2019
Yellow
Fun
used cms false

Branding, Web Design

Project 477
2020
Red
Fun
used cms true

Branding, Strategy Consulting

Project 478
2020
Red
Fun
used cms false

Branding, Strategy Consulting

Project 479
2020
Red
Not fun
used cms true

Motion Graphics

Project 480
2019
Blue
Not fun
used cms false

Motion Graphics

Project 481
2017
Blue
Fun
used cms true

Branding, Web Design

Project 482
2019
Blue
Not fun
used cms false

Branding

Project 483
2020
Red
Fun
used cms true

Web Design

Project 484
2017
Yellow
Fun
used cms false

Development

Project 485
2018
Green
Fun
used cms true

Development

Project 486
2018
Blue
Not fun
used cms false

Motion Graphics

Project 487
2018
Blue
Not fun
used cms true

Branding

Project 488
2019
Yellow
Not fun
used cms false

Web Design

Project 489
2020
Orange
Not fun
used cms true

Web Design, Development

Project 490
2020
Green
Fun
used cms false

Web Design, Development

Project 491
2020
Yellow
Fun
used cms true

Strategy Consulting

Project 492
2019
Red
Not fun
used cms false

Web Design, Development

Project 493
2017
Red
Fun
used cms true

Web Design

Project 494
2019
Red
Fun
used cms false

Strategy Consulting

Project 495
2020
Blue
Fun
used cms true

Branding, Motion Graphics

Project 496
2017
Blue
Not fun
used cms false

Branding, Web Design

Project 497
2018
Blue
Not fun
used cms true

Strategy Consulting

Project 498
2018
Red
Fun
used cms false

Branding, Web Design

Project 499
2018
Yellow
Not fun
used cms true

Branding, Web Design

Project 500
2019
Green
Fun
used cms false

Branding, Web Design

Clone me!

You are almost there! Clone this template by clicking the link above. Learn, play around, test, use your own content, and have fun.

You can delete all .delete-me divs! All of the How-To content is in the .clonable divs.

More examples
1 sort
1 sort reverse
Multi sort
Multi sort with combine
Combine
Component
Filter
Component
Made with
by