UI3232

47 Accordion 48 Alerts 49 Avatar 50 Badge 51 Breadcrumb 52 Button 53 Button Group 54 Calendar 55 Card 56 Checkbox 57 Collapsible 58 Combobox 59 Data Table 60 Date Picker 61 Dialog 62 Dropdown Menu 63 Form 64 Input 65 Input Mask 66 Input OTP 67 Pagination 68 Popover 69 Radio Group 70 Select 71 Sheet 72 Slider 73 Sonner 74 Switch 75 Table 76 Tabs 77 Textarea 78 Tooltip

Blocks1010

202 Marketing hero with product shot 203 Marketing feature bento 204 Marketing pricing 205 Marketing testimonials wall 206 Marketing CTA and footer 212 Dashboard shell 213 Sign in 214 Settings page 215 Inbox 216 AI chat app

Charts2929

01 Animated radial chart 99 Live line 101 Route trace 142 Candlestick chart 143 Forecast fan 144 State timeline 145 Spark table 146 Distribution plot 147 Violin plot 148 Beeswarm 149 Slope chart 150 Dumbbell chart 151 Waterfall chart 152 Treemap 153 Streamgraph 154 Scatter brush 155 Correlation matrix 156 Sankey flow 157 Drawdown chart 158 Depth chart 159 Calibration plot 160 Stacked area chart 161 Grouped bar chart 162 Donut chart 163 Funnel chart 164 Cohort retention 165 Calendar heatmap 166 Bullet chart 240 Order book

Interactive66

02 Message dock 03 Voice powered orb 07 Draggable rope 93 Timer 113 Elastic frame 117 Scene states

AI2424

13 AI voice input 103 Agent trace 104 Handoff beam 105 Lattice orb 220 Streaming message 221 Reasoning disclosure 222 Stream status 223 Message branch 224 Response feedback 225 Prompt composer 226 Model selector 227 Attachment chips 228 Suggested prompts 229 Context meter 230 Tool call card 231 Approval gate 232 Diff review 233 Artifact panel 234 Inline AI edit 235 Citation chips 236 Retrieval inspector 237 Memory viewer 238 Response compare 239 Cost meter

Galleries66

04 Ruler carousel 10 Portfolio gallery 32 Hover image gallery 106 Torn edge reveal 107 Mosaic settle 115 Project index

Heroes22

05 Video scroll hero 116 Aperture dive

Shaders66

80 Aurora veil 88 Kinetic dots 90 Silt 91 Intaglio 92 Phosphor 114 Sumi

Tables1420

06 Financial table 43 Contacts table 44 Leads table 45 Resizable table 46 Server management 89 Periodic table 100 Flap ledger 120 Sortable table 121 Pricing table 122 Invoice table 123 Leaderboard 124 Changelog table 125 API reference table 126 File tree table 127 Timetable 128 Shortcuts table 129 Spec sheet 130 Transactions table 131 Spreadsheet grid 132 Permissions matrix

Cards2626

11 Video upload card 16 Animated card options 17 Animated card status list 18 Audio upload card 19 Bonuses incentives card 20 Coach scheduling 21 Dashboard card modal 22 Event countdown card 23 Hover detail card 24 News cards 25 Onboarding stages 26 Prediction market card 27 Product reveal card 28 Profile hover card 29 Project cards 102 Solar sky panel 182 Plan usage card 183 Payment method card 184 Integration card 185 Metric card 186 Shipment card 187 Now playing card 188 Deployment card 189 Team invite card 190 Streak card 191 Link preview card

Badges11

14 Animated status badge

Controls44

31 Gradient selector 95 Adaptive precision slider 96 Click wheel 97 Velocity ink

Navigation22

94 Radial command ring 108 Minimap scrollbar

Utilities33

98 Spring tuner 110 Stroke-morph icon 119 Glow rules

HUD88

09 HUD frame 15 Animated download 34 Glitchy 404 35 Overlay 2 36 HUD button 37 HUD graph 38 HUD status 40 Warning graphic

Feedback11

109 Morph loader

Text1212

33 Reveal text 111 Scatter rewind 112 Plane type 133 Glyph morph 134 Weight wave 135 Decode text 136 Magnetic letters 137 Slice shift 138 Stroke draw type 139 Ink bleed text 140 Liquid text 141 Chromatic text

Components•News cards

Components•News cards

News cards

A responsive news card set with animated editorial cards and stacked content rhythm.

Dependencies

Copy below cli

npx shadcn add @bjork-ui/news-cards

How to use

import { NewsCards } from "@/components/bjork-ui/cards/news-cards";export function Demo() {  return <NewsCards />;}

PreviousHover detail card NextOnboarding stages

News Today

Stories from all over the world

Port Alder council approves a riverside tram line for next spring

City Life, Transit

15 min ago, Port Alder

Port Alder council approves a riverside tram line for next spring

Researchers map a new cold-water reef off the Halden coast

Science, Oceans

41 min ago, Halden coast

Researchers map a new cold-water reef off the Halden coast

Night market returns to the Lantern Quarter after a two-year break

Culture, Food

1 hour ago, Lantern Quarter

Night market returns to the Lantern Quarter after a two-year break