PageSourceSearch

https://madewithsvelte.com/charts

html madewithsvelte.com collected 2026-09-25 21:29:50 UTC 111,220 bytes, 1,463 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en">
3<head>
4    <meta charset="utf-8">
5    <meta http-equiv="X-UA-Compatible" content="IE=edge">
6    <meta name="viewport" content="width=device-width, initial-scale=1">
7    <title>Charts - Made with Svelte</title><meta name="description" content="A collection of web projects made with Svelte – Websites, Components, Frameworks, Apps and more!"><link rel="canonical" href="https://madewithsvelte.com/charts"><meta property="og:title" content="Charts - Made with Svelte"><meta property="og:description" content="A collection of web projects made with Svelte – Websites, Components, Frameworks, Apps and more!"><meta property="og:url" content="https://madewithsvelte.com/charts"><meta property="og:image" content="https://madewithsvelte.com/storage/nova-elements/JF2zAzN0x04BzBCVKlnURxWKOAzX7nS44GIsUlfW.jpeg"><meta property="og:image:height" content="630"><meta property="og:image:width" content="1200"><meta name="twitter:title" content="Charts - Made with Svelte"><meta name="twitter:description" content="A collection of web projects made with Svelte – Websites, Components, Frameworks, Apps and more!">
7<script type="application/ld+json">{"@context":"https://schema.org","@type":"WebPage","name":"Charts - Made with Svelte","description":"A collection of web projects made with Svelte – Websites, Components, Frameworks, Apps and more!"}</script>
7
8    <meta name="twitter:card" content="summary_large_image">
9
10    
11    <link href="/css/app-madewithsvelte.css?id=7de1b37e7ee70690d1bb" rel="stylesheet" type="text/css">
12
13
14    <!-- Fathom - beautiful, simple website analytics -->
15        
15<script src="https://cdn.usefathom.com/script.js" data-site="DQFOORMB" defer></script>
15
16        <!-- / Fathom -->
17    
18
19
20
21    <link rel="apple-touch-icon" sizes="57x57" href="https://madewithsvelte.com/mandant/madewithsvelte/favicon/apple-icon-57x57.png">
22<link rel="apple-touch-icon" sizes="60x60" href="https://madewithsvelte.com/mandant/madewithsvelte/favicon/apple-icon-60x60.png">
23<link rel="apple-touch-icon" sizes="72x72" href="https://madewithsvelte.com/mandant/madewithsvelte/favicon/apple-icon-72x72.png">
24<link rel="apple-touch-icon" sizes="76x76" href="/https://madewithsvelte.com/mandant/madewithsvelte/favicon/apple-icon-76x76.png">
25<link rel="apple-touch-icon" sizes="114x114" href="https://madewithsvelte.com/mandant/madewithsvelte/favicon/apple-icon-114x114.png">
26<link rel="apple-touch-icon" sizes="120x120" href="https://madewithsvelte.com/mandant/madewithsvelte/favicon/apple-icon-120x120.png">
27<link rel="apple-touch-icon" sizes="144x144" href="https://madewithsvelte.com/mandant/madewithsvelte/favicon/apple-icon-144x144.png">
28<link rel="apple-touch-icon" sizes="152x152" href="https://madewithsvelte.com/mandant/madewithsvelte/favicon/apple-icon-152x152.png">
29<link rel="apple-touch-icon" sizes="180x180" href="https://madewithsvelte.com/mandant/madewithsvelte/favicon/apple-icon-180x180.png">
30<link rel="icon" type="image/png" sizes="192x192" href="https://madewithsvelte.com/mandant/madewithsvelte/favicon/android-icon-192x192.png">
31<link rel="icon" type="image/png" sizes="32x32" href="https://madewithsvelte.com/mandant/madewithsvelte/favicon/favicon-32x32.png">
32<link rel="icon" type="image/png" sizes="96x96" href="https://madewithsvelte.com/mandant/madewithsvelte/favicon/favicon-96x96.png">
33<link rel="icon" type="image/png" sizes="16x16" href="https://madewithsvelte.com/mandant/madewithsvelte/favicon/favicon-16x16.png">
34<link rel="manifest" href="https://madewithsvelte.com/mandant/madewithsvelte/favicon/manifest.json">
35<meta name="msapplication-TileColor" content="#ffffff">
36<meta name="msapplication-TileImage" content="https://madewithsvelte.com/mandant/madewithsvelte/favicon/ms-icon-144x144.png">
37<meta name="theme-color" content="#ffffff">    
38            
38<script type="application/ld+json">{"@context":"https://schema.org","@type":"ItemList","itemListElement":[{"@type":"ListItem","url":"https://madewithsvelte.com/svelte-bar-chart-race","position":1},{"@type":"ListItem","url":"https://madewithsvelte.com/svelteplot","position":2},{"@type":"ListItem","url":"https://madewithsvelte.com/datawrapper","position":3},{"@type":"ListItem","url":"https://madewithsvelte.com/layerchart","position":4},{"@type":"ListItem","url":"https://madewithsvelte.com/advviz","position":5},{"@type":"ListItem","url":"https://madewithsvelte.com/pancake","position":6},{"@type":"ListItem","url":"https://madewithsvelte.com/florence","position":7},{"@type":"ListItem","url":"https://madewithsvelte.com/flexmonster","position":8},{"@type":"ListItem","url":"https://madewithsvelte.com/flowbite-svelte-chart","position":9},{"@type":"ListItem","url":"https://madewithsvelte.com/dhtmlx-svelte-gantt","position":10},{"@type":"ListItem","url":"https://madewithsvelte.com/svelte-heatmap","position":11},{"@type":"ListItem","url":"https://madewithsvelte.com/svelte-fusioncharts","position":12},{"@type":"ListItem","url":"https://madewithsvelte.com/svelte-gantt","position":13},{"@type":"ListItem","url":"https://madewithsvelte.com/layer-cake","position":14},{"@type":"ListItem","url":"https://madewithsvelte.com/matterviz","position":15},{"@type":"ListItem","url":"https://madewithsvelte.com/datavisualizationwithsvelte","position":16}]}</script>
38
39        <link rel="alternate" type="application/atom+xml" href="https://madewithsvelte.com/rss-feed" title="MadeWith RSS Feed">
40
41    
42    
42<script>
43        window.$page = {"copy":"Svelte","product":"Svelte","color":"#ff4000","pricing":{"queue_time":"6-8 weeks","amount_feature_days":14,"skip_queue":19,"publish_date":9,"feature_days":19},"turnstile_site_key":"0x4AAAAAAEBsx4GPF0-AfRD1"};
44    </script>
44
45
46    
47
48    <link rel="preload" as="font" href="https://madewithsvelte.com/fonts/dosis-v7-latin-ext_latin-regular.woff2" type="font/woff2" crossorigin="anonymous">
49    <link rel="preload" as="font" href="https://madewithsvelte.com/fonts/dosis-v7-latin-ext_latin-600.woff2" type="font/woff2" crossorigin="anonymous">
50    <link rel="preload" as="font" href="https://madewithsvelte.com/fonts/dosis-v7-latin-ext_latin-700.woff2" type="font/woff2" crossorigin="anonymous">
51
52</head>
53
54
55<body data-mandant="madewithsvelte"
56      class="body--site   body--madewithsvelte     body--has-meta ">
57<div id="app">
58                
59
60            <nav class="navbar__wrap  navbar__wrap--has-meta " id="js-header">
61
62            <ul class="navbar-meta">
63            <li class="navbar-meta__link navbar-meta__link--collection  is-active "><a
64                        href="https://madewithsvelte.com">
65                    <svg class="svg-inline u__va--middle" width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
66    <!-- Generator: Sketch 49.1 (51147) - http://www.bohemiancoding.com/sketch -->
67    <title>navbar-meta--collection</title>
68    <desc>Created with Sketch.</desc>
69    <defs></defs>
70    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="1">
71        <g id="Blog-Overview" transform="translate(-30.000000, -10.000000)" fill="#FFFFFF" fill-rule="nonzero">
72            <g id="Group-19">
73                <g id="Group-20" transform="translate(30.000000, 10.000000)">
74                    <g id="navbar-meta--collection">
75                        <path d="M6.25,0 L2.27288889,0 C1.02288889,0 0,1.02288889 0,2.27288889 L0,6.25 C0,7.5 1.02288889,8.52288889 2.27288889,8.52288889 L6.25,8.52288889 C7.5,8.52288889 8.52288889,7.5 8.52288889,6.25 L8.52288889,2.27288889 C8.52288889,1.02288889 7.5,0 6.25,0 Z" id="Shape"></path>
76                        <path d="M17.7268889,0 L13.75,0 C12.5,0 11.4768889,1.02288889 11.4768889,2.27288889 L11.4768889,6.25 C11.4768889,7.5 12.5,8.52288889 13.75,8.52288889 L17.7268889,8.52288889 C18.9768889,8.52288889 20,7.5 20,6.25 L20,2.27288889 C20,1.02288889 18.9768889,0 17.7268889,0 Z" id="Shape"></path>
77                        <path d="M6.25,11.4768889 L2.27288889,11.4768889 C1.02288889,11.4768889 0,12.5 0,13.75 L0,17.7268889 C0,18.9768889 1.02288889,20 2.27288889,20 L6.25,20 C7.5,20 8.52288889,18.9768889 8.52288889,17.7268889 L8.52288889,13.75 C8.52288889,12.5 7.5,11.4768889 6.25,11.4768889 Z" id="Shape"></path>
78                        <path d="M17.7268889,11.4768889 L13.75,11.4768889 C12.5,11.4768889 11.4768889,12.5 11.4768889,13.75 L11.4768889,17.7268889 C11.4768889,18.9768889 12.5,20 13.75,20 L17.7268889,20 C18.9768889,20 20,18.9768889 20,17.7268889 L20,13.75 C20,12.5 18.9768889,11.4768889 17.7268889,11.4768889 Z" id="Shape"></path>
79                    </g>
80                </g>
81            </g>
82        </g>
83    </g>
84</svg> Collection</a></li>
85                                </ul>
86    
87    <div class="navbar">
88
89        <div class="pull-left">
90                            <a @click.stop.prevent="showCategories = !(showCategories);" href="#"
91                   class="navbar__categories icon-icon-category">Categories</a>
92            
93        </div>
94        <div class="pull-right">
95            <a href="/submit" class="navbar__submit hidden-xs">Submit a project</a>
96
97            <mwc-search-button>
98                <a class="navbar__twitter" href="#">
99                    <i class="far fa-fw fa-search"></i>
100                </a>
101            </mwc-search-button>
102
103                                        <a data-toggle="tooltip" title="Follow Us On X" target="_blank" rel="external"
104                   href="https://x.com/madewithsvelte"
105                   class="navbar__twitter">
106                    <i class="fab fa-fw fa-x-twitter"></i>
107                </a>
108                                        <a data-toggle="tooltip" title="Follow Us On Bluesky" target="_blank" rel="external"
109                   href="https://bsky.app/profile/madewithsvelte.com"
110                   class="navbar__twitter">
111                    <i class="fab fa-fw fa-bluesky"></i>
112                </a>
113                        
114        </div>
115        <a class="navbar__logo" href="https://madewithsvelte.com">
116                            <img src="https://madewithsvelte.com/mandant/madewithsvelte/images/logo.png" width="194px" alt="MadeWithSvelte.com"/>
117                    </a>
118    </div>
119</nav>
120
121    
122
123    <div class="site-content">
124        <div class="content container " >
125            
126    
127    <div class="row">
128        <div class="col-xs-12 text-center">
129                                        <h1 class="u__h1">#Charts<br><small><span class="color-grounded">made with</span> <span class="color-color">Svelte</span></small></h1>
130                        
131                    </div>
132    </div>
133
134    <div class="brick__container">
135
136    
137                        <div  class="brick ">
138    <div class="brick__inner">
139        <div data-detail="https://madewithsvelte.com/svelte-bar-chart-race" class="brick__image">
140
141
142                            <video
143                        muted
144                        autoplay
145                        playsinline
146                        loop
147                        class="brick__video">
148                    <source src="https://madewithvuejs.com/storage/30876/svelte-bar-chart-race-k.mp4" type="video/mp4">
149                </video>
150            
151
152        </div>
153
154        <div class="brick__caption">
155                        <div class="brick__caption-upper">
156                <a  href="https://madewithsvelte.com/svelte-bar-chart-race" class="brick__title">
157                    Svelte Bar Chart Race
158                </a>
159                <span class="brick__tagline">
160                Bar Chart Race Visualization
161            </span>
162            </div>
163            <div class="brick__caption-lower">
164                <div class="pull-left">
165                    
166                                            <a href="/ui-component">#UI Component</a>
167                                                                    <a href="/charts">#Charts</a>
168                                                            </div>
169                <div class="pull-right">
170            <div class="brick__views">
171            <svg class="svg-inline u__va--middle" width="20px" height="13px" viewBox="0 0 20 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
172    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
173    <title>icon-eye-dark</title>
174    <desc>Created with Sketch.</desc>
175    <defs></defs>
176    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
177        <g id="Icons" transform="translate(-313.000000, -230.000000)" fill-rule="nonzero" fill="#435B71">
178            <g id="icon-eye-dark" transform="translate(313.000000, 230.000000)">
179                <path d="M9.57827924,0.0932647368 C5.40166592,0.0977121053 2.23909537,3.28527789 0.162366374,6.09013053 C-0.0164829778,6.33193046 -0.0164829778,6.66216481 0.162366374,6.90396474 C2.23923803,9.71401737 5.40085034,12.9011726 9.57827924,12.9068174 C9.57872397,12.9068178 9.57916871,12.9068178 9.57961345,12.9068174 C13.7562192,12.90237 16.9187977,9.71477 18.9955264,6.90995158 C19.1743758,6.66815165 19.1743758,6.3379173 18.9955264,6.09611737 C16.9186536,3.28603053 13.7570499,0.0989094737 9.57961345,0.0932647368 C9.57916871,0.0932643033 9.57872397,0.0932643033 9.57827924,0.0932647368 L9.57827924,0.0932647368 Z M9.57827924,1.46168579 L9.57961345,1.46168579 C12.8675916,1.46681737 15.5988249,3.96846211 17.5569468,6.50236737 C15.5985806,9.03230421 12.8660264,11.5341884 9.57961345,11.5383963 C6.29104758,11.5339489 3.55933568,9.03192789 1.60094367,6.49771474 C3.55930832,3.96777789 6.29185563,1.46589368 9.57827718,1.46168579 L9.57827924,1.46168579 Z" id="Shape"></path>
180                <path d="M9.57894737,3.42075158 C7.88659608,3.42075158 6.5,4.80737263 6.5,6.49969895 C6.5,8.19205947 7.88659608,9.57864632 9.57894737,9.57864632 C11.2712987,9.57864632 12.6578947,8.19205947 12.6578947,6.49969895 C12.6578947,4.80737263 11.2712987,3.42075158 9.57894737,3.42075158 Z M9.57894737,4.78917263 C10.5317492,4.78917263 11.2894737,5.54690158 11.2894737,6.49969895 C11.2894737,7.45249632 10.5317492,8.21022526 9.57894737,8.21022526 C8.62614555,8.21022526 7.86842105,7.45249632 7.86842105,6.49969895 C7.86842105,5.54690158 8.62614555,4.78917263 9.57894737,4.78917263 Z" id="Shape"></path>
181            </g>
182        </g>
183    </g>
184</svg>            <span class="u__va--middle">840</span>
185        </div>
186        </div>
187            </div>
188        </div>
189
190            </div>
191</div>
192                                <div  class="brick ">
193    <div class="brick__inner">
194        <div data-detail="https://madewithsvelte.com/svelteplot" class="brick__image">
195
196
197            
198                <div class="brick__image-inner "
199                     id="js-image-5719"
200                     v-lazy-bg="'https://madewithnetworkfra.fra1.digitaloceanspaces.com/spatie-space-production/32934/svelteplot.jpg'"
201                    style=" ">
202
203                </div>
204
205            
206
207        </div>
208
209        <div class="brick__caption">
210                        <div class="brick__caption-upper">
211                <a  href="https://madewithsvelte.com/svelteplot" class="brick__title">
212                    SveltePlot
213                </a>
214                <span class="brick__tagline">
215                Plotting Framework
216            </span>
217            </div>
218            <div class="brick__caption-lower">
219                <div class="pull-left">
220                    
221                                            <a href="/ui-component">#UI Component</a>
222                                                                    <a href="/charts">#Charts</a>
223                                                            </div>
224                <div class="pull-right">
225            <div class="brick__views">
226            <svg class="svg-inline u__va--middle" width="20px" height="13px" viewBox="0 0 20 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
227    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
228    <title>icon-eye-dark</title>
229    <desc>Created with Sketch.</desc>
230    <defs></defs>
231    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
232        <g id="Icons" transform="translate(-313.000000, -230.000000)" fill-rule="nonzero" fill="#435B71">
233            <g id="icon-eye-dark" transform="translate(313.000000, 230.000000)">
234                <path d="M9.57827924,0.0932647368 C5.40166592,0.0977121053 2.23909537,3.28527789 0.162366374,6.09013053 C-0.0164829778,6.33193046 -0.0164829778,6.66216481 0.162366374,6.90396474 C2.23923803,9.71401737 5.40085034,12.9011726 9.57827924,12.9068174 C9.57872397,12.9068178 9.57916871,12.9068178 9.57961345,12.9068174 C13.7562192,12.90237 16.9187977,9.71477 18.9955264,6.90995158 C19.1743758,6.66815165 19.1743758,6.3379173 18.9955264,6.09611737 C16.9186536,3.28603053 13.7570499,0.0989094737 9.57961345,0.0932647368 C9.57916871,0.0932643033 9.57872397,0.0932643033 9.57827924,0.0932647368 L9.57827924,0.0932647368 Z M9.57827924,1.46168579 L9.57961345,1.46168579 C12.8675916,1.46681737 15.5988249,3.96846211 17.5569468,6.50236737 C15.5985806,9.03230421 12.8660264,11.5341884 9.57961345,11.5383963 C6.29104758,11.5339489 3.5
2345933568,9.03192789 1.60094367,6.49771474 C3.55930832,3.96777789 6.29185563,1.46589368 9.57827718,1.46168579 L9.57827924,1.46168579 Z" id="Shape"></path>
235                <path d="M9.57894737,3.42075158 C7.88659608,3.42075158 6.5,4.80737263 6.5,6.49969895 C6.5,8.19205947 7.88659608,9.57864632 9.57894737,9.57864632 C11.2712987,9.57864632 12.6578947,8.19205947 12.6578947,6.49969895 C12.6578947,4.80737263 11.2712987,3.42075158 9.57894737,3.42075158 Z M9.57894737,4.78917263 C10.5317492,4.78917263 11.2894737,5.54690158 11.2894737,6.49969895 C11.2894737,7.45249632 10.5317492,8.21022526 9.57894737,8.21022526 C8.62614555,8.21022526 7.86842105,7.45249632 7.86842105,6.49969895 C7.86842105,5.54690158 8.62614555,4.78917263 9.57894737,4.78917263 Z" id="Shape"></path>
236            </g>
237        </g>
238    </g>
239</svg>            <span class="u__va--middle">1.604</span>
240        </div>
241        </div>
242            </div>
243        </div>
244
245            </div>
246</div>
247                                <div class="brick brick--sponsored">
248    <div class="brick__inner">
249        <div data-detail="https://madewithsvelte.com/mwbrick-goto/wjmormcezanw8s6h-amelp5uzzwlco3i8-adpjgyrvbii0iggh-5wtbpvazlh8mjdda" class="brick__image">
250
251
252            <div class="brick__image-inner "
253                 id="js-image-272"
254                 style="background-image: url('https://madewithnetworkfra.fra1.digitaloceanspaces.com/spatie-space-production/29605/sentry-svelte.jpg');">
255
256            </div>
257
258
259        </div>
260
261        <div class="brick__caption">
262            <div class="brick__caption-upper">
263                <a target="_blank" href="https://madewithsvelte.com/mwbrick-goto/wjmormcezanw8s6h-amelp5uzzwlco3i8-adpjgyrvbii0iggh-5wtbpvazlh8mjdda" class="brick__title">
264                    Sentry for Svelte
265                </a>
266                <span class="brick__tagline">
267                Svelte Error &amp; Performance Monitoring
268            </span>
269            </div>
270            <div class="brick__caption-lower">
271                <div class="pull-left">
272                                            🧡 Sponsored by Friends
273                                    </div>
274                <div class="pull-right">
275                    <i class="fas fa-external-link-square-alt"></i>
276                </div>
277            </div>
278        </div>
279
280    </div>
281</div>
282                                <div class="carbon-ad--index brick-ad js-same-height">
283                <div class="brick-ad__inner-center">
284                    <div class="brick-ad__inner">
285                        <mw-brick         vertical="true"  type="carbon" :ads='[{"id":354,"mandant":"madewithsvelte","title":"Sentry Carbon - Performance","tagline":"See what\u0027s slow, faster: Monitor the performance of your Svelte apps!","text_color":null,"button_text":"Try Sentry for Svelte","button_color":null,"button_background_color":null,"background_color":null,"background_color_snippet":null,"label_ad":null,"link":"https:\/\/sentry.io\/for\/svelte\/?ref=madewithsvelte.com","detail_styling":"normal","show_topbanner":0,"show_topbanner_blog":0,"show_topbanner_detail":0,"show_blog":0,"show_sidebars":0,"show_detail":0,"feature_category":0,"feature_category_firstpage":0,"feature_startpage_slider":0,"feature_startpage":0,"show_sponsor_logo":0,"show_sponsor_brick":0,"show_carbon":1,"show_bottombanner":0,"show_ad_brick":0,"weight":null,"active":1,"from":null,"to":null,"created_at":"2024-02-22T08:07:38.000000Z","updated_at":"2024-02-22T08:07:38.000000Z","campaign_id":125,"goto_url":"https:\/\/madewithsvelte.com\/mwbrick-goto\/97sc3wr2bx01r4v9-ua5r8czlkzdhz2qf-ybkqyhjualqbw1ko-skoj0vn92xhrygup","public_url":"https:\/\/madewithsvelte.com\/mwbrick-examples\/97sc3wr2bx01r4v9-ua5r8czlkzdhz2qf-ybkqyhjualqbw1ko-skoj0vn92xhrygup","product":"https:\/\/madewithnetworkfra.fra1.digitaloceanspaces.com\/spatie-space-production\/30809\/sentry-carbon-performance.jpg","brand":"","css_top_banner":".mwblock__background--top-banner {\nbackground: ;\n\n}\n","impression_url":"https:\/\/madewithsvelte.com\/mwbrick-impression\/97sc3wr2bx01r4v9-ua5r8czlkzdhz2qf-ybkqyhjualqbw1ko-skoj0vn92xhrygup","posts":[]},{"id":505,"mandant":"madewithsvelte","title":"Carbon - Syntax 971","tagline":"Stackoverflow and Firefox are Dead? - Syntax.fm podcast #971","text_color":null,"button_text":"Listen now","button_color":null,"button_background_color":null,"background_color":null,"background_color_snippet":null,"label_ad":null,"link":"https:\/\/syntax.fm\/show\/971\/","detail_styling":"normal","show_to
285pbanner":0,"show_topbanner_blog":0,"show_topbanner_detail":0,"show_blog":0,"show_sidebars":0,"show_detail":0,"feature_category":0,"feature_category_firstpage":0,"feature_startpage_slider":0,"feature_startpage":0,"show_sponsor_logo":0,"show_sponsor_brick":0,"show_carbon":1,"show_bottombanner":0,"show_ad_brick":0,"weight":null,"active":1,"from":null,"to":null,"created_at":"2026-02-23T09:51:59.000000Z","updated_at":"2026-02-23T09:51:59.000000Z","campaign_id":125,"goto_url":"https:\/\/madewithsvelte.com\/mwbrick-goto\/etjayrbwoakkrhcq-kao6jnum5qjqkjqb-pj036fg2840lugti-xotjje876awqea5l","public_url":"https:\/\/madewithsvelte.com\/mwbrick-examples\/etjayrbwoakkrhcq-kao6jnum5qjqkjqb-pj036fg2840lugti-xotjje876awqea5l","product":"https:\/\/madewithnetworkfra.fra1.digitaloceanspaces.com\/spatie-space-production\/33738\/sentry-carbon-syntax-2-%281%29.jpg","brand":"","css_top_banner":".mwblock__background--top-banner {\nbackground: ;\n\n}\n","impression_url":"https:\/\/madewithsvelte.com\/mwbrick-impression\/etjayrbwoakkrhcq-kao6jnum5qjqkjqb-pj036fg2840lugti-xotjje876awqea5l","posts":[]},{"id":506,"mandant":"madewithsvelte","title":"Carbon - Syntax 955","tagline":"SvelteKit has solved data loading - Syntax.fm podcast #955","text_color":null,"button_text":"Listen now","button_color":null,"button_background_color":null,"background_color":null,"background_color_snippet":null,"label_ad":null,"link":"https:\/\/syntax.fm\/show\/955\/","detail_styling":"normal","show_topbanner":0,"show_topbanner_blog":0,"show_topbanner_detail":0,"show_blog":0,"show_sidebars":0,"show_detail":0,"feature_category":0,"feature_category_firstpage":0,"feature_startpage_slider":0,"feature_startpage":0,"show_sponsor_logo":0,"show_sponsor_brick":0,"show_carbon":1,"show_bottombanner":0,"show_ad_brick":0,"weight":null,"active":1,"from":null,"to":null,"created_at":"2026-02-23T09:52:51.000000Z","updated_at":"2026-02-23T09:52:51.000000Z","campaign_id":125,"goto_url":"https:\/\/madewithsvelte.com\/mwbrick-goto\/twqdx2gdear1m8zq-udelclikvqylec6w-uzuuilfacekjnhvf-hohltunf2xkqr2vs","public_url":"https:\/\/madewithsvelte.com\/mwbrick-examples\/twqdx2gdear1m8zq-udelclikvqylec6w-uzuuilfacekjnhvf-hohltunf2xkqr2vs","product":"https:\/\/madewithnetworkfra.fra1.digitaloceanspaces.com\/spatie-space-production\/33739\/sentry-carbon-syntax-%281%29.jpg","brand":"","css_top_banner":".mwblock__background--top-banner {\nbackground: ;\n\n}\n","impression_url":"https:\/\/madewithsvelte.com\/mwbrick-impression\/twqdx2gdear1m8zq-udelclikvqylec6w-uzuuilfacekjnhvf-hohltunf2xkqr2vs","posts":[]},{"id":507,"mandant":"madewithsvelte","title":"Carbon - Frontend Debugging Workshop","tagline":"Debug Frontend Issues Faster: Free Workshop Hands-On with Vite, React, Neon and Drizzle","text_color":null,"button_text":"Learn more","button_color":null,"button_background_color":null,"background_color":null,"background_color_snippet":null,"label_ad":null,"link":"https:\/\/sentry.io\/resources\/fixing-your-frontend-workshop\/?utm_source=madewithsvelte\u0026utm_medium=paid-community\u0026utm_campaign=frontend-fy27q1-frontend\u0026utm_content=static-ad-workshop-learnmore","detail_styling":"normal","show_topbanner":0,"show_topbanner_blog":0,"show_topbanner_detail":0,"show_blog":0,"show_sidebars":0,"show_detail":0,"feature_category":0,"feature_category_firstpage":0,"feature_startpage_slider":0,"feature_startpage":0,"show_sponsor_logo":0,"show_sponsor_brick":0,"show_carbon":1,"show_bottombanner":0,"show_ad_brick":0,"weight":null,"active":1,"from":null,"to":null,"created_at":"2026-02-23T09:54:09.000000Z","updated_at":"2026-02-23T09:54:09.000000Z","campaign_id":125,"goto_url":"https:\/\/madewithsvelte.com\/mwbrick-goto\/k5lwltsz0q7jdyap-knbogdazkehkllut-gutmsgqlvenybub6-vc3hqysjjifj0qm8","public_url":"https:\/\/madewithsvelte.com\/mwbrick-examples\/k5lwltsz0q7jdyap-knbogdazkehkllut-gutmsgqlvenybub6-vc3hqysjjifj0qm8","product":"https:\/\/madewithnetworkfra.fra1.digitaloceanspaces.com\/spatie-space-production\/33740\/sentry-carbon-resource-%281%29.jpg","brand":"","css_top_banner":".mwblock__background--top-banner {\nbackground: ;\n\n}\n","impression_url":"https:\/\/madewithsvelte.com\/mwbrick-impression\/k5lwltsz0q7jdyap-knbogdazkehkllut-gutmsgqlvenybub6-vc3hqysjjifj0qm8","posts":[]},{"id":508,"mandant":"madewithsvelte","title":"Carbon - Seer v2","tagline":"Ship fixes faster with AI-powered debugging and code reviews that open automatic PRs.","text_color":null,"button_text":"Explore Sentry\u0027s Seer for Svelte","button_color":null,"button_background_color":null,"background_color":null,"background_color_snippet":null,"label_ad":null,"link":"https:\/\/sentry.io\/product\/seer\/?utm_source=madewithsvelte\u0026utm_medium=paid-community\u0026utm_campaign=seer-fy27q1-seerlaunch\u0026utm_content=static-ad-product-learnmore","detail_styling":"normal","show_to
285pbanner":0,"show_topbanner_blog":0,"show_topbanner_detail":0,"show_blog":0,"show_sidebars":0,"show_detail":0,"feature_category":0,"feature_category_firstpage":0,"feature_startpage_slider":0,"feature_startpage":0,"show_sponsor_logo":0,"show_sponsor_brick":0,"show_carbon":1,"show_bottombanner":0,"show_ad_brick":0,"weight":null,"active":1,"from":null,"to":null,"created_at":"2026-02-23T09:55:06.000000Z","updated_at":"2026-02-23T09:55:06.000000Z","campaign_id":125,"goto_url":"https:\/\/madewithsvelte.com\/mwbrick-goto\/g2ulhldrbdovmnaw-5216bgjncwarrxaw-eek7hznd8htg5idn-stveoznwnlpb7xol","public_url":"https:\/\/madewithsvelte.com\/mwbrick-examples\/g2ulhldrbdovmnaw-5216bgjncwarrxaw-eek7hznd8htg5idn-stveoznwnlpb7xol","product":"https:\/\/madewithnetworkfra.fra1.digitaloceanspaces.com\/spatie-space-production\/33741\/sentry-carbon-seer-%281%29.jpg","brand":"","css_top_banner":".mwblock__background--top-banner {\nbackground: ;\n\n}\n","impression_url":"https:\/\/madewithsvelte.com\/mwbrick-impression\/g2ulhldrbdovmnaw-5216bgjncwarrxaw-eek7hznd8htg5idn-stveoznwnlpb7xol","posts":[]},{"id":509,"mandant":"madewithsvelte","title":"Carbon - Error Monitoring v2","tagline":"Catch Svelte issues early using automated alerts and connected logs for faster fixes.","text_color":null,"button_text":"Try Sentry for Svelte","button_color":null,"button_background_color":null,"background_color":null,"background_color_snippet":null,"label_ad":null,"link":"https:\/\/sentry.io\/for\/svelte\/?ref=madewithsvelte.com","detail_styling":"normal","show_topbanner":0,"show_topbanner_blog":0,"show_topbanner_detail":0,"show_blog":0,"show_sidebars":0,"show_detail":0,"feature_category":0,"feature_category_firstpage":0,"feature_startpage_slider":0,"feature_startpage":0,"show_sponsor_logo":0,"show_sponsor_brick":0,"show_carbon":1,"show_bottombanner":0,"show_ad_brick":0,"weight":null,"active":1,"from":null,"to":null,"created_at":"2026-02-23T10:41:16.000000Z","updated_at":"2026-02-23T10:41:29.000000Z","campaign_id":125,"goto_url":"https:\/\/madewithsvelte.com\/mwbrick-goto\/mq87n8omh9g522fv-tmnahvcv6dgqfd7w-hux1nxip5bqqxzhd-v7l2mmwpxkyuouwr","public_url":"https:\/\/madewithsvelte.com\/mwbrick-examples\/mq87n8omh9g522fv-tmnahvcv6dgqfd7w-hux1nxip5bqqxzhd-v7l2mmwpxkyuouwr","product":"https:\/\/madewithnetworkfra.fra1.digitaloceanspaces.com\/spatie-space-production\/33742\/sentry-carbon-errormonitoring-%281%29.jpg","brand":"","css_top_banner":".mwblock__background--top-banner {\nbackground: ;\n\n}\n","impression_url":"https:\/\/madewithsvelte.com\/mwbrick-impression\/mq87n8omh9g522fv-tmnahvcv6dgqfd7w-hux1nxip5bqqxzhd-v7l2mmwpxkyuouwr","posts":[]},{"id":510,"mandant":"madewithsvelte","title":"Sentry Carbon - Session Replay v2","tagline":"Understand every user issue faster by seeing exactly what they see with session replay.","text_color":null,"button_text":"Try Sentry for Svelte","button_color":null,"button_background_color":null,"background_color":null,"background_color_snippet":null,"label_ad":null,"link":"https:\/\/sentry.io\/product\/session-replay\/?utm_source=madewithsvelte\u0026utm_medium=paid-community\u0026utm_campaign=replay-fy27q1-sessionreplaygeneral\u0026utm_content=static-ad-smallcarbonslot-trysentry","detail_styling":"normal","show_topbanner":0,"show_topbanner_blog":0,"show_topbanner_detail":0,"show_blog":0,"show_sidebars":0,"show_detail":0,"feature_category":0,"feature_category_firstpage":0,"feature_startpage_slider":0,"feature_startpage":0,"show_sponsor_logo":0,"show_sponsor_brick":0,"show_carbon":1,"show_bottombanner":0,"show_ad_brick":0,"weight":null,"active":1,"from":null,"to":null,"created_at":"2026-02-23T10:42:36.000000Z","updated_at":"2026-02-23T10:42:58.000000Z","campaign_id":125,"goto_url":"https:\/\/madewithsvelte.com\/mwbrick-goto\/8nisemqmyp3cfayx-gesld1w5hf0mkf9j-q8c06a4bjyycrd2o-ctwelv9mgz7mnidu","public_url":"https:\/\/madewithsvelte.com\/mwbrick-examples\/8nisemqmyp3cfayx-gesld1w5hf0mkf9j-q8c06a4bjyycrd2o-ctwelv9mgz7mnidu","product":"https:\/\/madewithnetworkfra.fra1.digitaloceanspaces.com\/spatie-space-production\/33743\/sentry-carbon-sessionreplay-%282%29.jpg","brand":"","css_top_banner":".mwblock__background--top-banner {\nbackground: ;\n\n}\n","impression_url":"https:\/\/madewithsvelte.com\/mwbrick-impression\/8nisemqmyp3cfayx-gesld1w5hf0mkf9j-q8c06a4bjyycrd2o-ctwelv9mgz7mnidu","posts":[]},{"id":511,"mandant":"madewithsvelte","title":"Carbon - Seer General v2","tagline":"Debug faster at every stage of development with Seer, Sentry\u0027s AI agent","text_color":null,"button_text":"Try Sentry for free","button_color":null,"button_background_color":null,"background_color":null,"background_color_snippet":null,"label_ad":null,"link":"https:\/\/sentry.io\/product\/seer\/?utm_source=madewithgeneral\u0026utm_medium=paid-community\u0026utm_campaign=seer-fy27q1-seerlaunch\u0026utm_content=static-ad-product-trysentry","detail_styling":"normal","show_to
285pbanner":0,"show_topbanner_blog":0,"show_topbanner_detail":0,"show_blog":0,"show_sidebars":0,"show_detail":0,"feature_category":0,"feature_category_firstpage":0,"feature_startpage_slider":0,"feature_startpage":0,"show_sponsor_logo":0,"show_sponsor_brick":0,"show_carbon":1,"show_bottombanner":0,"show_ad_brick":0,"weight":null,"active":1,"from":null,"to":null,"created_at":"2026-02-23T10:45:55.000000Z","updated_at":"2026-02-23T10:45:55.000000Z","campaign_id":125,"goto_url":"https:\/\/madewithsvelte.com\/mwbrick-goto\/u4w8plny1oqrtnyy-2bnfqnxhgajc8yl6-cuvturg47mvgodsc-t3a11j4bdljhxjel","public_url":"https:\/\/madewithsvelte.com\/mwbrick-examples\/u4w8plny1oqrtnyy-2bnfqnxhgajc8yl6-cuvturg47mvgodsc-t3a11j4bdljhxjel","product":"https:\/\/madewithnetworkfra.fra1.digitaloceanspaces.com\/spatie-space-production\/33744\/sentry-carbon-seer-%281%29.jpg","brand":"","css_top_banner":".mwblock__background--top-banner {\nbackground: ;\n\n}\n","impression_url":"https:\/\/madewithsvelte.com\/mwbrick-impression\/u4w8plny1oqrtnyy-2bnfqnxhgajc8yl6-cuvturg47mvgodsc-t3a11j4bdljhxjel","posts":[]},{"id":512,"mandant":"madewithsvelte","title":"Carbon - AI Monitoring v2","tagline":"Get alerted when your AI agents fail in production","text_color":null,"button_text":"Try Sentry for AI","button_color":null,"button_background_color":null,"background_color":null,"background_color_snippet":null,"label_ad":null,"link":"https:\/\/sentry.io\/lp\/ai-monitoring\/?utm_source=madewithgeneral\u0026utm_medium=paid-community\u0026utm_campaign=ai-fy27q1-agentmonitoring\u0026utm_content=static-ad-product-learnmore","detail_styling":"normal","show_topbanner":0,"show_topbanner_blog":0,"show_topbanner_detail":0,"show_blog":0,"show_sidebars":0,"show_detail":0,"feature_category":0,"feature_category_firstpage":0,"feature_startpage_slider":0,"feature_startpage":0,"show_sponsor_logo":0,"show_sponsor_brick":0,"show_carbon":1,"show_bottombanner":0,"show_ad_brick":0,"weight":null,"active":1,"from":null,"to":null,"created_at":"2026-02-23T10:46:50.000000Z","updated_at":"2026-02-23T10:46:59.000000Z","campaign_id":125,"goto_url":"https:\/\/madewithsvelte.com\/mwbrick-goto\/wukf7yjqg0q8qgwf-cyqicm0ihh4r4610-juefoyaxoy4rczzu-reaax4fngpdcmf3g","public_url":"https:\/\/madewithsvelte.com\/mwbrick-examples\/wukf7yjqg0q8qgwf-cyqicm0ihh4r4610-juefoyaxoy4rczzu-reaax4fngpdcmf3g","product":"https:\/\/madewithnetworkfra.fra1.digitaloceanspaces.com\/spatie-space-production\/33745\/sentry-carbon-ai-observability-%281%29.jpg","brand":"","css_top_banner":".mwblock__background--top-banner {\nbackground: ;\n\n}\n","impression_url":"https:\/\/madewithsvelte.com\/mwbrick-impression\/wukf7yjqg0q8qgwf-cyqicm0ihh4r4610-juefoyaxoy4rczzu-reaax4fngpdcmf3g","posts":[]}]'></mw-brick>
286
287                    </div>
288                </div>
289            </div>
290                                <div  class="brick ">
291    <div class="brick__inner">
292        <div data-detail="https://madewithsvelte.com/datawrapper" class="brick__image">
293
294
295            
296                <div class="brick__image-inner "
297                     id="js-image-3806"
298                     v-lazy-bg="'https://madewithnetworkfra.fra1.digitaloceanspaces.com/spatie-space-production/33592/datawrapper-2.jpg'"
299                    style=" ">
300
301                </div>
302
303            
304
305        </div>
306
307        <div class="brick__caption">
308                        <div class="brick__caption-upper">
309                <a  href="https://madewithsvelte.com/datawrapper" class="brick__title">
310                    Datawrapper
311                </a>
312                <span class="brick__tagline">
313                Tool to create interactive Charts, Maps &amp; Tables
314            </span>
315            </div>
316            <div class="brick__caption-lower">
317                <div class="pull-left">
318                    
319                                            <a href="/web-app">#Web app</a>
320                                                                    <a href="/charts">#Charts</a>
321                                                            </div>
322                <div class="pull-right">
323            <div class="brick__views">
324            <svg class="svg-inline u__va--middle" width="20px" height="13px" viewBox="0 0 20 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
325    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
326    <title>icon-eye-dark</title>
327    <desc>Created with Sketch.</desc>
328    <defs></defs>
329    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
330        <g id="Icons" transform="translate(-313.000000, -230.000000)" fill-rule="nonzero" fill="#435B71">
331            <g id="icon-eye-dark" transform="translate(313.000000, 230.000000)">
332                <path d="M9.57827924,0.0932647368 C5.40166592,0.0977121053 2.23909537,3.28527789 0.162366374,6.09013053 C-0.0164829778,6.33193046 -0.0164829778,6.66216481 0.162366374,6.90396474 C2.23923803,9.71401737 5.40085034,12.9011726 9.57827924,12.9068174 C9.57872397,12.9068178 9.57916871,12.9068178 9.57961345,12.9068174 C13.7562192,12.90237 16.9187977,9.71477 18.9955264,6.90995158 C19.1743758,6.66815165 19.1743758,6.3379173 18.9955264,6.09611737 C16.9186536,3.28603053 13.7570499,0.0989094737 9.57961345,0.0932647368 C9.57916871,0.0932643033 9.57872397,0.0932643033 9.57827924,0.0932647368 L9.57827924,0.0932647368 Z M9.57827924,1.46168579 L9.57961345,1.46168579 C12.8675916,1.46681737 15.5988249,3.96846211 17.5569468,6.50236737 C15.5985806,9.03230421 12.8660264,11.5341884 9.57961345,11.5383963 C6.29104758,11.5339489 3.5
3325933568,9.03192789 1.60094367,6.49771474 C3.55930832,3.96777789 6.29185563,1.46589368 9.57827718,1.46168579 L9.57827924,1.46168579 Z" id="Shape"></path>
333                <path d="M9.57894737,3.42075158 C7.88659608,3.42075158 6.5,4.80737263 6.5,6.49969895 C6.5,8.19205947 7.88659608,9.57864632 9.57894737,9.57864632 C11.2712987,9.57864632 12.6578947,8.19205947 12.6578947,6.49969895 C12.6578947,4.80737263 11.2712987,3.42075158 9.57894737,3.42075158 Z M9.57894737,4.78917263 C10.5317492,4.78917263 11.2894737,5.54690158 11.2894737,6.49969895 C11.2894737,7.45249632 10.5317492,8.21022526 9.57894737,8.21022526 C8.62614555,8.21022526 7.86842105,7.45249632 7.86842105,6.49969895 C7.86842105,5.54690158 8.62614555,4.78917263 9.57894737,4.78917263 Z" id="Shape"></path>
334            </g>
335        </g>
336    </g>
337</svg>            <span class="u__va--middle">4.206</span>
338        </div>
339        </div>
340            </div>
341        </div>
342
343            </div>
344</div>
345                                <div  class="brick ">
346    <div class="brick__inner">
347        <div data-detail="https://madewithsvelte.com/layerchart" class="brick__image">
348
349
350            
351                <div class="brick__image-inner "
352                     id="js-image-4650"
353                     v-lazy-bg="'https://madewithnetworkfra.fra1.digitaloceanspaces.com/spatie-space-production/30992/layerchart-2.jpg'"
354                    style=" ">
355
356                </div>
357
358            
359
360        </div>
361
362        <div class="brick__caption">
363                        <div class="brick__caption-upper">
364                <a  href="https://madewithsvelte.com/layerchart" class="brick__title">
365                    LayerChart
366                </a>
367                <span class="brick__tagline">
368                Data Visualization Components &amp; Utilities
369            </span>
370            </div>
371            <div class="brick__caption-lower">
372                <div class="pull-left">
373                    
374                                            <a href="/ui-component">#UI Component</a>
375                                                                    <a href="/charts">#Charts</a>
376                                                            </div>
377                <div class="pull-right">
378            <div class="brick__views">
379            <svg class="svg-inline u__va--middle" width="20px" height="13px" viewBox="0 0 20 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
380    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
381    <title>icon-eye-dark</title>
382    <desc>Created with Sketch.</desc>
383    <defs></defs>
384    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
385        <g id="Icons" transform="translate(-313.000000, -230.000000)" fill-rule="nonzero" fill="#435B71">
386            <g id="icon-eye-dark" transform="translate(313.000000, 230.000000)">
387                <path d="M9.57827924,0.0932647368 C5.40166592,0.0977121053 2.23909537,3.28527789 0.162366374,6.09013053 C-0.0164829778,6.33193046 -0.0164829778,6.66216481 0.162366374,6.90396474 C2.23923803,9.71401737 5.40085034,12.9011726 9.57827924,12.9068174 C9.57872397,12.9068178 9.57916871,12.9068178 9.57961345,12.9068174 C13.7562192,12.90237 16.9187977,9.71477 18.9955264,6.90995158 C19.1743758,6.66815165 19.1743758,6.3379173 18.9955264,6.09611737 C16.9186536,3.28603053 13.7570499,0.0989094737 9.57961345,0.0932647368 C9.57916871,0.0932643033 9.57872397,0.0932643033 9.57827924,0.0932647368 L9.57827924,0.0932647368 Z M9.57827924,1.46168579 L9.57961345,1.46168579 C12.8675916,1.46681737 15.5988249,3.96846211 17.5569468,6.50236737 C15.5985806,9.03230421 12.8660264,11.5341884 9.57961345,11.5383963 C6.29104758,11.5339489 3.55933568,9.03192789 1.60094367,6.49771474 C3.55930832,3.96777789 6.29185563,1.46589368 9.57827718,1.46168579 L9.57827924,1.46168579 Z" id="Shape"></path>
388                <path d="M9.57894737,3.42075158 C7.88659608,3.42075158 6.5,4.80737263 6.5,6.49969895 C6.5,8.19205947 7.88659608,9.57864632 9.57894737,9.57864632 C11.2712987,9.57864632 12.6578947,8.19205947 12.6578947,6.49969895 C12.6578947,4.80737263 
38811.2712987,3.42075158 9.57894737,3.42075158 Z M9.57894737,4.78917263 C10.5317492,4.78917263 11.2894737,5.54690158 11.2894737,6.49969895 C11.2894737,7.45249632 10.5317492,8.21022526 9.57894737,8.21022526 C8.62614555,8.21022526 7.86842105,7.45249632 7.86842105,6.49969895 C7.86842105,5.54690158 8.62614555,4.78917263 9.57894737,4.78917263 Z" id="Shape"></path>
389            </g>
390        </g>
391    </g>
392</svg>            <span class="u__va--middle">2.960</span>
393        </div>
394        </div>
395            </div>
396        </div>
397
398            </div>
399</div>
400                                <div  class="brick ">
401    <div class="brick__inner">
402        <div data-detail="https://madewithsvelte.com/advviz" class="brick__image">
403
404
405            
406                <div class="brick__image-inner "
407                     id="js-image-4470"
408                     v-lazy-bg="'https://madewithnetworkfra.fra1.digitaloceanspaces.com/spatie-space-production/30170/advviz-1.jpg'"
409                    style=" ">
410
411                </div>
412
413            
414
415        </div>
416
417        <div class="brick__caption">
418                        <div class="brick__caption-upper">
419                <a  href="https://madewithsvelte.com/advviz" class="brick__title">
420                    AdvViz
421                </a>
422                <span class="brick__tagline">
423                Advanced Visualization Generator
424            </span>
425            </div>
426            <div class="brick__caption-lower">
427                <div class="pull-left">
428                    
429                                            <a href="/web-app">#Web app</a>
430                                                                    <a href="/charts">#Charts</a>
431                                                            </div>
432                <div class="pull-right">
433            <div class="brick__views">
434            <svg class="svg-inline u__va--middle" width="20px" height="13px" viewBox="0 0 20 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
435    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
436    <title>icon-eye-dark</title>
437    <desc>Created with Sketch.</desc>
438    <defs></defs>
439    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
440        <g id="Icons" transform="translate(-313.000000, -230.000000)" fill-rule="nonzero" fill="#435B71">
441            <g id="icon-eye-dark" transform="translate(313.000000, 230.000000)">
442                <path d="M9.57827924,0.0932647368 C5.40166592,0.0977121053 2.23909537,3.28527789 0.162366374,6.09013053 C-0.0164829778,6.33193046 -0.0164829778,6.66216481 0.162366374,6.90396474 C2.23923803,9.71401737 5.40085034,12.9011726 9.57827924,12.9068174 C9.57872397,12.9068178 9.57916871,12.9068178 9.57961345,12.9068174 C13.7562192,12.90237 16.9187977,9.71477 18.9955264,6.90995158 C19.1743758,6.66815165 19.1743758,6.3379173 18.9955264,6.09611737 C16.9186536,3.28603053 13.7570499,0.0989094737 9.57961345,0.0932647368 C9.57916871,0.0932643033 9.57872397,0.0932643033 9.57827924,0.0932647368 L9.57827924,0.0932647368 Z M9.57827924,1.46168579 L9.57961345,1.46168579 C12.8675916,1.46681737 15.5988249,3.96846211 17.5569468,6.50236737 C15.5985806,9.03230421 12.8660264,11.5341884 9.57961345,11.5383963 C6.29104758,11.5339489 3.55933568,9.03192789 1.60094367,6.49771474 C3.55930832,3.96777789 6.29185563,1.46589368 9.57827718,1.46168579 L9.57827924,1.46168579 Z" id="Shape"></path>
443                <path d="M9.57894737,3.42075158 C7.88659608,3.42075158 6.5,4.80737263 6.5,6.49969895 C6.5,8.19205947 7.88659608,9.57864632 9.57894737,9.57864632 C11.2712987,9.57864632 12.6578947,8.19205947 12.6578947,6.49969895 C12.6578947,4.80737263 11.2712987,3.42075158 9.57894737,3.42075158 Z M9.57894737,4.78917263 C10.5317492,4.78917263 11.2894737,5.54690158 11.2894737,6.49969895 C11.2894737,7.45249632 10.5317492,8.21022526 9.57894737,8.21022526 C8.62614555,8.21022526 7.86842105,7.45249632 7.86842105,6.49969895 C7.86842105,5.54690158 8.62614555,4.78917263 9.57894737,4.78917263 Z" id="Shape"></path>
444            </g>
445        </g>
446    </g>
447</svg>
447            <span class="u__va--middle">3.057</span>
448        </div>
449        </div>
450            </div>
451        </div>
452
453            </div>
454</div>
455                                <div  class="brick ">
456    <div class="brick__inner">
457        <div data-detail="https://madewithsvelte.com/pancake" class="brick__image">
458
459
460            
461                <div class="brick__image-inner "
462                     id="js-image-2152"
463                     v-lazy-bg="'https://madewithnetworkfra.fra1.digitaloceanspaces.com/spatie-space-production/11382/pancake-svelte-charts.jpg'"
464                    style=" ">
465
466                </div>
467
468            
469
470        </div>
471
472        <div class="brick__caption">
473                        <div class="brick__caption-upper">
474                <a  href="https://madewithsvelte.com/pancake" class="brick__title">
475                    Pancake
476                </a>
477                <span class="brick__tagline">
478                Experimental Responsive Charting Library (JS optional)
479            </span>
480            </div>
481            <div class="brick__caption-lower">
482                <div class="pull-left">
483                    
484                                            <a href="/ui-component">#UI Component</a>
485                                                                    <a href="/charts">#Charts</a>
486                                                            </div>
487                <div class="pull-right">
488            <div class="brick__views">
489            <svg class="svg-inline u__va--middle" width="20px" height="13px" viewBox="0 0 20 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
490    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
491    <title>icon-eye-dark</title>
492    <desc>Created with Sketch.</desc>
493    <defs></defs>
494    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
495        <g id="Icons" transform="translate(-313.000000, -230.000000)" fill-rule="nonzero" fill="#435B71">
496            <g id="icon-eye-dark" transform="translate(313.000000, 230.000000)">
497                <path d="M9.57827924,0.0932647368 C5.40166592,0.0977121053 2.23909537,3.28527789 0.162366374,6.09013053 C-0.0164829778,6.33193046 -0.0164829778,6.66216481 0.162366374,6.90396474 C2.23923803,9.71401737 5.40085034,12.9011726 9.57827924,12.9068174 C9.57872397,12.9068178 9.57916871,12.9068178 9.57961345,12.9068174 C13.7562192,12.90237 16.9187977,9.71477 18.9955264,6.90995158 C19.1743758,6.66815165 19.1743758,6.3379173 18.9955264,6.09611737 C16.9186536,3.28603053 13.7570499,0.0989094737 9.57961345,0.0932647368 C9.57916871,0.0932643033 9.57872397,0.0932643033 9.57827924,0.0932647368 L9.57827924,0.0932647368 Z M9.57827924,1.46168579 L9.57961345,1.46168579 C12.8675916,1.46681737 15.5988249,3.96846211 17.5569468,6.50236737 C15.5985806,9.03230421 12.8660264,11.5341884 9.57961345,11.5383963 C6.29104758,11.5339489 3.55933568,9.03192789 1.60094367,6.49771474 C3.55930832,3.96777789 6.29185563,1.46589368 9.57827718,1.46168579 L9.57827924,1.46168579 Z" id="Shape"></path>
498                <path d="M9.57894737,3.42075158 C7.88659608,3.42075158 6.5,4.80737263 6.5,6.49969895 C6.5,8.19205947 7.88659608,9.57864632 9.57894737,9.57864632 C11.2712987,9.57864632 12.6578947,8.19205947 12.6578947,6.49969895 C12.6578947,4.80737263 11.2712987,3.42075158 9.57894737,3.42075158 Z M9.57894737,4.78917263 C10.5317492,4.78917263 11.2894737,5.54690158 11.2894737,6.49969895 C11.2894737,7.45249632 10.5317492,8.21022526 9.57894737,8.21022526 C8.62614555,8.21022526 7.86842105,7.45249632 7.86842105,6.49969895 C7.86842105,5.54690158 8.62614555,4.78917263 9.57894737,4.78917263 Z" id="Shape"></path>
499            </g>
500        </g>
501    </g>
502</svg>            <span class="u__va--middle">17.449</span>
503        </div>
504        </div>
505            </div>
506        </div>
507
508            </div>
509</div>
510                                <div  class="brick ">
511    <div class="brick__inner">
512        <div data-detail="https://madewithsvelte.com/florence" class="brick__image">
513
514
515            
516                <div class="brick__image-inner "
517                     id="js-image-2871"
518                     v-lazy-bg="'https://madewithnetworkfra.fra1.digitaloceanspaces.com/spatie-space-production/25152/florence.jpg'"
519                    style=" ">
520
521                </div>
522
523            
524
525        </div>
526
527        <div class="brick__caption">
528                        <div class="brick__caption-upper">
529                <a  href="https://madewithsvelte.com/florence" class="brick__title">
530                    Florence
531                </a>
532                <span class="brick__tagline">
533                Data Visualization Framework
534            </span>
535            </div>
536            <div class="brick__caption-lower">
537                <div class="pull-left">
538                    
539                                            <a href="/framework">#Framework</a>
540                                                                    <a href="/charts">#Charts</a>
541                                                            </div>
542                <div class="pull-right">
543            <div class="brick__views">
544            <svg class="svg-inline u__va--middle" width="20px" height="13px" viewBox="0 0 20 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
545    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
546    <title>icon-eye-dark</title>
547    <desc>Created with Sketch.</desc>
548    <defs></defs>
549    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
550        <g id="Icons" transform="translate(-313.000000, -230.000000)" fill-rule="nonzero" fill="#435B71">
551            <g id="icon-eye-dark" transform="translate(313.000000, 230.000000)">
552                <path d="M9.57827924,0.0932647368 C5.40166592,0.0977121053 2.23909537,3.28527789 0.162366374,6.09013053 C-0.0164829778,6.33193046 -0.0164829778,6.66216481 0.162366374,6.90396474 C2.23923803,9.71401737 5.40085034,12.9011726 9.57827924,12.9068174 C9.57872397,12.9068178 9.57916871,12.9068178 9.57961345,12.9068174 C13.7562192,12.90237 16.9187977,9.71477 18.9955264,6.90995158 C19.1743758,6.66815165 19.1743758,6.3379173 18.9955264,6.09611737 C16.9186536,3.28603053 13.7570499,0.0989094737 9.57961345,0.0932647368 C9.57916871,0.0932643033 9.57872397,0.0932643033 9.57827924,0.0932647368 L9.57827924,0.0932647368 Z M9.57827924,1.46168579 L9.57961345,1.46168579 C12.8675916,1.46681737 15.5988249,3.96846211 17.5569468,6.50236737 C15.5985806,9.03230421 12.8660264,11.5341884 9.57961345,11.5383963 C6.29104758,11.5339489 3.55933568,9.03192789 1.60094367,6.49771474 C3.55930832,3.96777789 6.29185563,1.46589368 9.57827718,1.46168579 L9.57827924,1.46168579 Z" id="Shape"></path>
553                <path d="M9.57894737,3.42075158 C7.88659608,3.42075158 6.5,4.80737263 6.5,6.49969895 C6.5,8.19205947 7.88659608,9.57864632 9.57894737,9.57864632 C11.2712987,9.57864632 12.6578947,8.19205947 12.6578947,6.49969895 C12.6578947,4.80737263 11.2712987,3.42075158 9.57894737,3.42075158 Z M9.57894737,4.78917263 C10.5317492,4.78917263 11.2894737,5.54690158 11.2894737,6.49969895 C11.2894737,7.45249632 10.5317492,8.21022526 9.57894737,8.21022526 C8.62614555,8.21022526 7.86842105,7.45249632 7.86842105,6.49969895 C7.86842105,5.54690158 8.62614555,4.78917263 9.57894737,4.78917263 Z" id="Shape"></path>
554            </g>
555        </g>
556    </g>
557</svg>            <span class="u__va--middle">6.937</span>
558        </div>
559        </div>
560            </div>
561        </div>
562
563            </div>
564</div>
565                                <div  class="brick ">
566    <div class="brick__inner">
567        <div data-detail="https://madewithsvelte.com/flexmonster" class="brick__image">
568
569
570            
571                <div class="brick__image-inner "
572                     id="js-image-5817"
573                     v-lazy-bg="'https://madewithnetworkfra.fra1.digitaloceanspaces.com/spatie-space-production/33075/flexmonster-pivot-svelte.jpg'"
574                    style=" ">
575
576                </div>
577
578            
579
580        </div>
581
582        <div class="brick__caption">
583                        <div class="brick__caption-upper">
584                <a  href="https://madewithsvelte.com/flexmonster" class="brick__title">
585                    Flexmonster
586                </a>
587                <span class="brick__tagline">
588                Pivot Table &amp; Charts Component
589            </span>
590            </div>
591            <div class="brick__caption-lower">
592                <div class="pull-left">
593                    
594                                            <a href="/ui-component">#UI Component</a>
595                                                                    <a href="/charts">#Charts</a>
596                                                            </div>
597                <div class="pull-right">
598            <div class="brick__views">
599            <svg class="svg-inline u__va--middle" width="20px" height="13px" viewBox="0 0 20 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
600    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
601    <title>icon-eye-dark</title>
602    <desc>Created with Sketch.</desc>
603    <defs></defs>
604    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
605        <g id="Icons" transform="translate(-313.000000, -230.000000)" fill-rule="nonzero" fill="#435B71">
606            <g id="icon-eye-dark" transform="translate(313.000000, 230.000000)">
607                <path d="M9.57827924,0.0932647368 C5.40166592,0.0977121053 2.23909537,3.28527789 0.162366374,6.09013053 C-0.0164829778,6.33193046 -0.0164829778,6.66216481 0.162366374,6.90396474 C2.23923803,9.71401737 5.40085034,12.9011726 9.57827924,12.9068174 C9.57872397,12.9068178 9.57916871,12.9068178 9.57961345,12.9068174 C13.7562192,12.90237 16.9187977,9.71477 18.9955264,6.90995158 C19.1743758,6.66815165 19.1743758,6.3379173 18.9955264,6.09611737 C16.9186536,3.28603053 13.7570499,0.0989094737 9.57961345,0.0932647368 C9.57916871,0.0932643033 9.57872397,0.0932643033 9.57827924,0.0932647368 L9.57827924,0.0932647368 Z M9.57827924,1.46168579 L9.57961345,1.46168579 C12.8675916,1.46681737 15.5988249,3.96846211 17.5569468,6.50236737 C15.5985806,9.03230421 12.8660264,11.5341884 9.57961345,11.5383963 C6.29104758,11.5339489 3.5
6075933568,9.03192789 1.60094367,6.49771474 C3.55930832,3.96777789 6.29185563,1.46589368 9.57827718,1.46168579 L9.57827924,1.46168579 Z" id="Shape"></path>
608                <path d="M9.57894737,3.42075158 C7.88659608,3.42075158 6.5,4.80737263 6.5,6.49969895 C6.5,8.19205947 7.88659608,9.57864632 9.57894737,9.57864632 C11.2712987,9.57864632 12.6578947,8.19205947 12.6578947,6.49969895 C12.6578947,4.80737263 11.2712987,3.42075158 9.57894737,3.42075158 Z M9.57894737,4.78917263 C10.5317492,4.78917263 11.2894737,5.54690158 11.2894737,6.49969895 C11.2894737,7.45249632 10.5317492,8.21022526 9.57894737,8.21022526 C8.62614555,8.21022526 7.86842105,7.45249632 7.86842105,6.49969895 C7.86842105,5.54690158 8.62614555,4.78917263 9.57894737,4.78917263 Z" id="Shape"></path>
609            </g>
610        </g>
611    </g>
612</svg>            <span class="u__va--middle">941</span>
613        </div>
614        </div>
615            </div>
616        </div>
617
618            </div>
619</div>
620                                <div  class="brick ">
621    <div class="brick__inner">
622        <div data-detail="https://madewithsvelte.com/flowbite-svelte-chart" class="brick__image">
623
624
625                            <video
626                        muted
627                        autoplay
628                        playsinline
629                        loop
630                        class="brick__video">
631                    <source src="https://madewithvuejs.com/storage/33360/flowbite-svelte-chart-k.mp4" type="video/mp4">
632                </video>
633            
634
635        </div>
636
637        <div class="brick__caption">
638                        <div class="brick__caption-upper">
639                <a  href="https://madewithsvelte.com/flowbite-svelte-chart" class="brick__title">
640                    Flowbite Svelte Charts
641                </a>
642                <span class="brick__tagline">
643                Chart Components
644            </span>
645            </div>
646            <div class="brick__caption-lower">
647                <div class="pull-left">
648                    
649                                            <a href="/ui-component">#UI Component</a>
650                                                                    <a href="/charts">#Charts</a>
651                                                            </div>
652                <div class="pull-right">
653            <div class="brick__views">
654            <svg class="svg-inline u__va--middle" width="20px" height="13px" viewBox="0 0 20 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
655    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
656    <title>icon-eye-dark</title>
657    <desc>Created with Sketch.</desc>
658    <defs></defs>
659    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
660        <g id="Icons" transform="translate(-313.000000, -230.000000)" fill-rule="nonzero" fill="#435B71">
661            <g id="icon-eye-dark" transform="translate(313.000000, 230.000000)">
662                <path d="M9.57827924,0.0932647368 C5.40166592,0.0977121053 2.23909537,3.28527789 0.162366374,6.09013053 C-0.0164829778,6.33193046 -0.0164829778,6.66216481 0.162366374,6.90396474 C2.23923803,9.71401737 5.40085034,12.9011726 9.57827924,12.9068174 C9.57872397,12.9068178 9.57916871,12.9068178 9.57961345,12.9068174 C13.7562192,12.90237 16.9187977,9.71477 18.9955264,6.90995158 C19.1743758,6.66815165 19.1743758,6.3379173 18.9955264,6.09611737 C16.9186536,3.28603053 13.7570499,0.0989094737 9.57961345,0.0932647368 C9.57916871,0.0932643033 9.57872397,0.0932643033 9.57827924,0.0932647368 L9.57827924,0.0932647368 Z M9.57827924,1.46168579 L9.57961345,1.46168579 C12.8675916,1.46681737 15.5988249,3.96846211 17.5569468,6.50236737 C15.5985806,9.03230421 12.8660264,11.5341884 9.57961345,11.5383963 C6.29104758,11.5339489 3.55933568,9.03192789 1.60094367,6.49771474 C3.55930832,3.96777789 6.29185563,1.46589368 9.57827718,1.46168579 L9.57827924,1.46168579 Z" id="Shape"></path>
663                <path d="M9.57894737,3.42075158 C7.88659608,3.42075158 6.5,4.80737263 6.5,6.49969895 C6.5,8.19205947 7.88659608,9.57864632 9.57894737,9.57864632 C11.2712987,9.57864632 12.6578947,8.19205947 12.6578947,6.49969895 C12.6578947,4.80737263 
66311.2712987,3.42075158 9.57894737,3.42075158 Z M9.57894737,4.78917263 C10.5317492,4.78917263 11.2894737,5.54690158 11.2894737,6.49969895 C11.2894737,7.45249632 10.5317492,8.21022526 9.57894737,8.21022526 C8.62614555,8.21022526 7.86842105,7.45249632 7.86842105,6.49969895 C7.86842105,5.54690158 8.62614555,4.78917263 9.57894737,4.78917263 Z" id="Shape"></path>
664            </g>
665        </g>
666    </g>
667</svg>            <span class="u__va--middle">468</span>
668        </div>
669        </div>
670            </div>
671        </div>
672
673            </div>
674</div>
675                                <div  class="brick ">
676    <div class="brick__inner">
677        <div data-detail="https://madewithsvelte.com/dhtmlx-svelte-gantt" class="brick__image">
678
679
680            
681                <div class="brick__image-inner "
682                     id="js-image-2973"
683                     v-lazy-bg="'https://madewithnetworkfra.fra1.digitaloceanspaces.com/spatie-space-production/30175/dhtmlx-gantt-svelte-2.jpg'"
684                    style=" ">
685
686                </div>
687
688            
689
690        </div>
691
692        <div class="brick__caption">
693                        <div class="brick__caption-upper">
694                <a  href="https://madewithsvelte.com/dhtmlx-svelte-gantt" class="brick__title">
695                    DHTMLX Svelte Gantt
696                </a>
697                <span class="brick__tagline">
698                Gantt Chart Component
699            </span>
700            </div>
701            <div class="brick__caption-lower">
702                <div class="pull-left">
703                    
704                                            <a href="/ui-component">#UI Component</a>
705                                                                    <a href="/charts">#Charts</a>
706                                                            </div>
707                <div class="pull-right">
708            <div class="brick__views">
709            <svg class="svg-inline u__va--middle" width="20px" height="13px" viewBox="0 0 20 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
710    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
711    <title>icon-eye-dark</title>
712    <desc>Created with Sketch.</desc>
713    <defs></defs>
714    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
715        <g id="Icons" transform="translate(-313.000000, -230.000000)" fill-rule="nonzero" fill="#435B71">
716            <g id="icon-eye-dark" transform="translate(313.000000, 230.000000)">
717                <path d="M9.57827924,0.0932647368 C5.40166592,0.0977121053 2.23909537,3.28527789 0.162366374,6.09013053 C-0.0164829778,6.33193046 -0.0164829778,6.66216481 0.162366374,6.90396474 C2.23923803,9.71401737 5.40085034,12.9011726 9.57827924,12.9068174 C9.57872397,12.9068178 9.57916871,12.9068178 9.57961345,12.9068174 C13.7562192,12.90237 16.9187977,9.71477 18.9955264,6.90995158 C19.1743758,6.66815165 19.1743758,6.3379173 18.9955264,6.09611737 C16.9186536,3.28603053 13.7570499,0.0989094737 9.57961345,0.0932647368 C9.57916871,0.0932643033 9.57872397,0.0932643033 9.57827924,0.0932647368 L9.57827924,0.0932647368 Z M9.57827924,1.46168579 L9.57961345,1.46168579 C12.8675916,1.46681737 15.5988249,3.96846211 17.5569468,6.50236737 C15.5985806,9.03230421 12.8660264,11.5341884 9.57961345,11.5383963 C6.29104758,11.5339489 3.55933568,9.03192789 1.60094367,6.49771474 C3.55930832,3.96777789 6.29185563,1.46589368 9.57827718,1.46168579 L9.57827924,1.46168579 Z" id="Shape"></path>
718                <path d="M9.57894737,3.42075158 C7.88659608,3.42075158 6.5,4.80737263 6.5,6.49969895 C6.5,8.19205947 7.88659608,9.57864632 9.57894737,9.57864632 C11.2712987,9.57864632 12.6578947,8.19205947 12.6578947,6.49969895 C12.6578947,4.80737263 11.2712987,3.42075158 9.57894737,3.42075158 Z M9.57894737,4.78917263 C10.5317492,4.78917263 11.2894737,5.54690158 11.2894737,6.49969895 C11.2894737,7.45249632 10.5317492,8.21022526 9.57894737,8.21022526 C8.62614555,8.21022526 7.86842105,7.45249632 7.86842105,6.49969895 C7.86842105,5.54690158 8.62614555,4.78917263 9.57894737,4.78917263 Z" id="Shape"></path>
719            </g>
720        </g>
721    </g>
722</svg>
722            <span class="u__va--middle">3.502</span>
723        </div>
724        </div>
725            </div>
726        </div>
727
728            </div>
729</div>
730                                <div  class="brick ">
731    <div class="brick__inner">
732        <div data-detail="https://madewithsvelte.com/svelte-heatmap" class="brick__image">
733
734
735            
736                <div class="brick__image-inner "
737                     id="js-image-2364"
738                     v-lazy-bg="'https://madewithnetworkfra.fra1.digitaloceanspaces.com/spatie-space-production/14898/svelte-heatmap.jpg'"
739                    style=" ">
740
741                </div>
742
743            
744
745        </div>
746
747        <div class="brick__caption">
748                        <div class="brick__caption-upper">
749                <a  href="https://madewithsvelte.com/svelte-heatmap" class="brick__title">
750                    Svelte Heatmap
751                </a>
752                <span class="brick__tagline">
753                Svelte version of Github&#039;s Contribution Graph
754            </span>
755            </div>
756            <div class="brick__caption-lower">
757                <div class="pull-left">
758                    
759                                            <a href="/ui-component">#UI Component</a>
760                                                                    <a href="/charts">#Charts</a>
761                                                            </div>
762                <div class="pull-right">
763            <div class="brick__views">
764            <svg class="svg-inline u__va--middle" width="20px" height="13px" viewBox="0 0 20 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
765    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
766    <title>icon-eye-dark</title>
767    <desc>Created with Sketch.</desc>
768    <defs></defs>
769    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
770        <g id="Icons" transform="translate(-313.000000, -230.000000)" fill-rule="nonzero" fill="#435B71">
771            <g id="icon-eye-dark" transform="translate(313.000000, 230.000000)">
772                <path d="M9.57827924,0.0932647368 C5.40166592,0.0977121053 2.23909537,3.28527789 0.162366374,6.09013053 C-0.0164829778,6.33193046 -0.0164829778,6.66216481 0.162366374,6.90396474 C2.23923803,9.71401737 5.40085034,12.9011726 9.57827924,12.9068174 C9.57872397,12.9068178 9.57916871,12.9068178 9.57961345,12.9068174 C13.7562192,12.90237 16.9187977,9.71477 18.9955264,6.90995158 C19.1743758,6.66815165 19.1743758,6.3379173 18.9955264,6.09611737 C16.9186536,3.28603053 13.7570499,0.0989094737 9.57961345,0.0932647368 C9.57916871,0.0932643033 9.57872397,0.0932643033 9.57827924,0.0932647368 L9.57827924,0.0932647368 Z M9.57827924,1.46168579 L9.57961345,1.46168579 C12.8675916,1.46681737 15.5988249,3.96846211 17.5569468,6.50236737 C15.5985806,9.03230421 12.8660264,11.5341884 9.57961345,11.5383963 C6.29104758,11.5339489 3.55933568,9.03192789 1.60094367,6.49771474 C3.55930832,3.96777789 6.29185563,1.46589368 9.57827718,1.46168579 L9.57827924,1.46168579 Z" id="Shape"></path>
773                <path d="M9.57894737,3.42075158 C7.88659608,3.42075158 6.5,4.80737263 6.5,6.49969895 C6.5,8.19205947 7.88659608,9.57864632 9.57894737,9.57864632 C11.2712987,9.57864632 12.6578947,8.19205947 12.6578947,6.49969895 C12.6578947,4.80737263 11.2712987,3.42075158 9.57894737,3.42075158 Z M9.57894737,4.78917263 C10.5317492,4.78917263 11.2894737,5.54690158 11.2894737,6.49969895 C11.2894737,7.45249632 10.5317492,8.21022526 9.57894737,8.21022526 C8.62614555,8.21022526 7.86842105,7.45249632 7.86842105,6.49969895 C7.86842105,5.54690158 8.62614555,4.78917263 9.57894737,4.78917263 Z" id="Shape"></path>
774            </g>
775        </g>
776    </g>
777</svg>            <span class="u__va--middle">5.774</span>
778        </div>
779        </div>
780            </div>
781        </div>
782
783            </div>
784</div>
785                                <div  class="brick ">
786    <div class="brick__inner">
787        <div data-detail="https://madewithsvelte.com/svelte-fusioncharts" class="brick__image">
788
789
790            
791                <div class="brick__image-inner "
792                     id="js-image-2073"
793                     v-lazy-bg="'https://madewithnetworkfra.fra1.digitaloceanspaces.com/spatie-space-production/9832/svelteFusioncharts-1.jpg'"
794                    style=" ">
795
796                </div>
797
798            
799
800        </div>
801
802        <div class="brick__caption">
803                        <div class="brick__caption-upper">
804                <a  href="https://madewithsvelte.com/svelte-fusioncharts" class="brick__title">
805                    Svelte FusionCharts
806                </a>
807                <span class="brick__tagline">
808                Interactive &amp; Responsive Charts
809            </span>
810            </div>
811            <div class="brick__caption-lower">
812                <div class="pull-left">
813                    
814                                            <a href="/ui-component">#UI Component</a>
815                                                                    <a href="/charts">#Charts</a>
816                                                            </div>
817                <div class="pull-right">
818            <div class="brick__views">
819            <svg class="svg-inline u__va--middle" width="20px" height="13px" viewBox="0 0 20 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
820    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
821    <title>icon-eye-dark</title>
822    <desc>Created with Sketch.</desc>
823    <defs></defs>
824    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
825        <g id="Icons" transform="translate(-313.000000, -230.000000)" fill-rule="nonzero" fill="#435B71">
826            <g id="icon-eye-dark" transform="translate(313.000000, 230.000000)">
827                <path d="M9.57827924,0.0932647368 C5.40166592,0.0977121053 2.23909537,3.28527789 0.162366374,6.09013053 C-0.0164829778,6.33193046 -0.0164829778,6.66216481 0.162366374,6.90396474 C2.23923803,9.71401737 5.40085034,12.9011726 9.57827924,12.9068174 C9.57872397,12.9068178 9.57916871,12.9068178 9.57961345,12.9068174 C13.7562192,12.90237 16.9187977,9.71477 18.9955264,6.90995158 C19.1743758,6.66815165 19.1743758,6.3379173 18.9955264,6.09611737 C16.9186536,3.28603053 13.7570499,0.0989094737 9.57961345,0.0932647368 C9.57916871,0.0932643033 9.57872397,0.0932643033 9.57827924,0.0932647368 L9.57827924,0.0932647368 Z M9.57827924,1.46168579 L9.57961345,1.46168579 C12.8675916,1.46681737 15.5988249,3.96846211 17.5569468,6.50236737 C15.5985806,9.03230421 12.8660264,11.5341884 9.57961345,11.5383963 C6.29104758,11.5339489 3.55933568,9.03192789 1.60094367,6.49771474 C3.55930832,3.96777789 6.29185563,1.46589368 9.57827718,1.46168579 L9.57827924,1.46168579 Z" id="Shape"></path>
828                <path d="M9.57894737,3.42075158 C7.88659608,3.42075158 6.5,4.80737263 6.5,6.49969895 C6.5,8.19205947 7.88659608,9.57864632 9.57894737,9.57864632 C11.2712987,9.57864632 12.6578947,8.19205947 12.6578947,6.49969895 C12.6578947,4.80737263 11.2712987,3.42075158 9.57894737,3.42075158 Z M9.57894737,4.78917263 C10.5317492,4.78917263 11.2894737,5.54690158 11.2894737,6.49969895 C11.2894737,7.45249632 10.5317492,8.21022526 9.57894737,8.21022526 C8.62614555,8.21022526 7.86842105,7.45249632 7.86842105,6.49969895 C7.86842105,5.54690158 8.62614555,4.78917263 9.57894737,4.78917263 Z" id="Shape"></path>
829            </g>
830        </g>
831    </g>
832</svg>            <span class="u__va--middle">13.208</span>
833        </div>
834        </div>
835            </div>
836        </div>
837
838            </div>
839</div>
840                                <div  class="brick ">
841    <div class="brick__inner">
842        <div data-detail="https://madewithsvelte.com/svelte-gantt" class="brick__image">
843
844
845            
846                <div class="brick__image-inner "
847                     id="js-image-3312"
848                     v-lazy-bg="'https://madewithnetworkfra.fra1.digitaloceanspaces.com/spatie-space-production/28293/svelte-gantt.jpg'"
849                    style=" ">
850
851                </div>
852
853            
854
855        </div>
856
857        <div class="brick__caption">
858                        <div class="brick__caption-upper">
859                <a  href="https://madewithsvelte.com/svelte-gantt" class="brick__title">
860                    Svelte Gantt
861                </a>
862                <span class="brick__tagline">
863                Gantt Chart Component
864            </span>
865            </div>
866            <div class="brick__caption-lower">
867                <div class="pull-left">
868                    
869                                            <a href="/ui-component">#UI Component</a>
870                                                                    <a href="/charts">#Charts</a>
871                                                            </div>
872                <div class="pull-right">
873            <div class="brick__views">
874            <svg class="svg-inline u__va--middle" width="20px" height="13px" viewBox="0 0 20 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
875    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
876    <title>icon-eye-dark</title>
877    <desc>Created with Sketch.</desc>
878    <defs></defs>
879    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
880        <g id="Icons" transform="translate(-313.000000, -230.000000)" fill-rule="nonzero" fill="#435B71">
881            <g id="icon-eye-dark" transform="translate(313.000000, 230.000000)">
882                <path d="M9.57827924,0.0932647368 C5.40166592,0.0977121053 2.23909537,3.28527789 0.162366374,6.09013053 C-0.0164829778,6.33193046 -0.0164829778,6.66216481 0.162366374,6.90396474 C2.23923803,9.71401737 5.40085034,12.9011726 9.57827924,12.9068174 C9.57872397,12.9068178 9.57916871,12.9068178 9.57961345,12.9068174 C13.7562192,12.90237 16.9187977,9.71477 18.9955264,6.90995158 C19.1743758,6.66815165 19.1743758,6.3379173 18.9955264,6.09611737 C16.9186536,3.28603053 13.7570499,0.0989094737 9.57961345,0.0932647368 C9.57916871,0.0932643033 9.57872397,0.0932643033 9.57827924,0.0932647368 L9.57827924,0.0932647368 Z M9.57827924,1.46168579 L9.57961345,1.46168579 C12.8675916,1.46681737 15.5988249,3.96846211 17.5569468,6.50236737 C15.5985806,9.03230421 12.8660264,11.5341884 9.57961345,11.5383963 C6.29104758,11.5339489 3.5
8825933568,9.03192789 1.60094367,6.49771474 C3.55930832,3.96777789 6.29185563,1.46589368 9.57827718,1.46168579 L9.57827924,1.46168579 Z" id="Shape"></path>
883                <path d="M9.57894737,3.42075158 C7.88659608,3.42075158 6.5,4.80737263 6.5,6.49969895 C6.5,8.19205947 7.88659608,9.57864632 9.57894737,9.57864632 C11.2712987,9.57864632 12.6578947,8.19205947 12.6578947,6.49969895 C12.6578947,4.80737263 11.2712987,3.42075158 9.57894737,3.42075158 Z M9.57894737,4.78917263 C10.5317492,4.78917263 11.2894737,5.54690158 11.2894737,6.49969895 C11.2894737,7.45249632 10.5317492,8.21022526 9.57894737,8.21022526 C8.62614555,8.21022526 7.86842105,7.45249632 7.86842105,6.49969895 C7.86842105,5.54690158 8.62614555,4.78917263 9.57894737,4.78917263 Z" id="Shape"></path>
884            </g>
885        </g>
886    </g>
887</svg>            <span class="u__va--middle">9.562</span>
888        </div>
889        </div>
890            </div>
891        </div>
892
893            </div>
894</div>
895                                <div  class="brick ">
896    <div class="brick__inner">
897        <div data-detail="https://madewithsvelte.com/layer-cake" class="brick__image">
898
899
900            
901                <div class="brick__image-inner "
902                     id="js-image-3573"
903                     v-lazy-bg="'https://madewithnetworkfra.fra1.digitaloceanspaces.com/spatie-space-production/28734/layercake.jpg'"
904                    style=" ">
905
906                </div>
907
908            
909
910        </div>
911
912        <div class="brick__caption">
913                        <div class="brick__caption-upper">
914                <a  href="https://madewithsvelte.com/layer-cake" class="brick__title">
915                    Layer Cake
916                </a>
917                <span class="brick__tagline">
918                Graphics Framework
919            </span>
920            </div>
921            <div class="brick__caption-lower">
922                <div class="pull-left">
923                    
924                                            <a href="/framework">#Framework</a>
925                                                                    <a href="/charts">#Charts</a>
926                                                            </div>
927                <div class="pull-right">
928            <div class="brick__views">
929            <svg class="svg-inline u__va--middle" width="20px" height="13px" viewBox="0 0 20 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
930    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
931    <title>icon-eye-dark</title>
932    <desc>Created with Sketch.</desc>
933    <defs></defs>
934    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
935        <g id="Icons" transform="translate(-313.000000, -230.000000)" fill-rule="nonzero" fill="#435B71">
936            <g id="icon-eye-dark" transform="translate(313.000000, 230.000000)">
937                <path d="M9.57827924,0.0932647368 C5.40166592,0.0977121053 2.23909537,3.28527789 0.162366374,6.09013053 C-0.0164829778,6.33193046 -0.0164829778,6.66216481 0.162366374,6.90396474 C2.23923803,9.71401737 5.40085034,12.9011726 9.57827924,12.9068174 C9.57872397,12.9068178 9.57916871,12.9068178 9.57961345,12.9068174 C13.7562192,12.90237 16.9187977,9.71477 18.9955264,6.90995158 C19.1743758,6.66815165 19.1743758,6.3379173 18.9955264,6.09611737 C16.9186536,3.28603053 13.7570499,0.0989094737 9.57961345,0.0932647368 C9.57916871,0.0932643033 9.57872397,0.0932643033 9.57827924,0.0932647368 L9.57827924,0.0932647368 Z M9.57827924,1.46168579 L9.57961345,1.46168579 C12.8675916,1.46681737 15.5988249,3.96846211 17.5569468,6.50236737 C15.5985806,9.03230421 12.8660264,11.5341884 9.57961345,11.5383963 C6.29104758,11.5339489 3.55933568,9.03192789 1.60094367,6.49771474 C3.55930832,3.96777789 6.29185563,1.46589368 9.57827718,1.46168579 L9.57827924,1.46168579 Z" id="Shape"></path>
938                <path d="M9.57894737,3.42075158 C7.88659608,3.42075158 6.5,4.80737263 6.5,6.49969895 C6.5,8.19205947 7.88659608,9.57864632 9.57894737,9.57864632 C11.2712987,9.57864632 12.6578947,8.19205947 12.6578947,6.49969895 C12.6578947,4.80737263 
93811.2712987,3.42075158 9.57894737,3.42075158 Z M9.57894737,4.78917263 C10.5317492,4.78917263 11.2894737,5.54690158 11.2894737,6.49969895 C11.2894737,7.45249632 10.5317492,8.21022526 9.57894737,8.21022526 C8.62614555,8.21022526 7.86842105,7.45249632 7.86842105,6.49969895 C7.86842105,5.54690158 8.62614555,4.78917263 9.57894737,4.78917263 Z" id="Shape"></path>
939            </g>
940        </g>
941    </g>
942</svg>            <span class="u__va--middle">9.240</span>
943        </div>
944        </div>
945            </div>
946        </div>
947
948            </div>
949</div>
950                                <div  class="brick ">
951    <div class="brick__inner">
952        <div data-detail="https://madewithsvelte.com/matterviz" class="brick__image">
953
954
955            
956                <div class="brick__image-inner "
957                     id="js-image-6396"
958                     v-lazy-bg="'https://madewithnetworkfra.fra1.digitaloceanspaces.com/spatie-space-production/34162/matterviz.jpg'"
959                    style=" ">
960
961                </div>
962
963            
964
965        </div>
966
967        <div class="brick__caption">
968                        <div class="brick__caption-upper">
969                <a  href="https://madewithsvelte.com/matterviz" class="brick__title">
970                    MatterViz
971                </a>
972                <span class="brick__tagline">
973                Interactive Visualizations for Materials Science
974            </span>
975            </div>
976            <div class="brick__caption-lower">
977                <div class="pull-left">
978                    
979                                            <a href="/ui-component">#UI Component</a>
980                                                                    <a href="/charts">#Charts</a>
981                                                            </div>
982                <div class="pull-right">
983            <div class="brick__views">
984            <svg class="svg-inline u__va--middle" width="20px" height="13px" viewBox="0 0 20 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
985    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
986    <title>icon-eye-dark</title>
987    <desc>Created with Sketch.</desc>
988    <defs></defs>
989    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
990        <g id="Icons" transform="translate(-313.000000, -230.000000)" fill-rule="nonzero" fill="#435B71">
991            <g id="icon-eye-dark" transform="translate(313.000000, 230.000000)">
992                <path d="M9.57827924,0.0932647368 C5.40166592,0.0977121053 2.23909537,3.28527789 0.162366374,6.09013053 C-0.0164829778,6.33193046 -0.0164829778,6.66216481 0.162366374,6.90396474 C2.23923803,9.71401737 5.40085034,12.9011726 9.57827924,12.9068174 C9.57872397,12.9068178 9.57916871,12.9068178 9.57961345,12.9068174 C13.7562192,12.90237 16.9187977,9.71477 18.9955264,6.90995158 C19.1743758,6.66815165 19.1743758,6.3379173 18.9955264,6.09611737 C16.9186536,3.28603053 13.7570499,0.0989094737 9.57961345,0.0932647368 C9.57916871,0.0932643033 9.57872397,0.0932643033 9.57827924,0.0932647368 L9.57827924,0.0932647368 Z M9.57827924,1.46168579 L9.57961345,1.46168579 C12.8675916,1.46681737 15.5988249,3.96846211 17.5569468,6.50236737 C15.5985806,9.03230421 12.8660264,11.5341884 9.57961345,11.5383963 C6.29104758,11.5339489 3.55933568,9.03192789 1.60094367,6.49771474 C3.55930832,3.96777789 6.29185563,1.46589368 9.57827718,1.46168579 L9.57827924,1.46168579 Z" id="Shape"></path>
993                <path d="M9.57894737,3.42075158 C7.88659608,3.42075158 6.5,4.80737263 6.5,6.49969895 C6.5,8.19205947 7.88659608,9.57864632 9.57894737,9.57864632 C11.2712987,9.57864632 12.6578947,8.19205947 12.6578947,6.49969895 C12.6578947,4.80737263 11.2712987,3.42075158 9.57894737,3.42075158 Z M9.57894737,4.78917263 C10.5317492,4.78917263 11.2894737,5.54690158 11.2894737,6.49969895 C11.2894737,7.45249632 10.5317492,8.21022526 9.57894737,8.21022526 C8.62614555,8.21022526 7.86842105,7.45249632 7.86842105,6.49969895 C7.86842105,5.54690158 8.62614555,4.78917263 9.57894737,4.78917263 Z" id="Shape"></path>
994            </g>
995        </g>
996    </g>
997</svg>
997            <span class="u__va--middle">89</span>
998        </div>
999        </div>
1000            </div>
1001        </div>
1002
1003            </div>
1004</div>
1005                                <div  class="brick ">
1006    <div class="brick__inner">
1007        <div data-detail="https://madewithsvelte.com/datavisualizationwithsvelte" class="brick__image">
1008
1009
1010            
1011                <div class="brick__image-inner "
1012                     id="js-image-5569"
1013                     v-lazy-bg="'https://madewithnetworkfra.fra1.digitaloceanspaces.com/spatie-space-production/32711/datavisualizationwithsvelte.jpg'"
1014                    style=" ">
1015
1016                </div>
1017
1018            
1019
1020        </div>
1021
1022        <div class="brick__caption">
1023                        <div class="brick__caption-upper">
1024                <a  href="https://madewithsvelte.com/datavisualizationwithsvelte" class="brick__title">
1025                    Data Visualization With Svelte
1026                </a>
1027                <span class="brick__tagline">
1028                Tutorial Series for Data Visualization with Svelte &amp; D3
1029            </span>
1030            </div>
1031            <div class="brick__caption-lower">
1032                <div class="pull-left">
1033                    
1034                                            <a href="/website">#Website</a>
1035                                                                    <a href="/charts">#Charts</a>
1036                                                                    <a href="/learning-resource">#Learning Resource</a>
1037                                                            </div>
1038                <div class="pull-right">
1039            <div class="brick__views">
1040            <svg class="svg-inline u__va--middle" width="20px" height="13px" viewBox="0 0 20 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
1041    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
1042    <title>icon-eye-dark</title>
1043    <desc>Created with Sketch.</desc>
1044    <defs></defs>
1045    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
1046        <g id="Icons" transform="translate(-313.000000, -230.000000)" fill-rule="nonzero" fill="#435B71">
1047            <g id="icon-eye-dark" transform="translate(313.000000, 230.000000)">
1048                <path d="M9.57827924,0.0932647368 C5.40166592,0.0977121053 2.23909537,3.28527789 0.162366374,6.09013053 C-0.0164829778,6.33193046 -0.0164829778,6.66216481 0.162366374,6.90396474 C2.23923803,9.71401737 5.40085034,12.9011726 9.57827924,12.9068174 C9.57872397,12.9068178 9.57916871,12.9068178 9.57961345,12.9068174 C13.7562192,12.90237 16.9187977,9.71477 18.9955264,6.90995158 C19.1743758,6.66815165 19.1743758,6.3379173 18.9955264,6.09611737 C16.9186536,3.28603053 13.7570499,0.0989094737 9.57961345,0.0932647368 C9.57916871,0.0932643033 9.57872397,0.0932643033 9.57827924,0.0932647368 L9.57827924,0.0932647368 Z M9.57827924,1.46168579 L9.57961345,1.46168579 C12.8675916,1.46681737 15.5988249,3.96846211 17.5569468,6.50236737 C15.5985806,9.03230421 12.8660264,11.5341884 9.57961345,11.5383963 C6.29104758,11.5339489 3.55933568,9.03192789 1.60094367,6.49771474 C3.55930832,3.96777789 6.29185563,1.46589368 9.57827718,1.46168579 L9.57827924,1.46168579 Z" id="Shape"></path>
1049                <path d="M9.57894737,3.42075158 C7.88659608,3.42075158 6.5,4.80737263 6.5,6.49969895 C6.5,8.19205947 7.88659608,9.57864632 9.57894737,9.57864632 C11.2712987,9.57864632 12.6578947,8.19205947 12.6578947,6.49969895 C12.6578947,4.80737263 11.2712987,3.42075158 9.57894737,3.42075158 Z M9.57894737,4.78917263 C10.5317492,4.78917263 11.2894737,5.54690158 11.2894737,6.49969895 C11.2894737,7.45249632 10.5317492,8.21022526 9.57894737,8.21022526 C8.62614555,8.21022526 7.86842105,7.45249632 7.86842105,6.49969895 C7.86842105,5.54690158 8.62614555,4.78917263 9.57894737,4.78917263 Z" id="Shape"></path>
1050            </g>
1051        </g>
1052    </g>
1053</svg>            <span class="u__va--middle">1.777</span>
1054        </div>
1055        </div>
1056            </div>
1057        </div>
1058
1059            </div>
1060</div>
1061            
1062</div>
1063
1064
1065            <div class="row">
1066            <div class="col-xs-12 text-center">
1067                <ul class="pagination">
1068        
1069                    <li class="page-item disabled"><span class="page-link">&laquo;</span></li>
1070        
1071        
1072                    
1073            
1074            
1075                                                                        <li class="page-item active"><span class="page-link">1</span></li>
1076                                                                                <li class="page-item"><a class="page-link" href="https://madewithsvelte.com/charts?page=2">2</a></li>
1077                                                        
1078        
1079                    <li class="page-item"><a class="page-link" href="https://madewithsvelte.com/charts?page=2" rel="next">&raquo;</a></li>
1080            </ul>
1081
1082            </div>
1083        </div>
1084    
1085
1086        </div>
1087            </div>
1088    <div class="sponsors sponsors--white ">
1089        <div class="container">
1090
1091            
1092                            <div class="sponsors__title">
1093                                            COMMUNITY PARTNERS
1094                                    </div>
1095                <div class="sponsors__wrap">
1096                
1097                    
1098
1099                    <a class="sponsors__entry" rel="sponsored" target="_blank"
1100                       href="https://madewithsvelte.com/mwbrick-goto/hhmcpbaygxb9k0hd-dnw5hbwurjua2nwq-yghygjnewbpw094x-gdkpfcs43aj3ov8o">
1101                        <span class="sponsors__img">
1102                            <span><img loading="lazy" src="https://madewithnetworkfra.fra1.digitaloceanspaces.com/spatie-space-production/33756/sentry-dark-%282%29.png" alt=""/></span>
1103                        </span>
1104                        <span class="sponsors__tagline">
1105                            Resolve Svelte performance bottlenecks and errors faster with actionable insights from Sentry
1106                            <span class="sponsors__tagline-link">Learn more</span>
1107                        </span>
1108                    </a>
1109                
1110                    
1111
1112                    <a class="sponsors__entry" rel="sponsored" target="_blank"
1113                       href="https://madewithsvelte.com/mwbrick-goto/yi7bt3lbmceggbru-atntevqxuyqv7wwv-um3pfry8qo0euydi-kwxdyzjcdbmvkidy">
1114                        <span class="sponsors__img">
1115                            <span><img loading="lazy" src="https://madewithnetworkfra.fra1.digitaloceanspaces.com/spatie-space-production/29285/placid.png" alt=""/></span>
1116                        </span>
1117                        <span class="sponsors__tagline">
1118                            Placid is a creative automation API &amp; toolkit that helps you to generate consistent visuals at scale
1119                            <span class="sponsors__tagline-link">Learn more</span>
1120                        </span>
1121                    </a>
1122                                </div>
1123                    </div>
1124    </div>
1125
1126<footer class="footer">
1127    <div class="footer__inner">
1128        <div class="container">
1129            <div class="row">
1130                <div class="col-xs-12">
1131                    <h2 class="footer__title">
1132                        <svg class="svg-inline svg-inline
1133                        icon-sparkles-left" width="60px" height="60px" viewBox="0 0 60 60" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
1134    <!-- Generator: Sketch 47.1 (45422) - http://www.bohemiancoding.com/sketch -->
1135    <title>icon-sparkles-left</title>
1136    <desc>Created with Sketch.</desc>
1137    <defs></defs>
1138    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
1139        <g id="Detailseite-+-Creator" transform="translate(-236.000000, -2155.000000)" fill-rule="nonzero">
1140            <g id="Footer" transform="translate(0.000000, 2103.000000)">
1141                <g id="Title" transform="translate(236.000000, 52.000000)">
1142                    <g id="icon-sparkles-left">
1143                        <path d="M20.625,0 C20.625,15.8334375 12.0684375,30 0,30 C12.0684375,30 20.625,44.1665625 20.625,60 C20.625,44.1665625 29.1815625,30 41.25,30 C29.1815625,30 20.625,15.8334375 20.625,0 Z" id="Shape" fill="#FFE54D"></path>
1144                        <path d="M49.6875,0 C49.6875,7.9171875 45.4096875,15 39.375,15 C45.4096875,15 49.6875,22.08375 49.6875,30 C49.6875,22.08375 53.9653125,15 60,15 C53.9653125,15 49.6875,7.9171875 49.6875,0 Z" id="Shape" fill="#6ADBC6"></path>
1145                        <path d="M45,30 C45,37.9171875 40.7221875,45 34.6875,45 C40.7221875,45 45,52.08375 45,60 C45,52.08375 49.2778125,45 55.3125,45 C49.2778125,45 45,37.9171875 45,30 Z" id="Shape" fill="#FF73C0"></path>
1146                    </g>
1147                </g>
1148            </g>
1149        </g>
1150    </g>
1151</svg> A collection of projects made with Svelte
1152                        <svg class="svg-inline svg-inline icon-sparkles-right" width="60px" height="60px" viewBox="0 0 60 60" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
1153    <!-- Generator: Sketch 47.1 (45422) - http://www.bohemiancoding.com/sketch -->
1154    <title>icon-sparkles-right</title>
1155    <desc>Created with Sketch.</desc>
1156    <defs></defs>
1157    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
1158        <g id="Detailseite-+-Creator" transform="translate(-1007.000000, -2155.000000)" fill-rule="nonzero">
1159            <g id="Footer" transform="translate(0.000000, 2103.000000)">
1160                <g id="Title" transform="translate(236.000000, 52.000000)">
1161                    <g id="icon-sparkles-right" transform="translate(801.000000, 30.000000) scale(-1, 1) translate(-801.000000, -30.000000) translate(771.000000, 0.000000)">
1162                        <path d="M20.625,0 C20.625,15.8334375 12.0684375,30 0,30 C12.0684375,30 20.625,44.1665625 20.625,60 C20.625,44.1665625 29.1815625,30 41.25,30 C29.1815625,30 20.625,15.8334375 20.625,0 Z" id="Shape" fill="#FFE54D"></path>
1163                        <path d="M49.6875,0 C49.6875,7.9171875 45.4096875,15 39.375,15 C45.4096875,15 49.6875,22.08375 49.6875,30 C49.6875,22.08375 53.9653125,15 60,15 C53.9653125,15 49.6875,7.9171875 49.6875,0 Z" id="Shape" fill="#6ADBC6"></path>
1164                        <path d="M45,30 C45,37.9171875 40.7221875,45 34.6875,45 C40.7221875,45 45,52.08375 45,60 C45,52.08375 49.2778125,45 5
11645.3125,45 C49.2778125,45 45,37.9171875 45,30 Z" id="Shape" fill="#FF73C0"></path>
1165                    </g>
1166                </g>
1167            </g>
1168        </g>
1169    </g>
1170</svg>                    </h2>
1171                </div>
1172            </div>
1173            <div class="row" id="newsletter-cta">
1174                <div class="col-xs-12 footer__newsletter">
1175                    <!-- Begin MailChimp Signup Form -->
1176<div id="mc_embed_signup">
1177    <form action="https://madewithsvelte.com/newsletter/subscribe"
1178          method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form"
1179          class="validate js-newsletter" novalidate>
1180        <div id="mc_embed_signup_scroll" class="newsletter-wrap">
1181            <h3 class="footer__title--newsletter">Subscribe to our Newsletter</h3>
1182            <div class="newsletter-wrap-inner">
1183            <div class="form-group">
1184
1185                <div class="mc-field-group ">
1186                    <label for="mce-EMAIL">Email Address </label>
1187                    <input type="email" value="" placeholder="[email protected]" name="EMAIL" class="form-control required email"
1188                           id="mce-EMAIL">
1189                </div>
1190                <div id="mce-responses" class="clear">
1191                    <div class="response js-newsletter-error" id="mce-error-response" style="display:none"></div>
1192                    <div class="response js-newsletter-success" id="mce-success-response" style="display:none"></div>
1193                </div>
1194
1195                
1196                <input type="hidden" name="form_token" class="js-newsletter-token" value="">
1197
1198                <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
1199                <div style="position: absolute; left: -5000px;" aria-hidden="true">
1200                    
1201                    <input type="text" name="website" tabindex="-1" autocomplete="off" value="">
1202
1203                    
1204                                            <input type="text" name="b_c7c1912bd58997935a2b3a33b_2d29f8cba6" tabindex="-1" autocomplete="off" value="">
1205                                    </div>
1206            </div>
1207            <div class="clear"><input type="submit" value="Subscribe" name="subscribe"
1208                                      id="mc-embedded-subscribe" class="btn btn-primary"></div>
1209            </div>
1210        </div>
1211    </form>
1212
1213    
1214    <noscript>
1215        <form action="https://nifty.us6.list-manage.com/subscribe/post?u=c7c1912bd58997935a2b3a33b&amp;id=2d29f8cba6" method="post"
1216              id="mc-embedded-subscribe-form-noscript" name="mc-embedded-subscribe-form-noscript"
1217              class="validate" target="_blank" novalidate>
1218            <div class="newsletter-wrap">
1219                <div class="newsletter-wrap-inner">
1220                    <div class="form-group">
1221                        <div class="mc-field-group">
1222                            <label for="mce-EMAIL-noscript">Email Address </label>
1223                            <input type="email" value="" placeholder="[email protected]"
1224                                   name="EMAIL" class="form-control required email" id="mce-EMAIL-noscript">
1225                        </div>
1226                        <div style="position: absolute; left: -5000px;" aria-hidden="true">
1227                                                            <input type="text" name="b_c7c1912bd58997935a2b3a33b_2d29f8cba6" tabindex="-1" value="">
1228                                                    </div>
1229                    </div>
1230                    <div class="clear"><input type="submit" value="Subscribe" name="subscribe"
1231                                              class="btn btn-primary"></div>
1232                </div>
1233            </div>
1234        </form>
1235    </noscript>
1236</div>
1237
1238<!--End mc_embed_signup-->
1239                </div>
1240            </div>
1241
1242
1243                            <div class="mw-network">
1244                    <div class="container">
1245                        <div class="row">
1246                            <div class="col-xs-12">
1247                                <div class="mw-network__item"><a href="https://madewithvuejs.com" target="_blank"><img
1248                                            class="img-responsive"
1249                                            src="https://madewithsvelte.com/images/powered-madewithvuejs--white.png?1"
1250                                            alt="Image of MadeWithVueJs.com"/></a></div>
1251                                <div class="mw-network__item"><a href="https://madewithreactjs.com" target="_blank"><img
1252                                            class="img-responsive"
1253                                            src="https://madewithsvelte.com/images/powered-madewithreactjs--white.png?1"
1254                                            alt="Image of MadeWithReactJs.com"/></a></div>
1255                                <div class="mw-network__item"><a href="https://madewithlaravel.com" target="_blank"><img
1256                                            class="img-responsive"
1257                                            src="https://madewithsvelte.com/images/powered-madewithlaravel--white.png?1"
1258                                            alt="Image of MadeWithLaravel.com"/></a></div>
1259                                <div class="mw-network__item"><a href="https://madewithsvelte.com" target="_blank"><img
1260                                            class="img-responsive"
1261                                            src="https://madewithsvelte.com/images/powered-madewithsvelte--white.png?1"
1262                                            alt="Image of MadeWithSvelte.com"/></a></div>
1263                            </div>
1264
1265                        </div>
1266                    </div>
1267                </div>
1268            
1269
1270            <div class="row">
1271                <div class="col-xs-12">
1272                    <div class="footer__copy">
1273                        
1274                                                    <a href="/submit">Submit project</a>
1275                            &bull;
1276                        
1277                                                    <a rel="nofollow" href="https://madewithsvelte.com/update-request">Request project update</a>
1278                            &bull;
1279                        
1280                        <a href="/privacy">Privacy</a>
1281
1282                        &bull;
1283                        <a href="/imprint">Imprint</a>
1284                    </div>
1285                </div>
1286            </div>
1287        </div>
1288
1289    </div>
1290</footer>
1291            <categories v-model="showCategories" inline-template>
1292            <div v-bind:class="{'categories--is-active':show}">
1293                <div @click.stop.prevent="toggle(false)" class="categories__backdrop"></div>
1294                <div class="categories__wrap">
1295                    <button @click.stop.prevent="toggle(false)" id="js-categories__close"
1296                            class="categories__close">
1297                        <svg class="svg-inline icon-close" width="25px" height="25px" viewBox="0 0 25 25" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
1298    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
1299    <title>icon-close-madewithvuejs</title>
1300    <desc>Created with Sketch.</desc>
1301    <defs></defs>
1302    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
1303        <g id="Icons" transform="translate(-426.000000, -13.000000)" fill-rule="nonzero" fill="#40BB84">
1304            <path d="M426.39576,37.6042403 C426.924096,38.1319199 427.780003,38.1319199 428.308339,37.6042403 L438.516282,27.3962977 L448.724224,37.6042403 C449.257419,38.1010759 450.088308,38.0864158 450.603644,37.5710801 C451.11898,37.0557445 451.13364,36.224855 450.636804,35.6916607 L440.428861,25.4837181 L450.636804,15.2757756 C451.13364,14.7425813 451.11898,13.9116918 450.603644,13.3963561 C450.088308,12.8810204 449.257419,12.8663603 448.724224,13.3631959 L438.516282,23.5711385 L428.308339,13.3631959 C427.775145,12.8663603 426.944256,12.8810204 426.42892,13.3963561 C425.913584,13.9116918 425.898924,14.7425813 426.39576,15.2757756 L436.603702,25.4837181 L426.39576,35.6916607 C425.86808,36.2199974 425.86808,37.0759036 426.39576,37.6042403 Z" id="icon-close-madewithvuejs"></path>
1305        </g>
1306    </g>
1307</svg>                    </button>
1308                    <div class="categories__wrap-inner">
1309                        <ul class="categories__menu">
1310
1311                                                                                                <li style="display: none;"
1312                                        class="animated tag--302 categories__menu-item   ">
1313                                        <a class="categories__menu-link"
1314                                           href="/boilerplate">#Boilerplate </a>
1315                                    </li>
1316                                                                                                                                <li style="display: none;"
1317                                        class="animated tag--307 categories__menu-item   ">
1318                                        <a class="categories__menu-link"
1319                                           href="/book">#Book </a>
1320                                    </li>
1321                                                                                                                                <li style="display: none;"
1322                                        class="animated tag--303 categories__menu-item   ">
1323                                        <a class="categories__menu-link"
1324                                           href="/browser-extension">#Browser Extension </a>
1325                                    </li>
1326                                                                                                                                <li style="display: none;"
1327                                        class="animated tag--306 categories__menu-item   ">
1328                                        <a class="categories__menu-link"
1329                                           href="/dev-tool">#Dev tool </a>
1330                                    </li>
1331                                                                                                                                <li style="display: none;"
1332                                        class="animated tag--300 categories__menu-item   ">
1333                                        <a class="categories__menu-link"
1334                                           href="/form">#Form </a>
1335                                    </li>
1336                                                                                                                                <li style="display: none;"
1337                                        class="animated tag--295 categories__menu-item   ">
1338                                        <a class="categories__menu-link"
1339                                           href="/framework">#Framework </a>
1340                                    </li>
1341                                                                                                                                <li style="display: none;"
1342                                        class="animated tag--308 categories__menu-item   ">
1343                                        <a class="categories__menu-link"
1344                                           href="/game">#Game </a>
1345                                    </li>
1346                                                                                                                                <li style="display: none;"
1347                                        class="animated tag--299 categories__menu-item   ">
1348                                        <a class="categories__menu-link"
1349                                           href="/testing">#Testing </a>
1350                                    </li>
1351                                                                                                                                <li style="display: none;"
1352                                        class="animated tag--296 categories__menu-item   ">
1353                                        <a class="categories__menu-link"
1354                                           href="/ui-component">#UI Component </a>
1355                                    </li>
1356                                                                                                                                <li style="display: none;"
1357                                        class="animated tag--304 categories__menu-item   ">
1358                                        <a class="categories__menu-link"
1359                                           href="/ui-library">#UI library </a>
1360                                    </li>
1361                                                                                                                                <li style="display: none;"
1362                                        class="animated tag--298 categories__menu-item   ">
1363                                        <a class="categories__menu-link"
1364                                           href="/utility">#Utility </a>
1365                                    </li>
1366                                                                                                                                <li style="display: none;"
1367                                        class="animated tag--305 categories__menu-item   ">
1368                                        <a class="categories__menu-link"
1369                                           href="/web-app">#Web app </a>
1370                                    </li>
1371                                                                                                                                <li style="display: none;"
1372                                        class="animated tag--301 categories__menu-item   ">
1373                                        <a class="categories__menu-link"
1374                                           href="/website">#Website </a>
1375                                    </li>
1376                                                            
1377                            <li style="display: none;margin-bottom: 35px;"
1378                                class="animated categories__menu-item ">
1379                                <svg class="svg-inline" width="32px" height="6px" viewBox="0 0 32 6" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
1380    <!-- Generator: Sketch 47.1 (45422) - http://www.bohemiancoding.com/sketch -->
1381    <title>icon-divider</title>
1382    <desc>Created with Sketch.</desc>
1383    <defs></defs>
1384    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
1385        <g id="Startseite-Menu" transform="translate(-191.000000, -763.000000)" fill="#435B71">
1386            <g id="Menu-Overlay">
1387                <g id="icon-divider" transform="translate(191.000000, 763.000000)">
1388                    <circle id="Oval-4" cx="16" cy="3" r="3"></circle>
1389                    <circle id="Oval-4" cx="29" cy="3" r="3"></circle>
1390                    <circle id="Oval-4" cx="3" cy="3" r="3"></circle>
1391                </g>
1392            </g>
1393        </g>
1394    </g>
1395</svg>                            </li>
1396                            <li style="display: none;"
1397                                class="animated categories__menu-item   ">
1398                                <a class="categories__menu-all" href="/">View all Projects</a>
1399                            </li>
1400                        </ul>
1401                    </div>
1402                </div>
1403            </div>
1404        </categories>
1405    
1406
1407    <button data-spy="affix" data-offset-top="300" class="button-up visible-xs" id="js-scroll-up"><i
1408                class="far fa-caret-up"></i></button>
1409
1410    
1411        
1412        <newsletter-form
1413                title="Join 1k+ devs discovering the latest projects made with Svelte"
1414                social-proof="We&#039;ll send a monthly recap to your inbox 📩"
1415                subscribe-url="https://madewithsvelte.com/newsletter/subscribe"
1416                success-message="Thanks for signing up! Please check your inbox and confirm your address."
1417                error-message="That didn’t work. Please check your address and try again."
1418                retry-label="Try again"
1419        ></newsletter-form>
1420
1421    
1422    <mwc-search placeholder="Search as you type..." search-error="No Projects found"></mwc-search>
1423
1424
1425
1426</div>
1427
1428
1429<script type="text/javascript">
1430    window.statstowrite = [{"type":"tag","action":"view","id":309},{"type":"sponsor_brick","action":"impression","id":"wjmormcezanw8s6h-amelp5uzzwlco3i8-adpjgyrvbii0iggh-5wtbpvazlh8mjdda"},{"type":"sponsor_logo","action":"impression","id":"hhmcpbaygxb9k0hd-dnw5hbwurjua2nwq-yghygjnewbpw094x-gdkpfcs43aj3ov8o"},{"type":"sponsor_logo","action":"impression","id":"yi7bt3lbmceggbru-atntevqxuyqv7wwv-um3pfry8qo0euydi-kwxdyzjcdbmvkidy"}];
1431</script>
1431
1432
1433<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.20/lodash.min.js" integrity="sha512-90vH1Z83AJY9DmlWa8WkjkV79yfS2n2Oxhsi2dZbIv0nC4E6m5AbH8Nh156kkM7JePmqD6tcZsfad1ueoaovww==" crossorigin="anonymous"></script>
vendor: 1 bytes, line 1433
1433
1434<script src="/js/app.js?id=21e6cc3494fdcd7971c9"></script>
1434
1435
1436
1437<script>
1438    window.FontAwesomeConfig = {
1439        searchPseudoElements: true
1440    }
1441</script>
1441
1442
1443
1444
1445    
1445<script>
1446        (function(d, h, m){
1447            var js, fjs = d.getElementsByTagName(h)[0];
1448            if (d.getElementById(m)){return;}
1449            js = d.createElement(h); js.id = m;
1450            js.onload = function(){
1451                window.makerWidgetComInit({
1452                    position: "left",
1453                    widget: "r9uqyc6u0hyqxsbw-0tyc1jcafgzz68zc-m4go6a6ahubralb1"
1454                })};
1455            js.src = "https://makerwidget.com/js/embed.js";
1456            js.rel = "preconnect";
1457            fjs.parentNode.insertBefore(js, fjs)
1458        }(document, "script", "dhm"))
1459    </script>
1459
1460
1461
1462</body>
1463</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.