Stripe
សៀវភៅគណនេយ្យដែលសរសេរដោយទឹកថ្នាំពណ៌ខៀវលើកញ្ចក់សាយសត្វ
Stripe ប្រើភាសាស្ទើរតែពណ៌តែមួយសម្រាប់ឧបករណ៍ហិរញ្ញវត្ថុ៖ ផ្ទាំងក្រណាត់ពណ៌សទន់ត្រជាក់ជាមួយនឹងចំណងជើងពណ៌ខៀវចាស់ ស្ទើរតែគ្មានធាតុក្រូមតុបតែង និងពណ៌ស្វាយភ្លឺតែមួយ (#533afd) ដែលអាចប្រើជាប៊ូតុង តំណភ្ជាប់ ឬគ្រោងរូបតំណាងបានយ៉ាងត្រឹមត្រូវ។ ពុម្ពអក្សរគឺស្តើងខ្លាំង ជាមួយនឹងទម្ងន់ 300 ចំណុច—សូម្បីតែនៅ 56px—ដែលមានអារម្មណ៍ថាមិនសូវមានលក្ខណៈសាជីវកម្ម។ គម្លាតអក្សរថយចុះយ៉ាងខ្លាំងជាមួយនឹងទំហំកើនឡើង។ ប៊ូតុងមានទំហំតូច ការ៉េ (4px) ហើយប្រើការបំពេញពណ៌ស្វាយ ឬគ្រោងពណ៌ស្វាយស្តើងបំផុត។ ប្រព័ន្ធជៀសវាងស្រមោលទាំងស្រុង; ជម្រៅត្រូវបានសម្រេចតាមរយៈការផ្លាស់ប្តូរពណ៌ផ្ទៃខាងក្រោយ (ពណ៌ស → #f8fafd → #e5edf5 → ពណ៌ស្វាយ) ជាជាងតាមរយៈការកាត់បន្ថយ។ ចំណុចប្រទាក់ទាំងមូលមានឥរិយាបទដូចជាសៀវភៅគណនេយ្យ ឬស្ថានីយ៖ ព័ត៌មានក្រាស់ បន្ទាត់ច្បាស់លាស់ ចន្លោះច្រើនរវាងផ្នែក និងពណ៌លេចឡើងតែនៅពេលដែលសកម្មភាពត្រូវបានទាមទារ។
ទទឹងអតិបរមាគឺ ~1320px សម្រាប់ជួរឈរមាតិកាដែលស្ថិតនៅចំកណ្តាលនៅលើផ្ទាំងក្រណាត់ពណ៌ស។ វីរបុរសគឺជាប្លុកអត្ថបទដែលតម្រឹមខាងឆ្វេងក្នុងទំហំពេញ (56px) ជាមួយនឹងការអំពាវនាវឱ្យធ្វើសកម្មភាពពីរនៅខាងក្រោម គ្មានរូបភាពវីរបុរសទេ—ពុម្ពអក្សរគឺជាវីរបុរស។ ផ្នែកត្រូវបានរៀបចំបញ្ឈរជាមួយនឹងបន្ទាត់រាបស្មើ 96px ស្មើគ្នា និងបន្ទាត់បែងចែក #e5edf5 1px; មិនមានឆ្នូតងងឹត/ភ្លឺឆ្លាស់គ្នាទេ។ ផ្នែកនីមួយៗធ្វើតាមលំនាំដដែលៗ៖ ចំណងជើងផ្នែកតូចមួយដែលមានអក្សរធំទាំងអស់ (ពណ៌ផ្សែង 12px) បន្ទាប់មកចំណងជើង 32-48px បន្ទាប់មកកថាខណ្ឌ 22px បន្ទាប់មកក្រឡាចត្រង្គនៃកាតផលិតផល (ជួរឈរ 3 នៅលើផ្ទៃតុ) ឬប្លុកអត្ថបទ 2 ជួរឈរដែលមានសិល្បៈដែលមើលឃើញ។ ឡូហ្គោអតិថិជនលេចឡើងក្នុងបន្ទះបញ្ឈរតូចចង្អៀត តម្រឹមខាងឆ្វេង។ បាតកថាគឺជាបន្ទះ #f8fafd ធំទូលាយមួយដែលមានបញ្ជីតំណភ្ជាប់ច្រើនជួរឈរ។ ចង្វាក់រួមគឺយឺត វាស់វែង និងជាអត្ថបទជាចម្បង—ដង់ស៊ីតេព័ត៌មានគឺទាប ទោះបីជាប្រវែងរមូរវែងក៏ដោយ។
រូបភាពនេះមានកម្រិត និងមានលក្ខណៈជាឯកសារ។ រូបថតពេញទំព័រលេចឡើងតែនៅក្នុងផ្នែកដែលមានការសិក្សាករណី (ឧទាហរណ៍ ការថតរូបចរាចរណ៍ផ្លូវអាកាសសម្រាប់ Hertz) ដែលថតពីលើ ឬនៅមុំដ៏អស្ចារ្យ ដោយប្រើពណ៌ធម្មជាតិ — គ្មានការកែច្នៃពណ៌ពីរពណ៌ ឬពណ៌ទេ។ រូបថតអេក្រង់នៃចំណុចប្រទាក់អ្នកប្រើប្រាស់របស់ផលិតផលត្រូវបានប្រើនៅក្នុងកាតលក្ខណៈពិសេស ដែលបង្ហាញដោយមុំច្បាស់ និងព្រំដែនច្បាស់លាស់ ដោយគ្មានស៊ុមឧបករណ៍។ ឡូហ្គោដៃគូត្រូវបានបង្ហាញជាពណ៌ផ្ទាល់ខ្លួនរបស់វា ដោយគ្មានធុងណាមួយឡើយ។ មិនមានរូបភាព ការបង្ហាញ 3D ឬធាតុក្រាហ្វិកអរូបីតុបតែងទេ។ រូបតំណាងគឺឯកសណ្ឋាន៖ ទម្ងន់បន្ទាត់ទី 1 ទម្ងន់បន្ទាត់ទី 2 នៅលើផ្ទៃខាងក្រោយពណ៌ស ជាមួយនឹងសិល្បៈបន្ទាត់ធរណីមាត្រ (សញ្ញា chevron ព្រួញ សញ្ញាធីក និមិត្តសញ្ញាឯកសារ)។ ទំព័រនេះមានអត្ថបទ និងចន្លោះពណ៌សជាចម្បង។ រូបភាពកាន់កាប់តិចជាង 3% នៃផ្ទៃដែលមើលឃើញសរុប។
ក្ដារលាយពណ៌
ម៉ាក
- Indigo Ink
#533afd— ពណ៌ស្វាយត្រូវបានប្រើសម្រាប់ប៊ូតុងដែលបានបំពេញ ស្ថានភាពរុករកដែលបានជ្រើសរើស និងពេលវេលាបំប្លែងដែលជំរុញដោយការផ្តោតអារម្មណ៍។ - Indigo Hover
#7389ff— ពណ៌ស្វាយត្រូវបានប្រើដើម្បីបន្លិចតំណភ្ជាប់ ស្លាក និងឃ្លាខ្លីៗ។ វាមិនគួរត្រូវបានប្រើជាពណ៌ចម្បងសម្រាប់ការអំពាវនាវឱ្យធ្វើសកម្មភាពនោះទេ។
អព្យាក្រឹត
- Midnight Ink
#061b31— ចំណងជើងសំខាន់ និងអត្ថបទដើមមានពណ៌ខ្មៅជ្រៅ ស្ទើរតែខ្មៅជាមួយនឹងពណ៌ខៀវត្រជាក់ ដែលបម្រើជាមូលដ្ឋានសម្រាប់ប្រព័ន្ធពុម្ពអក្សរទាំងមូល។ - Slate
#64748d— អត្ថបទពណ៌ប្រផេះបន្លិចតំណភ្ជាប់ ស្លាក និងឃ្លាខ្លីៗ។ - Steel
#50617a— អត្ថបទបន្ថែម និងសម្ភារៈគាំទ្រត្រូវបានដាក់នៅចន្លោះបន្ទះថ្ម និងពណ៌ស្វាយស្រាលៗដែលប្រើលើអាជ្ញាប័ណ្ណរង។ - Smoke
#839bc8— សម្រាប់ចំណងជើងតុបតែងធំៗ និងអត្ថបទអមជាមួយ ពណ៌ស្វាយស្រាលៗត្រូវបានប្រើ - មិនដែលនៅក្នុងកថាខណ្ឌខ្លឹមសារទេ។ - Pure White
#ffffff— ផ្ទាំងក្រណាត់ទំព័រ និងផ្ទៃខាងលើនៃកាត; ផ្ទៃខាងក្រោយលំនាំដើម ដែលអ្វីៗផ្សេងទៀតត្រូវបានវាស់វែង។ - Mist
#f8fafd— ផ្ទៃខាងក្រោយបាតកថា និងបន្ទាត់បែងចែកផ្នែក គឺជាពណ៌ត្រជាក់ស្រាលៗ ដែលបំបែកតំបន់ដែលគ្មានព្រំដែនដែលអាចមើលឃើញ។
អក្សរសាស្ត្រ
ពី 12 ដល់ 56px · 9 ជំហាន
- sohne-var — ការជំនួស៖ Inter Tight (variable · គ្រោង 300, 400 · ពុម្ពអក្សរតែមួយគត់ដែលប្រើនៅក្នុងចំណុចប្រទាក់ទាំងមូលគឺសម្រាប់ចំណងជើង អត្ថបទ ការរុករក ប៊ូតុង និងស្លាក។ ទម្ងន់ 300 មានច្រើនជាងសូម្បីតែទំហំអេក្រង់ 56px ក៏ដោយ ដែលជាលក្ខណៈពិសេសមួយ៖ ចំណងជើងខ្សឹបខ្សៀវជាជាងស្រែក ដោយបង្កើតសិទ្ធិអំណាចតាមរយៈការអត់ធ្មត់ជាជាងកម្រិតសំឡេង។ ទម្ងន់ 400 លេចឡើងតែនៅ 14–16px សម្រាប់ការរុករក និងអត្ថបទប៊ូតុង ដែលការគូសបន្ថែមត្រូវបានទាមទារសម្រាប់ភាពអាចអានបានក្នុងទំហំតូចជាង។
ចន្លោះពេល និងទម្រង់
| គោលបំណង | អត្ថន័យ |
|---|---|
| ដង់ស៊ីតេ | ទូលាយ |
| ជំហានមូលដ្ឋាន | 8px |
| កាំប៊ូតុង | 4px |
| កាំកាត | 4px |
| ស្រមោល | គ្មានព្រំដែនជំនួសឱ្យស្រមោល |
| រវាងផ្នែកនានា | 96px |
| ទទឹងទំព័រ | 1320px |
បញ្ញាសិប្បនិម្មិត (AI) នឹងបង្កើតគេហទំព័ររបស់អ្នកតាមរចនាបថ Stripe ហើយបំពេញវា
- បំពេញជាមួយផលិតផល និងការបង្ហោះតាមរយៈតំណភ្ជាប់ - Instagram, TikTok, Facebook ។
- ផ្ទេរខ្លឹមសារពីគេហទំព័រចាស់របស់អ្នក—គ្រាន់តែបញ្ជាក់អាសយដ្ឋាន។
- ការរចនាទំនើបលើម៉ាស៊ីនល្អបំផុត៖ React ( Next.js) ជាមួយនឹងការបង្ហាញម៉ាស៊ីនមេ និងការបង្កើនប្រសិទ្ធភាព SEO ភ្លាមៗ។
- ការបង្កើនប្រសិទ្ធភាព SEO ដោយស្វ័យប្រវត្តិយ៉ាងពេញលេញសម្រាប់លទ្ធផលស្វែងរក និងអនុសាសន៍បណ្តាញសរសៃប្រសាទ។
រចនាប័ទ្មស្រដៀងគ្នា
- Ui — ផែនការព្យាបាលលើក្រដាសម៉ាត់
- monopo saigon — ពន្លឺរាវ និងភ្លឺចែងចាំងនៅពីក្រោយភាពស្ងប់ស្ងាត់នៃអត្ថបទ — វិចិត្រសាលអត្ថបទពណ៌តែមួយអណ្តែតលើពន្លឺរលាយ
- Ventriloc — ការសង្កេតវិចារណកថានៃទិន្នន័យនៅលើក្រដាសក្តៅ - ធ្យូងពណ៌ទឹកក្រូចតែមួយដែលបង្ហាញពីភាពជាក់លាក់នៃពណ៌តែមួយ។
- Hyer Aviation — ព្រលប់ក្នុងកាប៊ីនយន្តហោះលើក្រណាត់ស្បែក។ មេឃពេលព្រលឹមស្រអែមជួបនឹងឡូហ្គោរាងជាអក្សរសដែលមានទំហំប៉ុនតួយន្តហោះ ហើយការសង្កត់សំឡេងដីឥដ្ឋក្តៅតែមួយគត់បានបំបែកភាពតឹងរ៉ឹងពណ៌តែមួយគត់។
- Family — ការរីករាលដាលពីរឿងនិទាននៅលើក្រដាស់ក្រែម
- OFF+BRAND. — ស្វ៊ែរភ្លឺចែងចាំងលើក្រដាស់ក្តៅ
- Geniestudio — សៀវភៅកត់ត្រាពន្លឺថ្ងៃទន់ៗ — ប្រភេទដែលមានគែមធំទូលាយ និងប៊ិចក្រាស់មួយបន្ទាត់
- xAI — មន្ទីរពិសោធន៍ក្រែមក្តៅជាមួយថ្នាំគ្រាប់ខ្មៅ
- Seed — សារពាង្គកាយមានជីវិតនៅក្រោមកញ្ចក់មន្ទីរពិសោធន៍
- Cosmos — ជញ្ជាំងវិចិត្រសាលមួយដែលមានក្រណាត់ទេសឯក និងព្យួរដោយរូបភាពប៉ូឡារ៉ូអ៊ីត
- Cal — ភាពជាក់ស្តែងពណ៌តែមួយ ជាវិធីសាស្រ្តរបស់មនុស្ស។ ប្រព័ន្ធមួយដែលផ្តល់អាទិភាពដល់ភាពច្បាស់លាស់ និងមុខងារតាមរយៈក្ដារលាយពណ៌ខ្មៅ និងសយ៉ាងតឹងរ៉ឹង ប៉ុន្តែធ្វើឱ្យវាទន់ជាងមុនជាមួយនឹងពុម្ពអក្សរដែលងាយស្រួលប្រើ និងរាងមូល។
- T1 Energy — គំនូរនៃរោងចក្រផលិតមួយនៅលើក្រដាស់ស្បែកក្តៅឧណ្ហៗ គឺជាឈុតឆាកស្ងប់ស្ងាត់ ពណ៌តែមួយ ដែលទ្រង់ទ្រាយឧស្សាហកម្ម និងពុម្ពអក្សរដ៏ស្រទន់ បង្ហាញពីម៉ាកយីហោទាំងមូល។